@import url("common.css");

@charset "UTF-8";
/* mobile style */
*{-webkit-text-size-adjust:none}
body, form, div, p, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, li, fieldset, th, td, input, textarea,button,select{margin:0;padding:0;}
body{-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}
a{text-decoration:none}
a[href^="tel"]{ font-style:normal}
address, caption, em, var{font-style:normal;font-weight:normal}
input, textarea, select{letter-spacing:normal}
ul, dl{list-style:none}
fieldset, img{border:0}
legend, caption{display:none}
img{border:0;vertical-align:top}
br{letter-spacing:normal}
p{letter-spacing:normal}
input{vertical-align:middle}
input[type="text"], input[type="password"]{-webkit-appearance:none}
input[type="checkbox"]{-webkit-appearance:none;-webkit-border-radius:0}
input:checked[type="checkbox"]{-webkit-appearance:checkbox}
input[type="radio"]{border:none;-webkit-appearance:none}
button,input[type="button"],input[type="submit"],input[type="reset"],input[type="file"]{-webkit-appearance:button;border-radius:0}
textarea{-webkit-appearance:none}
@media (min-width: 330px) {
 .test{width:360px;color:#333}
}
@media screen and (-webkit-min-device-pixel-ratio:2) {}
/*
blue main color : #113062
blue sub color : #abe7ff
-webkit-box-sizing: border-box;  Safari/Chrome, other WebKit
-moz-box-sizing: border-box;     Firefox, other Gecko
box-sizing: border-box;          Opera/IE 8+
*/

.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;width:1px !important;height:1px !important;font-size:0;text-indent:-9999em;line-height:0;border:0 !important;overflow:hidden !important}

.w100 { width:100%; }
.w50 { width:49%; }
.w30 { width:32%; }

.vcenter { vertical-align: middle; }
.acenter { text-align: center; }
.vmarginauto { margin-top: auto; margin-bottom: auto; }
.aleft { text-align: left; }
.aright { text-align: right; }
.font14 { font-size:14px; color:#000; }
.rel {  display: inline-block; width:100%; margin-bottom:20px; line-height:50px;}
.rel2 { display: inline-block; width:100%; margin-bottom:20px; line-height:20px;}

.main { width: 100%; min-height:572px; padding-top:70px; }
.main-frame { margin:15px; }

.swiper-container {
  width: 100%;
  height: 100%;
}
.swiper-slide { }
.main-data { min-height:600px; padding:15px; }

.v-space10 { display:block; padding:10px 0 10px 0; } /*border:1px;border-style:solid;border-color:#ff0000;*/
.v-space25 { display:block; padding:25px 0 25px 0; }

.main-box { position:relative;margin:0px; width:100%; height:350px; line-height: 350px; vertical-align: middle; text-align: center;
  background-image: url("../images/main_bg01.jpg"); background-size:100% 100%; background-repeat: no-repeat;}
.box-wrapper {
  display:-ms-grid;
  display:grid;
  -ms-grid-columns:100px 100px 100px;
  -ms-grid-rows:122px 122px;
  grid-template-columns: 100px 100px 100px;
  grid-template-rows: 122px 122px;
  vertical-align: middle; text-align: center;
  width:300px;
  height:244px;
  position:absolute;
  left:50%;
  top:50%;
  margin-left:-150px;
  margin-top:-122px;
  }
.box-wrapper li { -ms-grid-row:1;-ms-grid-column:1; position:relative; margin:15px 4px 15px 4px; width:92px; height:92px; line-height: 92px; vertical-align: middle; text-align: center; background-size:100% 100%; background-repeat: no-repeat;box-shadow:2px 2px 1px rgba(0,0,0,0.1);}
.box-wrapper li:hover { cursor: pointer; box-shadow:200px 0 0 0 rgba(150,150,150,0.2) inset; }
.box01 { background-image: url("../images/main_card_1.png"); }
.box02 { background-image: url("../images/main_card_2.png"); }
.box03 { background-image: url("../images/main_card_3.png"); }
.box04 { background-image: url("../images/main_card_4.png"); }
.box05 { background-image: url("../images/main_card_5.png"); }
.box06 { background-image: url("../images/main_card_6.png"); }

.box-short-cut {
  width: 100%;
  display:-ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  -ms-grid-rows: 120px 92px 92px 92px;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 120px 92px 92px 92px;
  gap: 0 15px;
}
.box-short-cut li { -ms-grid-row:1;-ms-grid-column:1;text-align: center; vertical-align: middle; }
.box-short-cut li a { float: left; width:100%; padding:12px 0px 3px 0px; font-size: 18px; font-weight: bold; }
.box-short-cut li p { font-size: 12px; font-weight: bold; vertical-align: middle; }
.short02 { margin:0px 0px 15px 0px; border:3px;border-style:solid;border-color:#8597af; background-color:#181e36; }
.short01 { margin:0px 0px 15px 0px; border:3px;border-style:solid;border-color:#dfe2e9; background-color:#ffffff; }
.short02 p { color:#3daff5; }
.short01 p { color:#ccccd4; }
.short02 a { color:#fff; }
.short01 a { color:#000; background-position:center bottom; background-repeat: no-repeat; background-image: url("../images/underline01.png"); }

.box-radio-input input[type="radio"]{
    display:none;
}
.box-radio-input input[type="radio"] + span{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  display:inline-block;
  float:left;
  margin:0px;
  width:33%;
  height:50px;
  background: url("../images/icon_check_off.png") no-repeat; background-size: 14px;
  background-color:#ffffff;
  background-position:5px 18px;
  border:1px solid #a2a2a2;
  padding-left:24px;
  font-size:12px; font-weight: 400; color: #000;
  vertical-align: middle;
  white-space:nowrap;
  cursor:pointer;
}
.box-radio-input input[type="radio"]:checked + span{
    background: url("../images/icon_check_on.png") no-repeat; background-size: 14px;
    background-position:5px 18px;
    background-color:#abe7ff;
}
.box-radio-input input[type="radio"]:disabled + span{
    background: url("../images/icon_check_disable.png") no-repeat; background-size: 14px;
    background-position:5px 18px;
    background-color:#eee;
}

.menu-step0 {  padding: 5px; width: 100%;}

.menu-step1-0
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; width: 100%; height: 35px; margin: 1px 0 0 0; padding: 5px; background-color: #113062;
  vertical-align: middle; color:#ffffff;
  background-position:95% 15px; background-repeat: no-repeat; background-size:10px; background-image: url("../images/icon_w_down.png");
}
.menu-step1-1
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; width: 100%; height: 35px; margin: 1px 0 0 0; padding: 5px; background-color: #113062;
  vertical-align: middle; color:#ffffff;
  background-position:95% 15px; background-repeat: no-repeat; background-size:10px; background-image: url("../images/icon_w_up.png");
}

.menu-step2
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; background-color: #abe7ff; margin: 1px 0 0 0; padding: 5px 5px 5px 20px; width: 100%;
}

.menu-step2-0
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; background-color: #abe7ff; margin: 1px 0 0 0; padding: 5px 5px 5px 20px; width: 100%;
  background-position:95% 15px; background-repeat: no-repeat; background-size:10px; background-image: url("../images/icon_down.png");
}

.menu-step2-1
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; background-color: #abe7ff; margin: 1px 0 0 0; padding: 5px 5px 5px 20px; width: 100%;
  background-position:95% 15px; background-repeat: no-repeat; background-size:10px; background-image: url("../images/icon_up.png");
}

.menu-step3
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; margin: 1px 0 0 0; padding: 5px 5px 5px 30px; width: 100%;
}

.menu-step3-0
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; margin: 1px 0 0 0; padding: 5px 5px 5px 30px; width: 100%;
  background-position:95% 15px; background-repeat: no-repeat; background-size:10px; background-image: url("../images/icon_down.png");
}

.menu-step3-1
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; margin: 1px 0 0 0; padding: 5px 5px 5px 30px; width: 100%;
  background-position:95% 15px; background-repeat: no-repeat; background-size:10px; background-image: url("../images/icon_up.png");
}

.menu-step4
{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  position: relative; margin: 1px 0 0 0; padding: 5px 5px 5px 40px; width: 100%;
}

.myinfo-box { width:100%; height:45px; line-height: 45px; border:1px;border-style:solid;border-color:#bababa;}
.myinfo-box img { vertical-align: middle; margin-left: 10px;margin-right: 5px; }
.myinfo-box span { height:100%; vertical-align: middle;}
.myinfo-box p { float:right; height:100%; vertical-align: middle; margin-right: 10px; }
.logout { cursor: pointer; }

.contact-box {
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  width: 200px; height:200px; vertical-align: middle;  margin:auto;
  font-size: 18px; text-align: center; padding:50px 0 0 0; line-height: 30px;
  border-radius: 100px; box-shadow:3px 3px 5px 0px rgba(0,0,0,0.3); }
.contact-box span { font-family: Godo sans-serif; font-weight: bold; width:135px; height: 40px; font-size: 23px; color:#112f61; border-bottom: 1px solid #ededed;}
.contact-box p { margin:10px; font-size: 9px; color:#868686; line-height: 15px;}

.box-myinfo {
  width: 100%;
  display: grid;
  display:-ms-grid;
  -ms-grid-columns:1fr 1fr 1fr;
  -ms-grid-rows:100px;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 100px;
  gap: 1px 1px;
  background-color: #bababa;
  border-left:1px solid #bababa;
  border-right:1px solid #bababa;
  border-top:1px solid #bababa;
}
.box-myinfo li { position:relative; text-align: center; vertical-align: middle; background-color: #abe7ff; line-height: 18px; padding:40px 0 0 0;}
.box-myinfo li img { position:absolute;
max-width:40%; max-height:40%;
width:auto; height:auto;
margin:auto;
top:-35px; bottom:0; left:0; right:0; }

.box-etc {
  width: 100%;
  display: grid;
  display:-ms-grid;
  -ms-grid-columns:1fr 1fr 1fr;
  -ms-grid-rows:100px 100px;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 100px 100px;
  gap: 1px 1px;
  background-color: #bababa;
  border:1px solid #bababa;
}
.box-etc li { position:relative; text-align: center; vertical-align: top; background-color: #ffffff; line-height: 18px; padding:40px 0 0 0;}
.box-etc li img {
  position:absolute;
  max-width:40%; max-height:40%;
  width:auto; height:auto;
  margin:auto;
  top:-35px; bottom:0; left:0; right:0;
}

.box-fine-id {
  display: grid;
  display:-ms-grid;
  -ms-grid-columns:110px 110px;
  -ms-grid-rows:110px;
  width:220px;
  margin:auto;
  grid-template-columns: 110px 110px;
  grid-template-rows: 110px;
}
.box-fine-id li { position:relative; background-color: #ffffff; text-align: center; vertical-align: top; line-height: 18px; padding:70px 0 0 0; background-size:100% 100%; background-repeat: no-repeat; background-image: url("../images/bg_login_fineid01.png");}
.box-fine-id li img {
  position:absolute;
  max-width:30%; max-height:30%;
  width:auto; height:auto;
  margin:auto;
  top:-35px; bottom:0; left:0; right:0;
}


.left-modal {
  width: 100%; height: 100%; overflow:scroll;
  transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
  position: fixed; left: -100%; top: 0; z-index: 200;
  text-align: left; margin: 0; padding: 0; background: #fff;
}
.left-container.left-modal-open .left-modal {
  left: 0;
}

.right-modal {
  width: 100%; height: 100%; overflow:scroll;
  transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
  position: fixed; left: 100%; top: 0; z-index: 200;
  text-align: left; margin: 0; padding: 0; background: #fff;
}
.right-container.right-modal-open .right-modal {
  left: 0;
}

.bottom-modal {
  width: 100%;
  transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
  position: fixed; left: 100%; bottom: 0; z-index: 300;
  text-align: left; margin: 0; padding: 0; background: #fff;
}
.bottom-container.bottom-modal-open .bottom-modal {
  left: 0;
}

.main-modal {
  width: 100%; height: 100vh;
  transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
  position: fixed; left: 0; top: 100%; z-index: 300;
  text-align: left; margin: 0; background: #fff;
  padding: 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
.main-container.main-modal-open .main-modal {
  top: 0;
}

.modal-body {
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
  border:1px solid #d6d6d6;
  margin:0px;
  padding:10px;
  width: 100%;
  height: 90%;
  max-height: 500px;
  overflow-y:scroll;
}
.modal-body::-webkit-scrollbar { width: 4px; }
.modal-body::-webkit-scrollbar-track { background-color:#f5f5f5; }
.modal-body::-webkit-scrollbar-thumb { background: #a5a5a5; }
.modal-body::-webkit-scrollbar-thumb:hover { background: #c5c5c5; }
.modal-body::-webkit-scrollbar-thumb:active { background: #808080; }
.modal-body::-webkit-scrollbar-button { display: none; }

.modal-head { font-size: 14px; font-weight: bold; text-align: center; margin: 10px 0; }
.modal-content { font-size: 12px; color:#828282; }

.modal-files { font-size: 14px; font-weight: bold; text-align: center; margin: 10px 0; }
.modal-files-content { font-size: 12px; font-weight: 400; color:#000; }
.modal-files-content li { position: relative; display: block; float: left; width:31%; height:50px; border:1px solid #000; margin:2px; text-align: center;}
.modal-files-content li img { height:45px; margin:2px; }
.modal-files-content li span { display: block; line-height: 15px; vertical-align:middle; margin-top:auto; margin-bottom: auto; position: absolute; left:0; top:0; width:100%; word-break:break-all; text-shadow: 2px 2px 3px white; }

.login_head {
  height:75px;
  line-height: 75px;
  text-align: center;
  border-bottom: 10px solid #e4e4e4;
  font-size: 20px;
  font-weight: bold;
}

.login_message {
  display: flex;
  align-items: center;
  justify-content: center;
  height:220px;
  width:100%;
  line-height: 30px;
  font-size: 17px;
  color:#000000;
}

.join_agreement_head {
  position: relative;
  height:27px;
  line-height: 27px;
  font-size:16px;
  color: #ffffff;
  text-align: center;
  background-color: #01b4f7;
}
.join_agreement_head span { position: absolute; right:30px; }

.join_agreement li {
  position: relative;
  height:40px;
  line-height: 40px;
  font-size:14px;
  color: #929292;
  text-align: left;
  background-color: #f8f8f8;
  padding-left:40px;
}
.join_agreement li span { position: absolute; right:30px; }

.detail-head { height:65px; line-height: 65px; font-size: 15px; font-weight: bold; padding-left:15px; }
.detail-frame { margin:0 15px; }
.detail-title { position: relative; vertical-align: middle; padding: 12px 0; line-height: 18px; font-size:14px; font-weight: 500; border-top:2px solid #000; border-bottom: 1px solid #c4c7cc; }
.detail-title span { position: absolute; right:0; bottom:10px; font-size: 10px; font-weight: 400; color:#8e8e8e;}
.detail-title p { font-size: 10px; font-weight: 400; color:#8e8e8e; }
.detail-content { padding:20px; font-size: 14px; font-weight: 400; border-bottom: 1px solid #2f4d86; }
.detail-button { display: flex; align-items: center; justify-content: center; padding: 15px;}

.faq-frame { margin:0 15px; border-top:2px solid #000; border-bottom: 1px solid #2f4d86; }
.faq-title-down {
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden;
  position: relative; width: 100%; height: 28px; line-height: 28px; padding: 0 35px; vertical-align: middle;
  border-top: 0.5px solid #c4c7cc;border-bottom: 0.5px solid #c4c7cc; font-size:13px; font-weight: 400;
  background-position:95% 10px; background-repeat: no-repeat; background-size:15px; background-image: url("../images/icon_down.png");
}
.faq-title-up {
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden;
  position: relative; width: 100%; height: 28px; line-height: 28px; padding: 0 35px; vertical-align: middle;
  border-top: 0.5px solid #c4c7cc;border-bottom: 0.5px solid #c4c7cc; font-size:13px; font-weight: 400;
  background-position:95% 10px; background-repeat: no-repeat; background-size:15px; background-image: url("../images/icon_up.png");
}
.faq-title-down span,
.faq-title-up span
{
  position:absolute; top: 4px; left:4px; width:20px; height:20px; line-height: 20px; background-color:#000; color:#fff; font-size:10px; font-weight: bold; text-align: center;
}
.faq-answer { position: relative; background-color: #fafafa; padding: 15px 15px 15px 50px; font-size:13px; font-weight: 400;}
.faq-answer span.aicon {
  position:absolute; top: 15px; left:18px; width:20px; height:20px; line-height: 20px; background-color:#0358ab; color:#fff; font-size:10px; font-weight: bold; text-align: center;
}

hr.quick{ border: none; border-top: 2px dotted #626262;}

.quick-head { height:25px; line-height: 25px; padding-left: 20px; font-size:14px; font-weight: bold; color:#113062; background-position:0px 0px; background-repeat: no-repeat; background-size:60% 100%; background-image: url("../images/box_quick.png"); }
.quick-body { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color: #ddf6ff; width:100%; padding:12px; }
.quick-body span { display: block; width:100%; margin:25px 0; text-align: center; font-size: 20px; font-weight: 500; }
.quick-body .sel-box { width:100%; display: flex; align-items: center; justify-content: center; float:left; margin-bottom: 15px;}

/* header */
#hd { margin:0;padding:0;width: 100%; position: fixed;top: 0px; z-index:90; height:70px; line-height: 70px; text-align: center; background:url(../images/top_bg01.jpg) no-repeat;background-size : cover; }

#hd_lmenu {position:absolute;top:25px;left:15px;width:25px;height:20px;border:0;background:url(../images/top_leftmenu.png) no-repeat; background-size:25px;z-index:99; }

#hd_rmenu {position:absolute;top:25px;right:15px;width:25px;height:20px;border:0;background:url(../images/top_rightmenu.png) no-repeat; background-size:25px;z-index:99; }

#hd_search {position:absolute;top:25px;right:50px;width:20px;height:20px;border:0;background:url(../images/top_search.png) no-repeat; background-size:20px;z-index:99; }

.sidebar { position: fixed; top: 100%; bottom: 0; width: 100%; background-color: #fff; }
.sidebar a { text-decoration: none; display: block; }
.sidebar .wrapper {
  position: relative;
  height: 100%;
  width: 100%;
  padding: 0px;
  padding-top: 0;
  overflow-y: auto;
  -webkit-box-sizig: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.sidebar nav { margin-bottom: 5px; }
.sidebar nav ul { list-style-type: none; margin: 0; padding: 0px; }
.sidebar nav ul li {  margin:0px; padding:0px; width:100%; }
.sidebar nav ul li.menu_close { padding:10px 10px 0 0; width:95%; text-align:right;}

/* footer */
.ft	{ width:100%; height: 87px; background-color:#242a44; text-align:center; border-top:7px;border-top-style:solid;border-top-color:#40abf1;}
.ft .mycompany {font-family:'Noto Sans KR', sans-serif; font-size:24px; font-weight:bold; padding:18px 0 13px 0px; color:#9597a0; text-align:center;}
.ft .copyright {font-size:9px; color:#9597a0; text-align:center;}

/* contents footer */
.contents-ft { margin:0;padding:0;width: 100%; position: fixed;bottom: 0px; z-index:100; height:40px; line-height: 40px; text-align: center; vertical-align: middle; background-color: #dbbf6b;} /* #dbbf6b  #c6a250    #c8964c */
.left20 { position:absolute; left:20px; top:6px; height:28px;}
.right20 { position:absolute; right:20px; top:6px; height:28px;}
.icon_img { height:28px; margin:0 10px; vertical-align: middle; cursor: pointer;}

.contents-hd { margin:0;padding:0;width: 100%; position: fixed; top: 70px; z-index:100; height:40px; line-height: 40px; text-align: center; vertical-align: middle; background-color: #dbbf6b;}

.seache-text { color:red; background-color:yellow; }

/* form style */
.form-group { position: relative; width:100%; white-space:nowrap; margin:14px 0; }
.form-group label {display: block; float:left; margin:0; width:23%; height:33px;line-height: 33px; border-top:1px solid #f0f0f0; border-left:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0;color:#000000;font-size:14px;padding:0 10px;}
.form-group input { min-width:70%;height:35px;line-height: 33px; border:1px solid #f0f0f0; color:#000000;font-size:14px; margin:0;}
.search-box { position: relative; }
.search-box .btn_search { position:absolute; right:0; top:0; }

.form-head { height:65px; line-height: 65px; font-size: 15px; font-weight: bold; padding-left:15px; border-bottom: 1px solid #f0f0f0; }
.form-frame { margin:0; padding:15px; background-color: #f8f8f8; font-size:12px; }

/* form */
textarea {width:100%;clear:both;border:1px solid #d9dbe2;border-radius: 0; background-color:#ffffff; -webkit-appearance:none;box-sizing:border-box; font-size:12px; font-weight:500; color:#000000; padding: 10px;}
input { -webkit-box-sizig: border-box;-moz-box-sizing: border-box; box-sizing: border-box;-webkit-appearance:none; border:1px solid #aaa;color:#000000;height:30px; font-size:12px; padding: 0 10px; }
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px #fff inset ; -webkit-text-fill-color: #000; } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { transition: background-color 5000s ease-in-out 0s; }

select::-ms-expand{display:none;}
select {-webkit-appearance: none;-moz-appearance: none;appearance: none; vertical-align: middle;-webkit-box-shadow:none;box-shadow:none;box-sizing:border-box; background: url(../images/icon_sel.png) no-repeat 95% 50%; background-size:10px; background-color:#fff; padding:0px 20px 0px 8px; height: 30px; line-height: 30px;  font-size:12px;  }

.sel_quick04 { width:24%; margin:2px; }
.sel_quick03 { width:32%; margin:2px; }
.sel_quick02 { width:49%; margin:2px; }
.sel_quick01 { width:100%; margin:2px; }

.text_type1	{width:100%;height:35px; border:1.5px solid #eeeeee; margin-bottom: 15px; padding: 10px;}
.text_search	{ width:100%;height:28px; border:1px solid #c5c7cc; font-size:11px; color:#9c9c9c; margin-bottom: 15px; padding-left: 35px; background:url(../images/icon_search.png) no-repeat; background-size:15px; background-position: 7px 7px;}
.text_comment	{ width:100%;height:28px; border:1px solid #c5c7cc; font-size:11px; color:#9c9c9c; margin-bottom: 15px; padding-left: 10px; }

.text_type2	{ width:100%;height:40px; border:1px solid #d9dbe2; font-size:12px; color:#000; padding: 10px;}


/*  button  */
button  { font-family: 'Noto Sans KR', sans-serif; text-align: center; display: inline-block; cursor: pointer;}
button:hover { cursor: pointer; opacity: 0.8;}

.btn {text-align: center; vertical-align: middle; display: inline-block; cursor: pointer;}
.btn:hover { cursor: pointer; opacity: 0.8;}

.btn_type_1 { height:30px; line-height: 30px; background-color:#fff; font-size:15px; font-weight:400; border:1px solid #a2a2a2;color:#000000;}
.btn_type_2 { height: 30px; line-height: 30px; background-color: #113062; font-size:15px; font-weight:400; color:#ffffff; border:1px solid #4f678d;}
.btn_type_3 { height: 30px; line-height: 30px; background-color: #01b4f7; font-size:15px; font-weight:400; color:#ffffff; border:1px solid #45c7f9;}
.btn_type_4 { height: 45px; line-height: 45px; background-color: #fff; font-size:14px; font-weight:400; color:#000; border:1px solid #d9dbe2; border-radius: 3px; margin-right: 5px;}
.btn_type_5 { height: 45px; line-height: 45px; background-color: #3a8afd; font-size:14px; font-weight:400; color:#fff; border:1px solid #2b79f0; border-radius: 3px;}
.btn_type_6 { height: 25px; line-height: 25px; background-color: #01b4f7; font-size:12px; font-weight:400; color:#ffffff; border:1px solid #45c7f9;}
.btn_type_7 { height: 35px; line-height: 5px; vertical-align: middle; background-color: #01b4f7; font-size:18px; font-weight:500; color:#ffffff; border:1px solid #45c7f9;}
.btn_type_8 { height: 25px; background-color: #015cad; font-size:13px; font-weight:400; color:#fff; border:1px solid #000;}
.btn_type_9 { height: 25px; background-color: #fff; font-size:13px; font-weight:400; color:#000; border:1px solid #000;}

.btn_type01 {width:77px; height: 21px; background-color: #113062; font-size:12px; font-weight:400; color:#ffffff; border:1px solid #4f678d;}
.btn_type02 {width:100%; height: 35px; background-color: #01b4f7; font-size:17px; font-weight:400; color:#ffffff; border:1px solid #01b4f7;}
.btn_type03 {width:50px; height: 20px; background-color: #c5c8cd; font-size:10px; font-weight:400; color:#000; border:1px solid #000;}
.btn_type04 {width:50px; height: 20px; background-color: #eee; font-size:10px; font-weight:400; color:#aaa; border:1px solid #aaa;}
.btn_type05 {width:45px; height: 20px; background-color: #f00; font-size:8px; font-weight:400; color:#fff;}
.btn_type06 {width:65px; height: 25px; margin: 0 2px; background-color: #005cac; border:1px solid #005cac; font-size:13px; font-weight:400; color:#fff;}
.btn_type07 {width:65px; height: 25px; margin: 0 2px; background-color: #fff; border:1px solid #005cac; font-size:13px; font-weight:400; color:#000;}
.btn_type08 {width:60px; height: 20px; background-color: #fff; border:1px solid #000; font-size:11px; font-weight:400; color:#000;}
.btn_type09 {width:30px; height: 30px; line-height: 12px; background-color: #01b4f7; border:1px solid #000; font-size:10px; font-weight:400; color:#000;}


.btn_type10 {width:40px; height: 15px; background-color: #005cac; font-size:8px; font-weight:400; color:#fff;}
.btn_type11 {width:40px; height: 15px; background-color: #f00; font-size:8px; font-weight:400; color:#fff;}
.btn_type12 {width:40px; height: 15px; background-color: #005cac; border:1px solid #005cac; font-size:8px; font-weight:400; color:#fff; margin:0 10px;}

.btn_search { padding:5px 12px; height: 28px; background-color: #015cad; font-size:12px; font-weight:400; color:#fff;}

.parent{ width: 100%; margin: 10px auto; }
.first { float: left; width:32%; box-sizing: border-box;}
.second{ float: left; margin-left: 2%; width:32%; box-sizing: border-box; }
.third{ float: right; width:32%; box-sizing: border-box;}

/* check button */
.check-input {
    display:none;
}
.check-input + label{
  background: url("../images/icon_check_off.png") no-repeat 0 50%; background-size: 14px;
  padding-left:20px; cursor:pointer; font-size: 13px; font-weight: 500;
}
.check-input:checked + label{
  background: url("../images/icon_check_on.png") no-repeat 0 50%; background-size: 14px;
}
.check-input:disabled + label{
  background: url("../images/icon_check_disable.png") no-repeat 0 50%; background-size: 14px;
}


/* file input */

.filebox { position: relative; height: 45px; text-align:left; margin-bottom: 15px; }
.filebox input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
/* file button */
.filebox label {
  display: inline-block; cursor: pointer; z-index: 999;
  position: absolute; right:7px; top: 7px; width: 60px; height: 30px; line-height: 30px;
  color: #3a8afd; font-size: 11px; text-align: center; vertical-align: middle;
  background-color: #fff; border: 1px solid #3a8afd; border-radius: 3px;
}

/* file input text - named upload */
.filebox .upload-name {
  width: 100%; height: 45px; vertical-align: middle;
  color: #626262; border: 1px solid #d9dbe2; border-radius: 0px;
  padding-left: 35px; background:url(../images/icon_filedown.png) no-repeat; background-size:15px; background-position: 10px 15px;
  background-color: #fff;
}

/* table */
.table01_head { height:50px; line-height: 50px; vertical-align: middle; font-size:15px; font-weight: bold; }
.table01_head span { font-size: 12px; line-height: 25px; color:#727272; border-bottom: 1px solid #727272; }
.table01_head .rbtn {display: inline-block; float:right; margin:auto 0; }
table.type01 {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  border-bottom: 2px solid #b2bdd1;
  border-top: 2px solid #000;
}
table.type01 thead th {
  height:30px; line-height: 30px; vertical-align: middle;
  font-size:13px; font-weight: 500; color: #000;
  border-bottom: 1px solid #d4d4d6;
}
table.type01 thead td {
  height:30px; line-height: 30px; vertical-align: middle; text-align: center;
  font-size:13px; font-weight: 500; color: #000;
  border-bottom: 1px solid #d4d4d6; border-left: 1px solid #d4d4d6;
}
table.type01 tbody th {
    height:28px; vertical-align: middle;
    font-size: 13px; font-weight: 500; color: #000; padding: 0 10px;
    border-bottom: 1px solid #d4d4d6;
}
table.type01 tbody td {
  height:28px; vertical-align: middle; padding:0 7px;
  font-size:13px; font-weight: 400;
  border-bottom: 1px solid #d4d4d6; border-left: 1px solid #d4d4d6;
}
table.type01 td.date { font-size:13px; font-weight: 400; color:#c6c6c6; text-align: center; }
table.type01 td.bndate { font-size:13px; font-weight: 400; line-height: 15px; color:#c6c6c6; text-align: center; padding: 5px; }
table.type01 td.number { font-size:13px; font-weight: 400; text-align: center; }
table.type01 th.number { font-size:13px; font-weight: 400; text-align: center; }

.table02_head { font-size:15px; font-weight: bold; margin:20px 0 10px 0; }
.table02_tail { font-size:12px; font-weight: 300; padding:10px 0 10px 0; text-align: center; border-bottom: 1px solid #e4e6e8; }
table.type02 {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  border-bottom: 2px solid #000;
  border-top: 2px solid #000;
}
table.type02 thead th {
  height:25px; line-height: 25px; vertical-align: middle; text-align: center;
  font-size:13px; font-weight: bold; color: #000;
  background-color: #abe7ff; border-bottom: 1px solid #e4e6e8;
}
table.type02 thead td {
  height:25px; line-height: 25px; vertical-align: middle; text-align: center;
  font-size:13px; font-weight: bold; color: #000;
  background-color: #abe7ff; border-bottom: 1px solid #e4e6e8; border-left: 1px solid #e4e6e8;
}
table.type02 tbody th {
    height:40px; line-height: 30px; vertical-align: middle; text-align: center;
    font-size: 13px;
    border-bottom: 1px solid #e4e6e8;
}
table.type02 tbody td {
  height:40px; line-height: 30px; vertical-align: middle; text-align: center; padding:0 7px;
  font-size:13px; font-weight: 400;
  border-bottom: 1px solid #e4e6e8; border-left: 1px solid #e4e6e8;
}
table.type02 tbody th.total, table.type02 tbody td.total { width:50%; font-size:17px; font-weight: 500; }
/* titles */


/* main */


/* pagenation */
ul.tsc_pagination { display: flex; align-items: center; justify-content: center; padding:10px; }
ul.tsc_pagination li { float: left; }
ul.tsc_pagination li a
{
  display: block;
  width:15px; height:15px;
  vertical-align: middle;
  text-align: center;
  font-size:7px;
  color: #9f9f9f;
	background: #f9f9f9;
  border:1px solid #e2e2e2;
}
ul.tsc_pagination li a:hover,
ul.tsc_pagination li a.current
{
  color:#FFFFFF;
  border-color:#0358ab;
  background:#0358ab;
}

/* comment */
ul.msg_list li {
    background: #f7f7f7;
    padding: 0px;
    display: -ms-flexbox;
    display: flex;
    margin: 6px 6px 0;
    width: 96% !important
}
ul.msg_list li:last-child {
    margin-bottom: 6px;
}
ul.msg_list li a {
  position: relative;
  width:100%;
  padding: 3px 5px !important
}
ul.msg_list li a .time {
    font-size: 10px;
    font-weight: 300;
    position: absolute;
    right: 30px
}
ul.msg_list li a .delete {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 30px;
    height:20px;
    text-align: center;
    cursor: pointer;
}
ul.msg_list li a .message {
    display: block !important;
    font-size: 13px;
    font-weight: 400;
}



/* Tabs style */

section {
  display: none;
  padding: 0;
}

.tabs {
  display: none;
}

.tabslabel {
  display: block;
  float:left;
  margin:1px;
  width:48%; text-align: center;
  height:30px; line-height: 30px; font-size:15px; font-weight:400;
  background-color:#fff; border:1px solid #a2a2a2; color:#000000;
}

.tabslabel:before {
  font-weight: normal;
  margin-right: 10px;
}

.tabslabel:hover {
  color: #888;
  cursor: pointer;
}

.tabs:checked + .tabslabel {
  background-color: #113062; color:#ffffff; border:1px solid #4f678d;
}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2{
  display: block;
}

@media screen and (max-width: 650px) {
  .tabslabel {
    font-size: 15px;
  }
  .tabslabel:before {
    margin: 0;
    font-size: 15px;
  }
}

@media screen and (max-width: 400px) {
  .tabslabel {
    padding: 0px;
  }
}