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

@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 800;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.ttf) format('truetype');
}

@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 100; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 300; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 400; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 500; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 700; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 900; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype'); 
 }

/* reset */
* { padding:0; margin:0 }
html { overflow-y:scroll; height:100% }
body { font-size:14px; font-family:noto sans kr, dotum, sans-serif; color:#444; height:100%;}
ul, ol { list-style:none }
html, h1, h2, h3, h4, h5, h6, form, fieldset, img { border:0 }
h1, h2, h3, h4, h5, h6 { font-weight:600; font-family:noto sans kr, sans-serif; font-size:1em; letter-spacing:-.5px; line-height:1.4 }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block }

label, input, button, select, img { vertical-align:middle }
input, button, textarea, select { font-size:1em; font-family:noto sans kr, sans-serif }
input[type=text], input[type=password] { padding:0 9px; border:1px solid #ddd; color:#555; line-height:30px; height:30px }
input[type=text]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:#aaa }
input[type=text]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, textarea:-ms-input-placeholder { color:#aaa }
input[type=text]:-moz-placeholder, input[type=password]:-moz-placeholder, textarea:-moz-placeholder { color:#aaa }
input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0;font-size:1em;-webkit-appearance:none}
input.short { width:60px }
input.long { width:calc(100% - 20px) }
input.half { width:calc(50% - 30px) }
button { cursor:pointer }
select { border:1px solid #ddd; height:32px; color:#555; font-family:noto sans kr, sans-serif; padding-left:5px; cursor:pointer }
.styled_select { height:40px; overflow:hidden; background:#fff url(../img/common/btn_select.png) no-repeat right; border: 1px solid #ddd; }
.styled_select select { font-weight:bold; background: transparent; padding:0 5px 0 8px; height:40px; line-height:40px; width:calc(100% + 30px); border:0;  border-radius:0; -webkit-appearance: none;}
hr { display:none; background:#ddd; border:none; height:1px }
a, a:link, a:visited { text-decoration:none; color:#444 }
strong, b, th { font-weight:500; }
table { width:100%; border-collapse:collapse; border-spacing:0 }
caption { display:none; font-size:0; line-height:0 }
textarea {color:#666; font-size:1em; line-height:1.5 }
.textarea { border:1px solid #ddd; padding:10px; background:#fff }
.textarea textarea { width:100%; border:none; line-height:1.5 }
address { font-style:normal }
legend { font-size:0; line-height:0; text-indent:-9000px }
p { word-break:keep-all }

input[type=checkbox].styled, input[type=radio].styled { width:17px; height:17px; border:none; opacity:0; cursor:pointer; position:relative; z-index:1  }
input[type=checkbox].styled + i, input[type=radio].styled + i {width:17px; height:17px; display:inline-block; vertical-align:middle !important; background:url(/static/img/icon_input.png) no-repeat -27px 0; margin:0 0 0 -17px;  }
input[type=checkbox].styled:checked + i { background-position:-54px 0 }
input[type=checkbox].styled:disabled + i { background-position:0 0 }
input[type=radio].styled + i { background-position:-27px -27px }
input[type=radio].styled:checked + i { background-position:-54px -27px }
input[type=radio].styled:disabled + i { background-position:0 -27px }

/* global */
.txt_black { color:#222 !important }
.txt_red { color:#dd4141 !important }
.txt_blue { color:#498fca !important }
.txt_purple { color:#c04e66 !important }
.txt_purple_blue { color:#8656ac !important }
.txt_brown { color:#9f5e15 !important }
.txt_green { color:#48b114 !important }
.accent_red { color:#d12b2b !important; border-color:#ef8e8e !important }
.accent_green { color:#62bb14 !important; border-color:#9fd272 !important }
.accent_blue { color:#1b7dc9 !important; border-color:#71b3d5 !important }
.big { font-size:1.6em }
.bigger { font-size:2em }
.wrap:after { content:""; display:block; clear:both }
.clear:after { content:""; display:block; clear:both }
.center { text-align:center !important }
.left { text-align:left !important }
.right { text-align:right !important }
.f_left { float:left !important } 
.f_right { float:right !important } 
.skip { font-size:0; text-indent:-9000px; line-height:0; display:none }
.ellipsis { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block }
input.long { width:calc(100% - 20px) }
ul:after { clear:both; content:""; display:block }
.overflow_y { overflow-x:hidden; overflow-y:scroll }
span.block { display:inline-block; vertical-align:middle }

.succession { margin-top:20px !important }
.paragraph { margin-bottom:40px !important }
.br { display:block }
.prepare { width:500px; margin:50px auto; padding:50px; border:1px solid #eaeaea}
.prepare h2 { font-size:24px; text-align:center; margin:0 0 20px }
.prepare h2 i { font-size:50px; margin:0 0 20px; display:block; color:#ddd }
.prepare p { text-align:center; font-size:13px }
span.space { margin:0 10px }

.wrap { width:1000px; position:relative; margin:0 auto; padding:50px 40px 80px 40px }
.ahref { position:absolute; text-indent:-9000px; background:red; display:inline-block; opacity:0; filter:alpha(opacity=0) }
.btn_guide { position:fixed; right:100px; top:40%; }
.btn_guide a { display:inline-block; color:#fff !important; font-weight:500; background:#c81c1c; line-height:40px; padding:0 30px; margin:5px 0 }
.mobile_only { display:none }
.pc_no { display:none }

/* pop layer */
#popLayerBg { position:fixed; z-index:99; width:100%; height:100%; background:#000; opacity:0.5; filter:alpha(opacity=50); display:none }
.pop_layer { z-index:100; display:none; position:fixed; left:50%; top:50%; background:#fff }
.pop_layer .btn_close { display:block; background:#fff; font-size:50px; text-align:center; width:60px; height:56px; color:#26282a; }

/* header */
#header { background:#225dab; height:90px; width:100%; min-width:1180px }
#header .wrap { padding:0 40px; width:1100px }
#header h1 { position:absolute; top:19px; left:40px; text-align:center; width:140px; font-weight:500; line-height:2; font-size:1.1em }
#header h1 a { color:#fff }
#header h1 small { font-size:11px; font-family:dotum; font-weight:bold; display:block; margin:5px 0 0 0; letter-spacing:-1px }
#header.pharmacy h1 a strong { color:#c0ff5d }
#header.hospital h1 a strong { color:#5df2ff }
#header .gnb { position:absolute; top:0; left:200px }
#header .gnb li { float:left }
#header .gnb a { color:#fff; font-weight:500; display:table-cell; text-align:center; vertical-align:middle; padding:0 25px; height:90px; transition:all .2s ease }
#header .gnb a i { font-size:1.6em; margin:0 0 7px }
#header .gnb a:hover { background:#3c6fb3 }
#header .gnb .on a { background:#fff; color:#225dab }
#header .info { position:absolute; width:150px; text-align:right; right:40px; top:18px; font-size:11px; color:#fff; font-family:nanum Gothic }
#header .user { margin:0 0 5px }
#header .date { opacity:0.7; margin:0 0 10px }
#header .btn_logout { color:#fff; font-weight:bold }

/* noside header */
#header_noside { background:#d0dbeb; padding:90px 0 30px; text-align:center }
#header_noside h1 { margin:0 0 40px }
#header_noside h2 { font-size:1.6em; font-weight:600; color:#222; margin:0 0 10px }
#header_noside h2 strong { font-weight:600; color:#0c4da2 }
#header_noside h3 { font-size:1.3em; font-weight:400; color:#222; margin:0 0 10px }
#header_noside h3 strong { font-weight:600; color:#000 }
#header_noside p { font-size:1.05em }

/* footer */
#footer { font-size:0.8em; font-weight:300; border-top:1px solid #e0e0e0; padding:40px 0; text-align:center }
#footer .wrap { padding:0; width:100%; min-width:1180px }
#footer .view_mode { background:#fff; border:1px solid #e0e0e0; border-left:0; border-right:0; width:100%; height:38px; line-height:38px; font-size:12px; font-weight:400; margin-top:-41px; margin-bottom:30px; display:block }

/* contents */
#contents .wrap { width:1100px; padding:30px 40px 80px 40px; min-height:500px }
.tab01 ul { margin:0 0 0 1px }
.tab01 li { float:left; margin:0 0 0 -1px }
.tab01 li a { display:block; line-height:50px; height:50px; color:#aaa; border:1px solid #e0e0e0; background:#fff; font-weight:400; font-size:17px; text-align:center }
.tab01 li.on a { color:#fff; background:#3e464d; border-color:#3e464d; font-weight:500 }

#left_area { position:absolute; padding:100px 0 0 0; top:0; left:0; width:200px; display:none }
#left_area .info { text-align:center; font-size:13px; padding:30px 0; background:#e1e3e5 }
#left_area .user { font-weight:500; margin:0 0 5px }
#left_area .date { font-size:12px; margin:0 0 20px }
#left_area .btn-sm { font-size:12px; border-color:#ccc }
#left_area .snb li { border-top:1px solid #e1e3e5; font-size:0.9em }
#left_area .snb li a { color:#999; line-height:50px; display:block; padding:0 15px }
#left_area .snb li.on a { color:#225dab }

#right_area { }
h2.title { font-size:1.3em; color:#222; margin:0 0 25px }
h3.title { font-size:1.1em; color:#0c4da2; margin:0 0 17px }

.unified_search { background:#f9f9f9; padding:25px 25px; border-radius:5px; margin-bottom:25px; text-align:center; border:1px solid #ddd }
.unified_search dl { display:inline-block; vertical-align:top }
.unified_search dt { display:inline-block; margin:0 20px 0 0; vertical-align:middle; font-weight:500; background:url(/img/dot01.png) no-repeat 0 8px; padding-left:10px }
.unified_search dd { display:inline-block; margin:0 30px 0 0; vertical-align:middle }
.unified_search dd label { margin:0 20px 0 5px }
.unified_search input[type=text] { width:200px; height:34px; line-height:32px; width:280px }
.unified_search select { height:36px; width:80px }
.unified_search .btn_submit { height:36px; border:none; border-radius:0; color:#fff; font-weight:500; background:#444; padding:0 30px; vertical-align:top; margin-left:-25px }

.tbl_top { margin:0 0 10px }
.tbl_top:after { content:""; display:block; clear:both }
.tbl_top .result { float:left; padding:12px 0 0 0 }

.tbl_btm { margin:10px 0 0 0 }
.tbl_btm:after { content:""; display:block; clear:both }

.pagenum { text-align:center; font-size:0 }
.pagenum span { font-size:12px; border:1px solid #eee; display:inline-block; margin:0 0 0 -1px }
.pagenum span a { color:#999; line-height:30px; padding:0 13px; display:block }
.pagenum span:hover { background:#f9f9f9 }
.pagenum span.current { background:#eee }
.pagenum span.current a { color:#444 }
.pagenum span i { font-size:1.5em }

.regist_btn_area { text-align:center; margin:30px 0 0 0 }
.ol01 { list-style:decimal; margin:0 0 0 20px }
.ol01 li { margin:10px 0 0 0 }

#snb { margin:0 0 35px }
#snb li { float:left; margin:0 5px 0 0 }
#snb li a { display:inline-block; line-height:40px; height:40px; padding:0 18px; background:#fff; border:1px solid #e0e0e0; color:#aaa; font-weight:400; font-size:14px }
#snb li.on a { background:#3e464d; color:#fff; border-color:#3e464d }


/* login */
#login fieldset { padding:70px 0 30px 0; text-align:center; display:block }
#login fieldset p { padding:0 0 15px; display:block }
#login label { font-size:0; line-height:0; text-indent:-9000px }
#login .check_id { margin:10px 0 0 0 }
#login .check_id label { font-size:14px; line-height:1; text-indent:0 }
#login input[type=text], #login input[type=password] { width:210px; line-height:43px; height:43px; border-radius:3px; margin:0 0 7px; vertical-align:top }
#login .btn_submit { width:100px; text-align:center; height:45px; background:#225dab; border:1px solid #1c55a0; color:#fff; font-weight:500; border-radius:3px; vertical-align:top; font-size:1.05em }
#login .login_link { text-align:center; padding-bottom:60px }
#login .login_link a { display:inline-block; margin:0 3px; width:180px; text-align:center; font-weight:500; font-size:0.95em; background:#eee; border-radius:20px; line-height:40px }
#login .login_link a:hover { background:#e1e7f0 }
#login .login_link a i { font-size:1.1em; display:inline-block; vertical-align:0; margin:0 5px 0 0; }
#login .download { text-align:center; padding-bottom:100px }

/* join */
#join .overflow_y { border:1px solid #e0e0e0; padding:20px; height:200px }
#join .agree_area { margin:10px 0 0 0; font-weight:500 }
#join .btn_area { text-align:center }
#join .table_v01 th { width:130px }
.join_complete { border:1px solid #e0e0e0; padding:50px; width:680px; margin:0 auto }
.join_complete p { margin:0 0 25px; font-weight:300 }
.join_complete .txt01 { font-weight:600; font-size:1.7em; color:#225dab; text-align:center; margin:0 0 35px }
.join_complete .btn_area { margin:40px 0 0 0 }

/* table */
.table_v01 table { border-top:2px solid #6a93c9; font-size:13px }
.table_v01 th, .table_v01 td { padding:7px 10px; border-bottom:1px solid #e0e0e0; height:32px }
.table_v01 th { padding:5px 20px; text-align:left; background:#eff2f6 }
td li { margin:5px 0 0 0 }
td li:first-child { margin:0 }

.table_h01_border table { border-top:2px solid #6a93c9; font-size:13px }
.table_h01_border th, .table_h01_border td { padding:7px; border:1px solid #e0e0e0; text-align:center; height:26px }
.table_h01_border th { background:#eff2f6 }
.table_h01_border tbody th { background:#f4f4f4 }

.table_h01 table { border-top:2px solid #6a93c9; font-size:13px }
.table_h01 th, .table_h01 td { padding:7px; border-bottom:1px solid #e0e0e0; text-align:center; height:26px }
.table_h01 th { background:#eff2f6 }

/* survey */
#survey { width:1000px; margin:40px auto; font-weight:300; color:#222 }
#survey .tab01 { margin:0 0 20px }
#survey .tab01 li { width:calc(100%/3 - .5px) }
#survey h2 { text-align:center; margin:0 0 25px; font-size:22px; color:#111 }
#survey .list > li { border-bottom:1px solid #e0e0e0; padding:15px 0; line-height:1.4 }
#survey .list > li .question { margin:0 0 7px; background:url(/static/img/icon_q.png) no-repeat 0 2px; padding-left:25px  }
#survey .list li .answer { background:url(/static/img/icon_a.png) no-repeat 0 3px; padding-left:25px  }
#survey .list li .answer label { font-weight:400; margin:0 15px 0 5px }
#survey .list li ul { margin:-10px 0 0 25px }
#survey .list li li { padding:15px 0 0 0 }
#survey .list li li .answer { margin:5px 0 0 0 }
#survey .btn_area { text-align:center; margin:35px 0 }
#survey .btn_area .btn-lg { font-size:18px; font-weight:500; padding:16px 50px 18px 50px }
#survey .btn_area i { font-size:22px; margin:0 5px 0 0 }

#survey_complete { font-size:1.1em }
#survey_complete .box01 { border:7px solid #6f9ad2; padding:80px 30px; text-align:center; margin:50px auto; width:500px }
#survey_complete strong { color:#0c4da2; font-size:1.4em; font-weight:600; display:inline-block; margin:0 0 10px; letter-spacing:-1px; line-height:1 }


/* popup */
#popup {}
#popup header { background:#d0dbeb; padding:30px 0 }
#popup header h1 { font-size:2em; font-weight:600; color:#222; margin:0 0 10px; text-align:center }
#popup header h1 strong { font-weight:600; color:#0c4da2 }
#popup header p { text-align:center; font-size:1.1em }

.idsearch { font-size:0; padding:0 15px }
.idsearch section { font-size:14px; display:inline-block; text-align:center; width:calc(100%/2 - 40px); padding:40px 20px; vertical-align:top }
.idsearch section h2 { font-size:1.26em; color:#222; margin:0 0 15px }
.idsearch section p { font-size:0.96em; color:#666; font-weight:300; line-height:1.4; margin:0 0 15px; word-break:break-all }
.idsearch section input { width:calc(100% - 20px); margin:5px 0 0 0; height:40px }
.idsearch section .btn { margin:20px 0 0 0; width:100%; text-align:center }

.idsearch_result { padding:0 30px; text-align:center }
.idsearch_result h2 { font-size:1.26em; color:#222; padding:40px 0 25px 0 }
.idsearch_result p { border:5px solid #eee; padding:30px }
.idsearch_result .btn { margin:30px 0 0 0; }

#popup .wrap { width:940px; padding:30px 30px 80px 30px; /* min-height:500px*/ }
#popup .info_box { border:1px solid #ddd; padding:30px }
#popup .info_box ol > li { list-style-type:decimal; margin:2px 0 0 15px }
#popup .info_box ol > li:first-child { margin-top:0 }
#popup .info_box li ul { margin:0 0 5px }
#popup .info_box li li { background:url(/img/dot01.png) no-repeat 0 6px; padding-left:10px }
#popup .info_box h4 { font-size:1.1em; margin:0 0 10px }
#popup .info_box .paragraph { margin-bottom:25px !important }


/* For Print */
@media print {
body { font-family:noto sans kr, dotum, sans-serif; color:#000; }
.print_no { display:none !important }
.paragraph { margin-bottom:25px !important }

h1.title { color:#000; margin:0 0 20px; font-size:30px; text-align:center }
h2.title { color:#000; margin:0 0 18px }
h3.title { color:#000; margin:0 0 12px }

#popup .wrap { padding:30px }

.table_v01 table { border-top:2px solid #666; font-size:12px }
.table_v01 th, .table_v01 td { padding:5px 10px; border:1px solid #ccc; height:auto }
.table_v01 th { padding:5px 10px; text-align:left; background:none }
td li { margin:5px 0 0 0 }
td li:first-child { margin:0 }

.table_h01_border table { border-top:2px solid #666; font-size:12px }
.table_h01_border th, .table_h01_border td { padding:5px; border:1px solid #ccc; text-align:center; height:auto }
.table_h01_border th { background:none }

.table_h01 table { border-top:2px solid #666; font-size:12px }
.table_h01 th, .table_h01 td { padding:5px; border:1px solid #ccc; text-align:center; height:auto }
.table_h01 th { background:none }

#popup .info_box li li { background:none; padding-left:0 }

}

/* 20170718 추가 : 임철진 */
.col1 { width:100px }
.col2 { width:200px }
.col3 { width:300px }
.col4 { width:400px }
.col5 { width:500px }
.col6 { width:600px }
.col7 { width:700px }
.col8 { width:800px }

.col50 { width:50px } 

#popLayer { clear:both; display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:#000; opacity:0.7; filter:alpha(opacity=70); z-index:10000 }
.pop_contents { background:#fff; position:absolute; left:50%; top:50%; z-index:10001; display:none; border:5px solid #000; padding:20px }
.pop_contents h1 { font-size:15px; color:#444; margin-bottom:12px }
.pop_contents section { margin-bottom:25px }