@charset "utf-8";

@import url("/css/fonts.css");

html { line-height:1.15; -webkit-text-size-adjust:100%; }
body { margin:0; }
main { display:block; }
hr { box-sizing:content-box; height:0; overflow:visible; }
pre { font-family:monospace, monospace; font-size:1em; }
a { background-color:transparent; }
abbr[title] { border-bottom:none; text-decoration:underline; text-decoration:underline dotted; }
b,strong { font-weight:bolder; }
code, kbd, samp { font-family:monospace, monospace; font-size:1em; }
small { font-size:80%; }
sub, sup { font-size:75%; line-height:0; position:relative; vertical-align:baseline; }
sub { bottom:-0.25em; }
sup { top:-0.5em; }
img { border-style:none; }
button, input, optgroup, select, textarea { font-family:inherit; font-size:100%; line-height:1.15; margin:0; }
button, input { overflow:visible; }
button, select { text-transform:none; }
button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance:button; }
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style:none; padding:0; }
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline:1px dotted ButtonText; }
fieldset { padding:0.35em 0.75em 0.625em; }
legend { box-sizing:border-box; color:inherit; display:table; max-width:100%; padding:0; white-space:normal; }
progress { vertical-align:baseline; }
textarea { overflow:auto; }
[type="checkbox"], [type="radio"] { box-sizing:border-box; padding:0; }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height:auto; }
[type="search"] { -webkit-appearance:textfield; outline-offset:-2px; }
[type="search"]::-webkit-search-decoration { -webkit-appearance:none; }
::-webkit-file-upload-button { -webkggit-appearance:button; font:inherit; }
details { display:block; }
summary { display:list-item; }
template { display:none; }
[hidden] { display:none; }

* { margin:0; padding:0; border:0; box-sizing:border-box; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, button, cite, code,del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, 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, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
font:inherit;  background:none; }
table, tr, td, th { border-collapse:collapse; border-spacing:0px; }
ol, ul, li { list-style:none; }
hr,legend { display:none; }
caption { width:0; height:0; font-size:0; overflow:hidden; padding:0; }
sup { vertical-align:text-top; }
sub { vertical-align:text-bottom; }
strong, b { font-weight:bold; }
button,select { cursor:pointer; }
input,textarea,select {  font-size:inherit;  font-weight:inherit; }
a, a:hover, a:focus, a:visited { text-decoration:none; color:#555; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,q:before, q:after { content:''; content:none; }

.blind { display:block;  overflow:hidden;  position:absolute !important;  left:-9999px;  width:1px;  height:1px;  font-size:0;  line-height:0;  text-indent:-9999px; }
.blank { margin:0;  padding:0;  border:none;  background:none; }
.clearfix:before, .clearfix:after { content:""; display:table; padding:0; }
.clearfix:after { clear:both; }
.tct { text-align:center; }
.tlt { text-align:left; }
.trt { text-align:right; }
.vam { vertical-align:middle; }
.vat { vertical-align:top; }
.vab { vertical-align:bottom; }
.fl { float:left; }
.fr { float:right; }
.ulfl > li { float:left; }
.ulfr > li { float:right; }
.ib { display:inline-block; }
.keep { word-break:keep-all; }
.btnc { display:inline-block; cursor:pointer; text-align:center; }
.mobile { display:none; }
xmp { margin:10px auto; width:100%; max-width:1200px; border:1px solid #aaa; padding:20px; }

.h1, .h2, .h3, h1, h2, h3 { margin-top:0; padding-top:20px; }

body { font-family:'Nanum Gothic', sans-serif; font-size:15px; color:#666; }
body.op1 { background-color:#ebecee; background-image:url("/images/bg_02.png"), url("/images/bg_01.png"); background-position:left calc(50% - 730px) bottom -550px, right calc(50% - 650px) top -150px; background-repeat:no-repeat, no-repeat; background-size:auto 1330px, auto 465px; }

.wrap { width:100%; background:url("/images/login/bg.gif") center top no-repeat; }
.wrap.op1 { background:none; }

.container { width:100%; max-width:800px; }
.container2 { margin:0 auto; position:relative; width:1400px; }

#hd { width:100%; max-width:770px; margin:0 auto 45px; padding:55px 10px 0; background:url(/images/login/bg_logo.png) center 70px no-repeat; }
#hd h1 { text-align:center; padding:0 40px 0 0; margin:0; }

.login_contents_wrap { padding:0 10px; }
.login_contents_wrap section { position:relative; width:49%; max-width:360px; border-radius:40px; overflow:hidden; padding:40px; }
.login_contents_wrap section:before { content:""; position:absolute; top:15px; right:15px; width:78px; height:78px; border-radius:50%; }
.login_contents_wrap section h1 { margin-bottom:15px; }
.login_contents_wrap section .subtxt { height:36px; margin-bottom:20px; }
.login_contents_wrap section .login_box { background:#fff; border-radius:15px; padding:45px 30px 30px; box-shadow:22px 22px 35px rgba(148,148,148,0.5); }
.login_contents_wrap section .login_box .btn_wrap { margin:0; text-align:center; }

#login_parents { float:left; background:#fff url(/images/login/bg_green.gif) center top no-repeat; }
#login_parents:before { background:rgba(255,255,255,0.2) url(/images/login/i_parents.png) center no-repeat; }
#login_parents .login_box > ul { border:1px solid #e8e8ea; border-bottom:0; margin:40px 0 10px; }
#login_parents .login_box > ul > li > a { color:#676767; border-bottom:1px solid #e8e8ea; display:inline-block; width:100%; height:50px; padding-top:20px; line-height:19px; text-align:center; font-size:14px; background:#fbfbfb; }
#login_parents .login_box > ul > li > a:focus,
#login_parents .login_box > ul > li > a:hover { font-weight:bold; }
#login_parents .login_box > ul:nth-of-type(2) { border:1px solid #ccc; margin-top:0; border-bottom:0; }
#login_parents .login_box > ul:nth-of-type(2) > li > a { background-color:#eceff3; border-bottom:1px solid #ccc; }

#login_system { float:right; background:#fff url(/images/login/bg_blue.gif) center top no-repeat; }
#login_system:before { background:rgba(255,255,255,0.2) url(/images/login/i_school.png) center no-repeat; }
#login_system .login_box { padding:15px 30px 15px; }
#login_system .login_box > form > ul { margin:0; }
#login_system .input_txt { line-height:48px; width:100%; height:48px; border:0; background-color:#fff; border-bottom:1px solid #e8e8ea; padding:0 5px; }
#login_system .input_txt::placeholder { color:#a8a8a8; font-size:14px; }
#login_system .btn_black { margin:20px 0; }
#login_system .links { line-height:20px; font-size:14px; text-align:center; margin:0; }
#login_system .guide_box { margin-top:22px; width:100%; background:#eceff3; border-radius:15px; padding:15px; font-size:14px; }
#login_system .guide_box p { font-weight:bold; line-height:20px; color:#515151; margin:0; }
#login_system .guide_box a { padding-right:60px; line-height:30px; background:url(/images/login/quick.png) right center no-repeat; }
#login_system .guide_box.t1 { line-height:18px; border-radius:15px 15px 0 0; background-color:#cad1e8; padding:18px 15px; }
#login_system .guide_box.t1 a { margin-top:12px; display:inline-block; width:100%; padding-left:10px; line-height:25px; background:#eaedf6 url(/images/login/quick2.png) right center no-repeat; }
#login_system .guide_box.t2 { line-height:18px; border-radius:0 0 15px 15px; margin-top:0; padding:18px 15px; }
#login_system .guide_box.t2 a { margin-top:13px; background:#4e64a9; color:#fff; border-radius:17px; line-height:25px; height:25px; text-align:center; padding:0 15px; }

.remote_wrap { padding:35px 10px 60px; text-align:center; }

.btn_black { background:#494949; line-height:22px; font-size:17px; padding:15px 5px; border-radius:26px; color:#fff; font-weight:bold; width:100%; max-width:220px; }
.btn_black:focus,
.btn_black:hover { color:#fff; background-color:#111; }

#ft { background-color:#4b5566; text-align:center; }

#ft .ft1 { border-bottom:1px solid #5b6575; padding:24px 10px 12px; }
#ft .ft1 > ul { margin:0 auto; }
#ft .ft1 > ul > li { display:inline-block; min-height:39px; margin-bottom:10px; }
#ft .ft1 .privacy { padding:10px 0; }
#ft .ft1 .privacy:after { content:"/"; margin:0 15px 0 30px; color:#fff; }
#ft .ft1 .privacy a { color:#fff; font-size:14px; line-height:19px; }
#ft .ft1 .fmsite { font-size:14px; }
#ft .ft1 .fmsite label { color:#fff; margin-right:10px; display:inline-block; padding-left:15px; }
#ft .ft1 .fmsite select { height:39px; min-width:160px; background-color:#68707f; color:#bfc2c4; }
#ft .ft1 .fmsite .btn_go { background:#5d7cb0; color:#fff; width:39px; height:39px; border-radius:0; vertical-align:top; padding:0; text-align:center; }

#ft .ft2 { color:#a7acb4; padding:18px 0; line-height:20px; }
#ft .ft2 .ft_copy { font-size:13px; }
#ft .ft2 .ft_copy span { text-transform:uppercase; }

.modal-open { padding-right:17px !important; font-family:'Noto Sans', sans-serif; }
.modal { padding:10px !important; }
.modal.modal_wide .modal-dialog { width:100%; max-width:1220px; }
.modal.md_depth2 .modal-dialog { margin:50px auto; }
.modal.md_depth3 .modal-dialog { margin:70px auto; }
.modal-content { border-radius:10px; overflow:hidden; text-align:left; }
.modal-body { padding:40px; }
.modal-header { background:linear-gradient(to right,#c7e4f5,#f8f2df); padding:13px 13px 13px 30px; line-height:55px; }
.modal-header .close { margin-top:0; width:55px; height:55px; border:1px solid #080808; color:#080808; line-height:55px; text-align:center; opacity:1; border-radius:10px; font-size:30px; }
.modal-header h4 { font-size:27px; color:#080808; line-height:55px; font-weight:bold; }

.btn_wrap ul.ulfl > li { margin-right:5px; padding:3px 0; }

.table_topline { position:relative; border-top:1px solid #454b57; }
.table_topline > .table { margin-top:-1px; }
.table_bottomline .table { border-bottom:1px solid #d9d9d9; }
.table_outnone { border-color:transparent; }
.table.table-bordered th { background:#f8f8f8; vertical-align:middle; font-weight:bold; }
.table.table-bordered th.vat { vertical-align:top; }
.table.table-bordered td { vertical-align:middle; }
.table.tct,
.table.tct th { text-align:center; }
.table .tr_first th,
.table .tr_first td { border-top:0; }

.form-control.w0 { width:100%; }

a.text-primary { color:#337ab7; }
.btn.btn-sblue { background:#648ed4; color:#fff; }
.btn.btn-sblue.active,
.btn.btn-sblue:hover,
.btn.btn-sblue:focus { background-color:#5479b5; }
.btn.btn-gray { background-color:#8d8d8d; color:#fff; }
.btn.btn-gray.active,
.btn.btn-gray:hover,
.btn.btn-gray:focus { background-color:#666; }

body#login_internal { background-color:#363835; }
.wrap_internal { text-align:center; }
#hd_internal > h1 { padding:40px 0 30px; margin:0; background-color:#fff; }
body#login_internal .container { max-width:100%; }
.login_internal_contents_wrap .login_internal_visual { background:url(/images/login/visual_internal.jpg) no-repeat 50% 0; padding-bottom:36%; background-size:cover;  }
.login_internal_contents_wrap { width:100%; }
.internal_login_fieldset { margin-top:44px; }
.internal_input_txt { width:299px; margin:0 0 10px 16px; padding:20px 25px; background-color:#565656; color:#fff; font-size:18px; }
.btn_internal_login { padding:19px 85px 20px; background-color:#52607a; color:#fff; border-radius:0; margin-left:16px; font-size:18px; }

/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/

.con_login { }
.con_login_c1 { padding:60px 0 60px 0; overflow:hidden; text-align:center; transition:all 0.3s ease; }
.con_login_c1 img { margin:0 auto; transition:all 0.3s ease; }

.con_login_c2 { transition:all 0.3s ease; }
.con_login_c2 .con1 { margin:0 60px 90px 0; position:relative; float:left; width:calc((100% - 60px) /2); height:610px; overflow:hidden; background:#ffffff url("/images/ic_01.png") no-repeat right 70px top 90px; border-radius:36px; box-shadow:0 0 20px 10px rgba(0, 0, 0, 0.05); transition:all 0.3s ease; }
.con_login_c2 .con1 i.bg1 { position:absolute; left:-480px; top:-600px; content:""; display:inline-block; width:700px; height:700px; background:#2d43b7; border-radius:100%; transition:all 0.3s ease; }
.con_login_c2 .con1 i.bg2 { position:absolute; right:-330px; bottom:-500px; content:""; display:inline-block; width:700px; height:700px; background:#2d43b7; border-radius:100%; transition:all 0.3s ease; }
.con_login_c2 .con1_c { padding:60px 80px 70px 80px; position:absolute; left:0; top:0; width:100%; transition:all 0.3s ease; }
.con_login_c2 .con1_c h2 { font-family:"Pretendard"; color:#222222; font-size:33px; font-weight:800; line-height:1.0; letter-spacing:-0.05em; transition:all 0.3s ease; }
.con_login_c2 .con1_c p { margin:15px 0 0 0; font-family:"Pretendard"; color:#666666; font-size:15px; font-weight:400; line-height:1.3; letter-spacing:-0.03em; transition:all 0.3s ease; }
.con_login_c2 .con1_1 { padding:65px 15% 70px 15%; text-align:center; transition:all 0.3s ease; }
.con_login_c2 .con1_1 a { padding:18px 0 18px 0; display:block; font-family:"Pretendard"; color:#555555; font-size:18px; font-weight:700; line-height:1.0; text-align:center; letter-spacing:-0.03em; border:2px solid #333333; border-radius:12px; transition:all 0.3s ease; }
.con_login_c2 .con1_1 a:hover { color:#ffffff; background:#333333; }
.con_login_c2 .con1_2 { padding:0 3% 60px 3%; transition:all 0.3s ease; }
.con_login_c2 .con1_2 ul { padding:35px 40px 20px 50px; overflow:hidden; background:#f6f6f6; border-radius:24px; box-shadow:0 0 6px 3px rgba(0, 0, 0, 0.08); transition:all 0.3s ease; }
.con_login_c2 .con1_2 ul li { margin:0 20px 15px 0; float:left; width:calc((100% - 20px) / 2); transition:all 0.3s ease; }
.con_login_c2 .con1_2 ul li:nth-child(2n) { margin:0 0 15px 0; }
.con_login_c2 .con1_2 ul li a { position:relative; display:block; font-family:"Pretendard"; color:#555555; font-size:15px; font-weight:500; line-height:1; letter-spacing:-0.02em; transition:all 0.3s ease; }
.con_login_c2 .con1_2 ul li a:after { position:absolute; right:15px; top:2px; content:""; display:inline-block; width:5px; height:9px; background:url("/images/arrow_01.png") no-repeat 0 0; transition:all 0.3s ease; }
.con_login_c2 .con1_2 ul li a:hover { color:#111111; font-weight:600; text-decoration:underline; text-underline-position:under; }
.con_login_c2 .con1_2 ul li a:hover:after { right:10px; }

.con_login_c2 .con2 { position:relative; float:left; width:calc((100% - 60px) /2); height:610px; overflow:hidden; background:#ffffff url("/images/ic_02.png") no-repeat right 70px top 90px; border-radius:36px; box-shadow:0 0 20px 10px rgba(0, 0, 0, 0.05); transition:all 0.3s ease; }
.con_login_c2 .con2 i.bg1 { position:absolute; left:-480px; top:-600px; content:""; display:inline-block; width:700px; height:700px; background:#0bb664; border-radius:100%; }
.con_login_c2 .con2 i.bg2 { position:absolute; right:-330px; bottom:-500px; content:""; display:inline-block; width:700px; height:700px; background:#0bb664; border-radius:100%; }
.con_login_c2 .con2_c { padding:60px 80px 70px 80px; position:absolute; left:0; top:0; width:100%; transition:all 0.3s ease; }
.con_login_c2 .con2_c h2 { font-family:"Pretendard"; color:#222222; font-size:33px; font-weight:800; line-height:1.0; letter-spacing:-0.05em; transition:all 0.3s ease; }
.con_login_c2 .con2_c p { margin:15px 0 0 0; font-family:"Pretendard"; color:#666666; font-size:15px; font-weight:400; line-height:1.3; letter-spacing:-0.03em; transition:all 0.3s ease; }
.con_login_c2 .con2_1 { padding:50px 14% 37px 14%; text-align:center; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1 { overflow:hidden; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_1 { margin:0 10px 0 0; float:left; width:calc(100% - 110px); transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_1 ul { overflow:hidden; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_1 ul li { margin:0 0 12px 0; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_1 ul li:last-child { margin:0 0 0 0; }
.con_login_c2 .con2_1 .cons1_1 ul li input[type="text"] { padding:0 20px 0 20px; width:100%; height:50px; font-family:"Pretendard"; color:#333333; font-size:14px; font-weight:500; letter-spacing:-0.03em; background:#f9f9f9; border:1px solid #777777; border-radius:8px; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_1 ul li input[type="password"] { padding:0 20px 0 20px; width:100%; height:50px; font-family:"Pretendard"; color:#333333; font-size:14px; font-weight:500; letter-spacing:-0.03em; background:#f9f9f9; border:1px solid #777777; border-radius:8px; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_2 { float:left; width:100px; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_2 a { padding:45px 0 45px 0; display:block; font-family:"Pretendard"; color:#555555; font-size:18px; font-weight:700; line-height:1.0; text-align:center; letter-spacing:-0.03em; border:2px solid #333333; border-radius:12px; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons1_2 a:hover { color:#ffffff; background:#333333; }
.con_login_c2 .con2_1 .cons2 { margin:2px 0 0 0; overflow:hidden; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons2_1 { float:left; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons2_1 input[type="checkbox"] { margin:-1px 6px 0 0; width:18px; height:18px; vertical-align:middle; cursor:pointer; }
.con_login_c2 .con2_1 .cons2_1 label { display:inline-block; font-family:"Pretendard"; color:#555555; font-size:14px; font-weight:400; letter-spacing:-0.02em; cursor:pointer; }
.con_login_c2 .con2_1 .cons2_2 { float:right; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons2_2 ul { overflow:hidden; }
.con_login_c2 .con2_1 .cons2_2 ul li { float:left; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons2_2 ul li a { font-family:"Pretendard"; color:#555555; font-size:14px; font-weight:400; letter-spacing:-0.02em; transition:all 0.3s ease; }
.con_login_c2 .con2_1 .cons2_2 ul li a:hover { color:#111111; font-weight:500; }
.con_login_c2 .con2_1 .cons2_2 ul li:after { padding:0 8px 0 8px; content:"|"; color:#cccccc; font-size:12px; text-align:center; }
.con_login_c2 .con2_1 .cons2_2 ul li:last-child:after { padding:0 0 0 0; content:none; }
.con_login_c2 .con2_2 { padding:0 3% 60px 3%; transition:all 0.3s ease; }
.con_login_c2 .con2_2 ul { padding:50px 30px 50px 30px; overflow:hidden; background:#f6f6f6; border-radius:24px; box-shadow:0 0 6px 3px rgba(0, 0, 0, 0.08); transition:all 0.3s ease; }
.con_login_c2 .con2_2 ul li { margin:0 0 10px 0; font-family:"Pretendard"; color:#555555; font-size:15px; font-weight:500; line-height:1.3; letter-spacing:-0.02em; word-break:keep-all; transition:all 0.3s ease; }
.con_login_c2 .con2_2 ul li:last-child { margin:0 0 0 0; }
.con_login_c2 .con2_2 ul li a { position:relative; display:inline-block; font-family:"Pretendard"; color:#111111; font-size:15px; font-weight:700; line-height:1; letter-spacing:-0.02em; transition:all 0.3s ease; }
.con_login_c2 .con2_2 ul li a:after { margin:0 0 0 10px; content:""; display:inline-block; width:5px; height:9px; background:url("/images/arrow_01.png") no-repeat 0 0; transition:all 0.3s ease; }
.con_login_c2 .con2_2 ul li a:hover { color:#f67400; font-weight:600; text-decoration:underline; text-underline-position:under; }
.con_login_c2 .con2_2 ul li a:hover:after { margin:0 0 0 15px; }

.con_login_c3 { padding:50px 0 50px 0; clear:both; overflow:hidden; background:#243642; transition:all 0.3s ease; }
.con_login_c3 .con1 { overflow:hidden; transition:all 0.3s ease; }
.con_login_c3 .con1 ul { overflow:hidden; }
.con_login_c3 .con1 ul li { margin:0 34px 0 0; padding:0 0 1px 0; position:relative; float:left; font-family:"Pretendard"; color:#bec3c7; font-size:17px; font-weight:400; line-height:1.5; letter-spacing:-0.02em; word-break:keep-all; transition:all 0.3s ease; }
.con_login_c3 .con1 ul li a {font-family:"Pretendard"; color:#bec3c7; font-size:17px; font-weight:400; letter-spacing:-0.02em; transition:all 0.3s ease; }
.con_login_c3 .con1 ul li a:hover { text-decoration:underline; text-underline-position:under; }
.con_login_c3 .con1 ul li a.fop1 { color:#ffaf03; }
.con_login_c3 .con1 ul li a.fop2 { color:#03fde8; font-weight:600; }
.con_login_c3 .con1 ul li.op1 { margin:0 6px 0 0; }
.con_login_c3 .con1 ul li:last-child { margin:-4px 0 0 0; font-family:"Pretendard"; color:#d7d9db; font-size:20px; font-weight:700; transition:all 0.3s ease; }
.con_login_c3 .con1 ul li:after { position:absolute; right:-18px; top:9px; content:""; display:inline-block; width:4px; height:4px; background:#929ba1; border-radius:100%; transition:all 0.3s ease; }
.con_login_c3 .con1 ul li:last-child:after { padding:0 0 0 0; content:none; }
.con_login_c3 .con1 ul li.op1:after { content:none; }
.con_login_c3 .con1 ul li.fop1 { color:#a6fd03; font-weight:600; }

.con_login_c3 .con2 { margin:20px 0 0 0; overflow:hidden; transition:all 0.3s ease; }
.con_login_c3 .con2 ul { overflow:hidden; }
.con_login_c3 .con2 ul li { margin:0 0 5px 0; font-family:"Pretendard"; color:#999999; font-size:14px; font-weight:400; line-height:1.3; word-break:keep-all; transition:all 0.3s ease; }
.con_login_c3 .con2 ul li:last-child { margin:0 0 0 0; }
.con_login_c3 .con2 ul li i { display:inline-block; width:18px; }

.con_login_c3 .con3 { position:absolute; right:0px; bottom:-10px; transition:all 0.3s ease; }
.con_login_c3 .con3 ul { overflow:hidden; }
.con_login_c3 .con3 ul li { margin:0 10px 0 0; float:left; transition:all 0.3s ease; }
.con_login_c3 .con3 ul li:last-child { margin:0 0 0 0; }
.con_login_c3 .con3 select { padding:0 0 0 25px; width:200px; height:35px; font-family:"Pretendard"; color:#777777; font-size:15px; font-weight:500; letter-spacing:-0.02em; border:none; border-radius:60px; cursor:pointer; appearance:none; background:#ffffff url("/images/arrow_02.png") no-repeat right 20px center; transition:all 0.3s ease; }

/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/

@media only screen and (max-width:1399px){

	.container2 { padding:0 20px 0 20px; width:100%; }

	.con_login_c2 .con1_c { padding:60px 60px 70px 60px; }
	.con_login_c2 .con1_1 { padding:65px 10% 70px 10%; }
	.con_login_c2 .con1_2 { padding:0 0 60px 0; }
	.con_login_c2 .con1_2 ul { padding:35px 20px 20px 30px; }

	.con_login_c2 .con2_c { padding:60px 60px 70px 60px; }
	.con_login_c2 .con2_1 { padding:50px 8% 37px 8%; }
	.con_login_c2 .con2_2 { padding:0 0 60px 0; }
	.con_login_c2 .con2_2 ul { padding:40px 30px 40px 30px; }

	.con_login_c3 .con3 { right:20px; }

}

/* MD */
@media only screen and (max-width:1199px){

	.con_login_c2 .con1 { margin:0 30px 60px 0; width:calc((100% - 30px) /2); background:#ffffff url("/images/ic_01.png") no-repeat right 40px top 90px; }

	.con_login_c2 .con1_c { padding:60px 40px 70px 40px; }
	.con_login_c2 .con1_1 { padding:65px 8% 70px 8%; }
	.con_login_c2 .con1_2 ul { padding:35px 20px 20px 20px; }
	.con_login_c2 .con1_2 ul li { margin:0 10px 15px 0; width:calc((100% - 10px) / 2); }
	.con_login_c2 .con1_2 ul li a:after { right:10px; }
	.con_login_c2 .con1_2 ul li a:hover:after { right:5px; }

	.con_login_c2 .con2 { width:calc((100% - 30px) /2); background:#ffffff url("/images/ic_02.png") no-repeat right 40px top 90px; }
	.con_login_c2 .con2_c { padding:60px 40px 70px 40px; }
	.con_login_c3 .con2 ul li i.op1 { display:block; width:100%; }

}

@media only screen and (max-width:1199px){

	.con_login_c3 .con3 { margin:15px 0 0 0; position:static; }

}

/* SM */
@media only screen and (max-width:991px){

	.con_login_c2 .con1 { margin:0 0 30px 0; width:100%; background:#ffffff url("/images/ic_01.png") no-repeat right 70px top 90px; }

	.con_login_c2 .con1_c { padding:60px 80px 70px 80px; }
	.con_login_c2 .con1_1 { padding:65px 15% 70px 15%; }
	.con_login_c2 .con1_2 ul { padding:35px 40px 20px 50px; }
	.con_login_c2 .con1_2 ul li { margin:0 20px 15px 0; width:calc((100% - 20px) / 2); }
	.con_login_c2 .con1_2 ul li a:after { right:15px; }
	.con_login_c2 .con1_2 ul li a:hover:after { right:10px; }

	.con_login_c2 .con2 { margin:0 0 50px 0; width:100%; background:#ffffff url("/images/ic_02.png") no-repeat right 70px top 90px;}
	.con_login_c2 .con2_c { padding:60px 80px 70px 80px; }
	.con_login_c2 .con2_1 { padding:50px 8% 37px 8%; }
	.con_login_c2 .con2_2 { padding:0 3% 60px 3%; }
	.con_login_c2 .con2_2 ul { padding:50px 30px 50px 30px; }

	.con_login_c3 { padding:50px 10px 50px 10px; }
	.con_login_c3 .con1 ul li.op1 { clear:both; margin:10px 6px 0 0; }
	.con_login_c3 .con1 ul li:last-child { margin:7px 0 0 0; }
	.con_login_c3 .con1 ul li.op2:after { content:none; }

}

/* XS */
@media only screen and (max-width:767px){

	.con_login_c1 { padding:40px 20px 40px 20px; }

	.con_login_c2 .con1 { height:auto; background:#ffffff url("/images/ic_01.png") no-repeat right 35px top 80px; background-size:auto 40px; border-radius:18px; }
	.con_login_c2 .con1 i.bg1 { top:-620px; }
	.con_login_c2 .con1 i.bg2 { bottom:-630px; }
	.con_login_c2 .con1_c { padding:60px 30px 40px 30px; position:static; }
	.con_login_c2 .con1_c h2 { font-size:28px; }
	.con_login_c2 .con1_c p { font-size:14px; }
	.con_login_c2 .con1_1 { padding:50px 0 50px 0; }
	.con_login_c2 .con1_1 a { padding:16px 0 16px 0; display:block; font-size:17px; }
	.con_login_c2 .con1_2 { padding:0 0 40px 0; }
	.con_login_c2 .con1_2 ul { padding:30px 25px 20px 30px; border-radius:12px; }
	.con_login_c2 .con1_2 ul li { margin:0 20px 12px 0; width:calc((100% - 20px) / 2); }
	.con_login_c2 .con1_2 ul li:nth-child(2n) { margin:0 0 12px 0; }
	.con_login_c2 .con1_2 ul li a { font-size:14px; }

	.con_login_c2 .con2 { height:auto; background:#ffffff url("/images/ic_02.png") no-repeat right 35px top 80px; background-size:auto 40px; border-radius:18px; }
	.con_login_c2 .con2 i.bg1 { top:-620px; }
	.con_login_c2 .con2 i.bg2 { bottom:-630px; }
	.con_login_c2 .con2_c { padding:60px 30px 40px 30px; position:static; }
	.con_login_c2 .con2_c h2 { font-size:28px; }
	.con_login_c2 .con2_c p { font-size:14px; }
	.con_login_c2 .con2_1 { padding:40px 0 30px 0; }
	.con_login_c2 .con2_1 .cons1_1 { width:calc(100% - 90px); }
	.con_login_c2 .con2_1 .cons1_1 ul li input[type="text"] { padding:0 10px 0 10px; height:45px; }
	.con_login_c2 .con2_1 .cons1_1 ul li input[type="password"] { padding:0 10px 0 10px; height:45px; }
	.con_login_c2 .con2_1 .cons1_2 { width:80px; }
	.con_login_c2 .con2_1 .cons1_2 a { padding:40px 0 40px 0; font-size:17px; }
	.con_login_c2 .con2_1 .cons2 { margin:5px 0 0 0; }
	.con_login_c2 .con2_1 .cons2_1 input[type="checkbox"] { margin:-1px 6px 0 0; width:17px; height:17px; }
	.con_login_c2 .con2_2 { padding:0 0 40px 0; }
	.con_login_c2 .con2_2 ul { padding:30px 30px 30px 30px; border-radius:12px; }
	.con_login_c2 .con2_2 ul li { font-size:14px; }
	.con_login_c2 .con2_2 ul li a { font-size:14px; }

	.con_login_c3 { padding:40px 20px 40px 20px; }
	.con_login_c3 .con1 ul li { margin:0 30px 0 0; font-size:14px; }
	.con_login_c3 .con1 ul li a { font-size:14px; }
	.con_login_c3 .con1 ul li.op1 { margin:13px 6px 0 0; }
	.con_login_c3 .con1 ul li:last-child { margin:9px 0 0 0; font-size:18px; }
	.con_login_c3 .con1 ul li:after { top:8px; }

	.con_login_c3 .con2 ul li { font-size:13px; }
	.con_login_c3 .con2 ul li i { width:10px; }

	.con_login_c3 .con3 select { padding:0 0 0 20px; width:200px; height:35px; font-size:14px; }

}

/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/

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

	.wrap { background:#edf5f1; }
	#hd { padding:20px 10px; margin-bottom:20px; background:none; }
	.login_contents_wrap section { padding:20px; }

}

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

	.login_contents_wrap section { width:100%; margin-bottom:20px; max-width:100%; border-radius:20px; }
	.login_contents_wrap section h1 { margin:0 0 10px; padding:0; }
	.login_contents_wrap section .login_box { padding:10px; }
	.login_contents_wrap section .subtxt { height:auto; }

	#login_parents { background:#46bf9e; }
	#login_parents .login_box > ul { margin-top:10px; }
	#login_parents .login_box > ul > li > a { height:40px; padding-top:11px; }

	#login_system { background:#4c62a8; }

}

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

	.con_login_c1 { padding:30px 20px 30px 20px; }

	.con_login_c2 .con1 { background:#ffffff url("/images/ic_01.png") no-repeat right 25px top 25px; background-size:auto 35px; }
	.con_login_c2 .con1_2 { padding:0 0 30px 0; }
	.con_login_c2 .con1_2 ul { padding:25px 20px 20px 20px; }
	.con_login_c2 .con1_2 ul li { margin:0 0 10px 0; width:100%; }
	.con_login_c2 .con1_2 ul li:nth-child(2n) { margin:0 0 10px 0; }
	.con_login_c2 .con1_2 ul li a:after { right:5px; }
	.con_login_c2 .con1_2 ul li a:hover:after { right:0px; }

	.con_login_c2 .con2 { background:#ffffff url("/images/ic_02.png") no-repeat right 25px top 25px; background-size:auto 35px; }
	.con_login_c2 .con2_1 { padding:30px 0 30px 0; }
	.con_login_c2 .con2_1 .cons1_1 { width:calc(100% - 80px); }
	.con_login_c2 .con2_1 .cons1_2 { width:70px; }
	.con_login_c2 .con2_1 .cons2_1 label { font-size:13px; }
	.con_login_c2 .con2_1 .cons2_2 ul li a { font-size:13px; }
	.con_login_c2 .con2_2 { padding:0 0 30px 0; }
	.con_login_c2 .con2_2 ul { padding:25px 20px 20px 20px; }

	.con_login_c3 { padding:35px 0 35px 0; }
	.con_login_c3 .con2 ul li i { width:5px; }

}

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

	#ft .ft1 .privacy { width:100%; }
	#ft .ft1 .privacy:after { display:none; }

}

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

	.con_login_c3 .con3 ul li { margin:0 0 10px 0; width:100%; }

}

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

	.con_login_c1 { padding:30px 5px 30px 5px; }
	.con_login_c2 .con1_c h2 { font-size:24px; }
	.con_login_c2 .con2_c h2 { font-size:24px; }
	.con_login_c3 .con1 ul li:last-child { margin:0 0 0 0; font-size:17px; }
	.con_login_c3 .con2 ul li { margin:0 0 10px 0; }
	.con_login_c3 .con2 ul li i { width:4px; }
	.con_login_c3 .con2 ul li i.op3 { display:block; width:100%; }

}

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

	.con_login_c3 .con3 select { width:100%; }

}

/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/
/*******************************************************************************************************************************************/

/*
background-image:url("../images/bg_23.jpg"), url("../images/bg_24.jpg"); background-position:0 0, 0 0; background-repeat:repeat-x, no-repeat;

outline:none;
text-overflow:ellipsis; overflow:hidden; white-space:nowrap;
text-overflow:ellipsis; overflow:hidden; word-break:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; // 2ÁÙ

display:table; margin-left:auto; margin-right:auto;

#con_footmenu a:after { content:"|"; color:#999999; font-size:12px; text-align:center; padding:0 0 0 12px; }
#con_footmenu a:last-child:after { content:none; padding:0 0 0 0; }

img-responsive

.con_tab .con_tab_c { display:table; width:100%; height:69px; table-layout:fixed; border-collapse:collapse; }
.con_tab .con_tab_c a { display:table-cell; height:69px; color:#3e3e3e; font-size:18px; text-align:center; letter-spacing:-0.03em; background:url("../images/tab_bg.jpg") no-repeat 0 0; padding:17px 0 0 0; }

<img src="/htmlp/images/sbanner_01.jpg" alt="³»¿ëÀÌ µé¾î°©´Ï´Ù." >

data-toggle="modal" data-target=".modal-examlist"
onclick="javascript:$('#modal-notice-1').fadeOut(); $('#modal-notice-2').fadeIn();"

position:relative;
position:absolute; left:0px; top:0px;

text-indent:-10000px;
text-indent:-10000px; font-size:0; line-height:1;

<label for="id" class="hidden" > ¼±ÅÃ</label > <input type="checkbox" name="name" id="id" value="" class="mr5" >

word-break:keep-all;
word-break:break-all;

a.link1 { background:#fff200; } ³ë¶û
a.link1 { background:#4b96e7; } ½ºÄ«ÀÌ
a.link2 { background:#007cd0; } ÆĶû
a.link3 { background:#f67400; } ÁÖȲ
a.link4 { background:#02a9ca; } ¹ÎÆ®
a.link5 { background:#31a97c; } ±×¸°
a.link6 { background:#7c8598; } ±×·¹ÀÌ
a.link7 { background:#927d67; } ºê¶ó¿î
a.link8 { background:#495bb4; } º¸¶ó
a.link9 { background:#e64746; } ·¹µå
a.link10 { background:#eef0f5; } ¿¬Çѱ׷¹ÀÌ
a.link11 { background:#ffffff; } ¶óÀÎ

background:#fdfbf7 °ñµå
background:#f2faff ºí·ç
background:#f4fcfd û·Ï
background:#f8fbf6 ±×¸°
background:#fbf9f7 ºê¶ó¿î
background:#fdf8f7 ÁÖȲ
background:#fcf4f9 ÀÚÁÖ
background:#f9f7fd º¸¶ó
background:#f3faf8 û±×¸°
background:#fcf4f9 ÀÚÁÖ

background:url("../images/control_01.png") no-repeat 0 0;

.con_imglist_c .con1 a.imgs { display:block; width:100%; height:180px; background-repeat:no-repeat; background-position:center center; background-size:cover; border:1px solid #dddddd; border-top-left-radius:4px; border-top-right-radius:4px; text-indent:-10000px; transform:scale(1); transition:all 0.3s ease; }
.con_imglist_c .con1 a.imgs:hover { filter:brightness(95%); transform:scale(1.05); }

position:relative;
position:absolute; right:0px; top:35px;

display:inline-block; width:205px; height:47px; background:url("../images/v1_logo_01.png") no-repeat 0 0; margin-top:25px; text-indent:-10000px;
display:inline-block; padding:7px 20px 7px 20px; background:#777777; color:#e6ebf1; font-size:14px; text-align:center; letter-spacing:-0.03em;
display:inline-block; width:100%; padding:50px 0 0 0; background:url("../images/v1_ic_06.png") no-repeat center 0; color:#ffffff; font-size:17px; text-align:center; letter-spacing:-0.03em;

animation:con_profile_ani1 infinite 3s ease alternate;
@keyframes con_record_ani1 { 0% { opacity:0.3; transform:translateY(-20%); } 50% { opacity:0.3; transform:translateY(0); } 100% { opacity:0.3; transform:translateY(-20%); } }

display:flex; flex-flow:row nowrap; justify-content:flex-start;
display:flex; align-items:center; justify-content:center;

.con_exam_list4 { margin:15px 0 0 0; border-top:1px solid #111111; }
.con_exam_list4 ul { display:flex; flex-flow:row nowrap; justify-content:flex-start; border:1px solid #000000; }
.con_exam_list4 li { }
.con_exam_list4 li.tit { flex-shrink:0; width:100px; border:1px solid #ff0000; }
.con_exam_list4 li.desc { flex-grow:1; border:1px solid #0000ff; }

border:1px solid #000000;

<img src="../assets/images/file_02.png" alt="÷ºÎÆÄÀÏ Á¦¸ñÀÌ µé¾î°©´Ï´Ù." >

.sorting { display:flex; align-items:center; cursor:pointer; }
.sorting:before { content:''; display:inline-block; margin-right:5px; border-left:6px solid #707070; border-top:5px solid transparent; border-bottom:5px solid transparent; }
.sorting.ascending:before { border-bottom:6px solid #133D8E; border-left:5px solid transparent; border-right:5px solid transparent; border-top:none; }
.sorting.descending:before { border-top:6px solid #133D8E; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:none; }
.sorting:hover span { font-weight:bold; }

color:#ffffff; font-size:12px; text-align:center; line-height:26px; letter-spacing:-0.03em;
color:#ffffff; font-size:12px; letter-spacing:-0.03em;

box-sizing:border-box;

.sr_only { position:absolute; white-space:nowrap; width:1px; height:1px; overflow:hidden; border:0; padding:0; clip:rect(0 0 0 0); clip-path:inset(50%); margin:-1px; }
.sr_only2 { position:relative; white-space:nowrap; width:1px; height:1px; overflow:hidden; border:0; padding:0; clip:rect(0 0 0 0); clip-path:inset(50%); margin:-1px; z-index:-1; }

.con22_mclass_cont .con22_1 .con22_cont ul.desc li { margin:0 0 3px 0; padding:0 0 0 10px; position:relative; color:#555555; font-size:14px; letter-spacing:-0.03em; transition:all 0.3s ease; }
.con22_mclass_cont .con22_1 .con22_cont ul.desc li:before { position:absolute; left:0; top:6px; display:inline-block; content:""; width:3px; height:3px; border-radius:100%; background:#111111; }

transition:background-color 0.2s;
transition:all 0.3s ease;
transform:rotate(360deg);

color:#ffffff; font-size:12px; text-align:center; line-height:26px; letter-spacing:-0.03em;
color:#ffffff; font-size:12px; letter-spacing:-0.03em;

<span class="status-span blue">¹ÌÁ¢¼ö</span>
<span class="status-span purple">¹ÌÁ¢¼ö</span>
<span class="status-span yellow">¹ÌÁ¢¼ö</span>
<a href="#none" onclick="javascript:onPopupReason('${result.accidentCode}');"><span class="status-span red">¹ÌÁ¢¼ö</span></a>
<span class="status-span light-red">¹ÌÁ¢¼ö</span>
<a href="#none" onclick="javascript:onPopupReason('${result.accidentCode}');"><span class="status-span grey">¹ÌÁ¢¼ö</span></a>
<span class="status-span charcoal">¹ÌÁ¢¼ö</span>
<span class="status-span navy">¹ÌÁ¢¼ö</span>
<span class="status-span green">¹ÌÁ¢¼ö</span>

<img src="<c:url value="/resources/images/btn_gnb_06.png"/>" alt="Àüü¸Þ´º">

.navbar_gov span:before { margin:0 5px 0 0; content:""; display:inline-block; width:44px; height:17px; background:url("../images/ic_20.png") no-repeat 0 0; vertical-align:middle; }

aspect-ratio:4 / 3;

text-decoration:underline; text-underline-position:under;

standardType="B"

data-aos="fade-up" data-aos-delay="400"

animate__animated animate__backInUp animate__infinite

class="wow swing" data-wow-iteration="infinite" data-wow-delay=".2s" data-wow-duration="3s"

font-family:"Pretendard"; color:#111111; font-size:14px; font-weight:700; line-height:1.3; text-align:center; letter-spacing:-0.02em;

.con_mvisual_c2 .con2 a.more:after { margin:0 0 0 8px; content:""; display:inline-block; width:18px; height:12px; background:url("../images/more_05.png") no-repeat 0 -1px; vertical-align:middle; transition:all 0.3s ease; }
*/