@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff');
}
@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff');
}
 
@font-face {
  font-family: 'NanumMyeongjo';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/nanummyeongjo/v4/NanumMyeongjo-Regular.woff) format('woff');
}
@font-face {
  font-family: 'NanumMyeongjo';
  font-style: normal;
  font-weight: 600;
  src: url(//fonts.gstatic.com/ea/nanummyeongjo/v4/NanumMyeongjo-Bold.woff) format('woff');
}

@font-face {
  font-family: 'LexiSaebomR';
  font-style: normal;
  font-weight: 400;
  src: url('/WebFonts/LexiSaebomRWeb/LexiSaebomR.woff') format('woff');
}
@font-face {
  font-family: 'LexiSaebomR';
  font-style: normal;
  font-weight: bold;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff');
}

@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 400;
	src: url(//fonts.gstatic.com/s/lato/v11/9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: bold;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff');
}

@font-face {
  font-family: 'NanumGothicCoding';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/nanumgothiccoding/v4/NanumGothicCoding-Regular.woff) format('woff');
}

body
{
	font-size: 10pt;
	line-height: 160%;
	font-family: "NanumGothic", "Helvetica";
	color: #222;
}

input { font-size: 10pt;
	line-height: 120%;
	font-family: "NanumGothic", "Helvetica";
	color: #222;
}
input[type="password"] {
	font-family: Helvetica; letter-spacing: 0.07em;
}

textarea { font-size: 10pt;
	line-height: 160%;
	font-family: "NanumGothic", "Helvetica";
	color: #222;
}

body { margin-left: 20px; margin-right: 20px; }
p { margin: 10px 0px; }
li { margin: 6px 10px; }
.ind { text-indent: 25px; }
.indented { margin-left: 25px; }

p.quote { margin: 0.6em 2em; }

ol, ul { margin-left: 20px; padding-left: 0; }
dl { margin-left: 15px; padding-left: 0; }
dt { font-weight: bold;  }
dd { margin: 10px 15px; }

.nanum_s { font-family: NanumGothic; font-size: 9.3pt; color: #222; }
.nanum { font-family: NanumGothic; font-size: 10pt; color: #222; }
.nanum_b { font-family: NanumGothic; font-size: 11pt; color: #222; }
.malgun_s { font-family: "맑은 고딕", Helvetica; font-size: 9.3pt; color: #222; }
.malgun { font-family: "맑은 고딕", Helvetica; font-size: 10pt; color: #222; }
.malgun_b { font-family: "맑은 고딕", Helvetica; font-size: 11pt; color: #222; }
.myeongjo_s { font-family: "함초롬바탕", "바탕", Georgia;
	font-size: 9.7pt; color: #222; }
.myeongjo { font-family: "함초롬바탕", "바탕", Georgia;
	font-size: 10.7pt; color: #222; }
.myeongjo_b { font-family: "함초롬바탕", "바탕", Georgia;
	font-size: 11.7pt; color: #222; }
.lexi_s { font-family: Lato, LexiSaebomR; font-size: .95em; 
	word-spacing: 0.15em; color: #444; }
.lexi { font-family: Lato, LexiSaebomR; font-size: 1.03em; 
	word-spacing: 0.15em; color: #444; }
.lexi_b { font-family: Lato, LexiSaebomR; font-size: 1.1em; 
	word-spacing: 0.15em; color: #444; }

td, th { line-height: 125%; }

pre
{
	font-size: 10pt;
	font-family: "Consolas", "NanumGothicCoding";
	color: dimgray;
	line-height: 140%;
	tab-size: 4;
	-moz-tab-size: 4;
}

ol.paren {
    list-style-type: none;
    margin-left: 1.7em;
}
ol.paren li {
    text-indent: -1.7em;
    counter-increment: item; 
}
ol.paren li:before {
    content: "(" counter(item) ") ";
}

h1, h2, h3, h4, div.h3 {
	margin: 15px 0px;
	font-family: "NanumGothic", "Helvetica";
	font-weight: bold;
	color: #222;
}

h4 { font-size: 12pt; }
h3, div.h3 { font-size: 14pt; }
h2 { font-size: 16pt; }
h1 { font-size: 18pt; }

hr {
    display: inline-block;
    width: 90%;
    margin-top: 4px;
    margin-bottom: 4px;
    margin-left: 5%;
    margin-right: 5%;
    border-style: dotted;
    color: gainsboro;
    border-width: thin;
    /* <div style='text-align: center;'><hr style='width: 30%;'/></div> */
}

A:link { color: steelblue; text-decoration: none; }
A:visited { color: steelblue; text-decoration: none; }
A:hover { color: hotpink; text-decoration: underline; }
A:active { color: yellowgreen; text-decoration: none; }

strong { text-decoration: none; font-weight: bold; }

.srccode { font-family: "Consolas", "NanumGothicCoding";
	color: dimgray; margin: 10px 0px 10px 25px; line-height: 140%; }
.srcIcode { font-family: "Consolas", "NanumGothicCoding"; color: dimgray; }
.tterm { font-family: "Consolas", "NanumGothicCoding"; color: darkgoldenrod; }
.em { color: darkgoldenrod; text-decoration: underline; }
.em0 { color: darkgoldenrod; }
.em1 { color: forestgreen; }
.cmt { font-family:  "NanumGothic", "Helvetica"; }
.srcem0 { color: darkgoldenrod; font-family: "Consolas", "NanumGothicCoding"; }
.cmtem0 { color: darkgoldenrod; font-family: "NanumGothic", "Helvetica"; }
.srcem1 { color: forestgreen; font-family: "Consolas", "NanumGothicCoding"; }
.cmtem1 { color: forestgreen; font-family: "NanumGothic", "Helvetica"; }
.em2 { color: royalblue; }
.srcem2 { color: royalblue; font-family: "Consolas", "NanumGothicCoding"; }
.em3 { color: orchid; }
.srcem3 { color: orchid; font-family: "Consolas", "NanumGothicCoding"; }
.em4 { color: darkgray; }
.srcem4 { color: darkgray; font-family: "Consolas", "NanumGothicCoding"; }
.cmtem4 { color: darkgray; font-family: "NanumGothic", "Helvetica"; }
.em5 { color: salmon; }
.srcem5 { color: salmon; font-family: "Consolas", "NanumGothicCoding"; }
.cmtem5 { color: salmon; font-family: "NanumGothic", "Helvetica"; }
.alert { color: red; }
.em6 { color: steelblue; }
.em7 { color: red; }
.em8 { color: olivedrab; }
.em9 { text-decoration: underline; }
.vari { font-family: "Consolas", "NanumGothicCoding";
	color: darkseagreen; font-style: italic; }
.vari0 { font-family: "Consolas", "NanumGothicCoding";
	color: darkgoldenrod; font-style: italic; }
.vari1 { font-family: "Consolas", "NanumGothicCoding";
	color: forestgreen; font-style: italic; }
.vari2 { font-family: "Consolas", "NanumGothicCoding";
	color: royalblue; font-style: italic; }
.vari3 { font-family: "Consolas", "NanumGothicCoding";
	color: orchid; font-style: italic; }
.vari4 { font-family: "Consolas", "NanumGothicCoding";
	color: darkgray; font-style: italic; }
.vari5 { font-family: "Consolas", "NanumGothicCoding";
	color: salmon; font-style: italic; }
.vari6 { font-family: "Consolas", "NanumGothicCoding";
	color: steelblue; font-style: italic; }
.emph_bg { color: black; background-color: #fff400}

table { border-collapse: collapse; }
table.border_g1 td, th { border: 1px solid gray; }
table.border_g2 td, th { border: 1px solid darkgray; }
table.border_g3 td, th { border: 1px solid gainsboro; }
td, th { border: 1px solid gray; padding: 3px 4px; }
th { background-color: #DEF; }
td.l { text-align: left; }
td.c { text-align: center; }
td.r { text-align: right; }
/* nb means No Border */
td.nbl { border: 0; text-align: left; }
td.nbc { border: 0; text-align: center; }
td.nbr { border: 0; text-align: right; }

button.a { width: 60px; }
button.b { width: 80px; padding-right: 0px; padding-left: 0px; }
button.c { width: 60px; padding-right: 0px; padding-left: 0px; }

img.fold { margin-right: 2px; margin-left: 2px; }

/* style for login-plate */
.plate td { font-family: NanumGothic, Helvetica; font-size: 10pt; color: #222;
		height: 30px; border: 0px; padding: 1px 3px;
		vertical-align: middle; text-align: right; }
.plate td.hline { border-top: 1px solid #bbb; text-align: center; }
.plate td.save { text-align: center; }
input.input_id { font-family: Helvetica; letter-spacing: 0.07em; }
#joinButton, #loginButton { display: table-cell; vertical-align: middle;
		text-align: center;	height: 13.6mm; width: 13.6mm; color: white;
		background-color: #777; }
#loginButton_s { display: table-cell; vertical-align: middle; text-align: center;
		height: 21.8mm; width: 13.6mm; color: white; background-color: #777; }
.plate td a:link, a:visited { color: #888; text-decoration: none; }
.plate td a:hover { color: red; text-decoration: none; }
.plate td a:active { color: yellowgreen; text-decoration: none; }

/* 위치 미세 조정 (모바일은 아무것도 안 함) */
.down2 {  position: relative; top: 2px; }

/* box-shadow, usage: elt.className = 'boxshadow1'; */
.boxshadow1 {
	box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .25);
	-webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .25);
}
.boxshadow2 {
	box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, .15);
	-moz-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, .15);
	-webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, .15);
}