/********************************************************
 Common
********************************************************/

body { margin:0; padding:0; font-size:1rem; box-sizing:border-box; font-family:'Nanum Gothic',sans-serif; }
* { margin:0; padding:0; color:#444444; font-family:'NanumGothic',sans-serif; }

ul,ol,dl { list-style-type:none; }
label { cursor:pointer; }
a { text-decoration:none; color:#444444; }

h1 { font-size:1.5rem; font-weight:600; margin:1rem 0; }
h2 { font-size:1.375rem; font-weight:600; margin:.75rem 0; }
h3 { font-size:1.25rem; font-weight:600; margin:.5rem 0; }
h4 { font-size:1.125rem; font-weight:600; margin:0.25rem 0; }
h5 { font-size:1rem; font-weight:600; margin:0.25rem 0; }
h6 { font-size:0.875rem; font-weight:600; margin:0.25rem 0; }


/* Floating Elements */
.float-wrap { display:block; }
.float-wrap::after { display:block; clear:both; content:''; }
.float-wrap > .float-left { float:left; }
.float-wrap > .float-right { float:right; }

.float-wrap > .float { float:left; margin-right:.25rem; position:relative; }
.float-wrap > .float:last-of-type { margin-right:0; }
.float-wrap.float-50 > .float { width:calc((100% - .25rem) / 2); }
.float-wrap.float-33 > .float { width:calc((100% - .5rem) / 3); }
.float-wrap.float-25 > .float { width:calc((100% - .75rem) / 4); }


/* Alignment */
.center { text-align:center; }
.left { text-align:left; }
.right { text-align:right; }


/********************************************************
 Layout
********************************************************/

#sb-site-in { margin:0 4px; }

.sb-navbar { background:#fff !important; /* border-bottom:0 !important; */ }
.sb-navbar .sb-toggle-right {display:none;}

#logo a { text-decoration:none; font-weight:600; line-height:2.5rem; color:#061a5a; }

@media screen and (min-width:380px) {
	#logo a { font-size:1.5rem; }
}
@media screen and (max-width:379px) {
	#logo a { font-size:1.25rem; }
}

/* navi button : left */
.sb-navbar .sb-toggle-left .navicon-line { background:#008be2; }
/* navi button : right */
.sb-navbar .sb-toggle-right { padding:.75rem .875rem !important; }
.sb-navbar .sb-toggle-right i.fa-cog { font-size:2rem; color:#ffffff; }


/* left menu */
.sb-left ul { list-style-type:none; padding:0; margin:0; }
.sb-left .sb-menu li a { position:relative; display:inline-block; width:100%; margin:2px 0; }
.sb-left .sb-menu li a::after { position:absolute; right:10px; font-family: FontAwesome; content: "\f138"; }

/* right menu */
.sb-right .sb-widget ul { list-style-type:none; padding:0; margin:0; }
.sb-right .sb-widget-content li a { position:relative; display:inline-block; width:100%; margin:6px 0; }
.sb-right .sb-widget-content li a::after { position:absolute; right:5px; font-family: FontAwesome; content: "\f138"; }



#contents { margin:0 0 0 0; padding:0 0 0 0; }

.sub-title > h1 { text-align:center; }
.sub-title-in-bbs > h1 { text-align:center; }

#footer {  width:100%; background:#fff; }



/********************************************************
 Block Wrapper
********************************************************/

/* div, blocks */
.row { margin:10px 0; position:relative; }
.row::after { display:block; clear:both; content:''; }

.input-wrap { position:relative; }
.input-wrap::after { display:block; clear:both; content:''; }

.button-wrap { position:relative; }
.button-wrap::after { display:block; clear:both; content:''; }

.inline-wrap { position:relative; }



/********************************************************
 Variables
********************************************************/
:root {
	--in-border-color:#bbbbbb;
	--in-focus-color:#991313;
	--in-check-color:#c62828;
}


/********************************************************
 FORM Elements
********************************************************/

input[type=file] { font-size:.8125rem; }

/* input : 입력창 */
input[type=text],
input[type=password],
input[type=date],
input[type=number],
input[type=tel],
input[type=time],
input[type=email],
input[type=url],
input[type=search],
input[type=''],
input:not([type])
{ 
	display:inline-block;
	padding:.25rem; 
	font-size:.875rem;
	border:1px solid #bbbbbb;
	border-radius:.25rem;
	height:1.75rem;
	background:#ffffff;
}

input[type=text]:focus,
input[type=password]:focus,
input[type=date]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=time]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=search]:focus,
input[type='']:focus,
input:not([type]):focus
{ 
	outline:none;
	border:1px solid #991313;
}

textarea {
	display:inline-block;
	padding:.25rem; 
	font-size:.875rem;
	border:1px solid #bbbbbb;
	border-radius:.25rem;
}

textarea:focus {
	outline:none;
	border:1px solid #991313;
}




/* input : 선택창 */
input[type=checkbox] {}

input[type=radio] {}

/* input:radio Modify */
input.input-radio { display:none; }
input.input-radio + label.input-radio-label { 
	display:block;
	float:left;
	font-size:.875rem;
	padding:.3125rem .5rem;
	height:1.75rem;
	border:1px solid #bbbbbb; 
	background-color:#eeeeee;
}
input.input-radio:checked + label.input-radio-label { 
	background-color:#c62828;
	color:#ffffff;
}

.input-wrap > .input-radio-label:first-of-type { border-top-left-radius:.25rem; border-bottom-left-radius:.25rem; }
.input-wrap > .input-radio-label:last-of-type { border-top-right-radius:.25rem; border-bottom-right-radius:.25rem; }
.input-wrap > .input-radio-label:not(:first-of-type) { border-left:none; }

/* input:checkbox Modify */
input.input-checkbox { display:none; }
input.input-checkbox + label.input-checkbox-label { 
	display:block;
	float:left;
	font-size:.875rem;
	padding:.25rem .5rem; 
	height:1.75rem;
	border:1px solid #bbbbbb; 
	background-color:#eeeeee;
}
input.input-checkbox:checked + label.input-checkbox-label { 
	background-color:#c62828;
	color:#ffffff;
}

.input-wrap > .input-checkbox-label:first-of-type { border-top-left-radius:.25rem; border-bottom-left-radius:.25rem; }
.input-wrap > .input-checkbox-label:last-of-type { border-top-right-radius:.25rem; border-bottom-right-radius:.25rem; }
.input-wrap > .input-checkbox-label:not(:first-of-type) { border-left:none; }


/* select */
select { 
	display:inline-block;
	padding:.25rem; 
	font-size:.875rem;
	border:1px solid #bbbbbb;
	border-radius:.25rem;
	height:1.75rem;
	background-color:#ffffff;
	cursor:pointer;
}
select:focus {
	outline:none;
	border:1px solid #991313;
}

.select-wrap {
	position:relative;
	display:inline-block;
	width:20rem;
	max-width:20rem;
	overflow:hidden;
	border:1px solid #bbbbbb;
	border-radius:.25rem;
	height:1.75rem;
}
.select-wrap::after {
	position: absolute;
	display:block;
	content: "\f13a"; 
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	font-size: 1rem;
	color: #aaaaaa;
	top: .3125rem;
	/* left:18.5rem; */
	right:.5rem;
	z-index: 1;
}
.select-wrap:focus {
	outline:none;
	border:1px solid #991313;
}

.select-wrap > select { 
	width:110%;
	padding:.25rem; 
	font-size:.875rem;
	border:0px;
	background-color:#ffffff;
}
.select-wrap > select:focus {
	outline:none;
	border:0px solid #991313;
}

/* Input + Icon */
i.input-icon { font-size:.875rem; position:absolute; }
i.input-icon.left { top:7px; left:7px; }
i.input-icon.right { top:0; right:0; }

.input-icon.left + .input-text { padding-left:1.5rem; }

/* Button
	input[type=button],
	input[type=submit],
	input[type=reset],
	button,
	a
 */
.input-button {
	display:inline-block;
	padding:.25rem .5rem;
	margin:0 0 .125rem 0;
	font-size:.875rem;
	line-height:.875rem;
	border:1px solid #bbbbbb;
	border-radius:.25rem;
	height:1.875rem;
	cursor:pointer;
	text-decoration:none;
	color:#333333;
	background-color:#f0f0f0;
	vertical-align:baseline;
}
.input-button.on {
	color:#ffffff;
	background-color:#c62828;
}

a.input-button {
	vertical-align:bottom;
	padding:.375rem .5rem .25rem;
}

.input-button:focus {
	outline:none;
	border:1px solid #991313;
}

/* Button in Group */
.button-wrap > .input-button {
	display:block;
	float:left;
	font-size:.875rem;
	padding:.3125rem .5rem;
	height:1.75rem;
	border:1px solid #bbbbbb; 
	border-radius:0;
	background-color:#eeeeee;
}
.button-wrap > .input-button:first-child { border-top-left-radius:.25rem; border-bottom-left-radius:.25rem; }
.button-wrap > .input-button:last-child { border-top-right-radius:.25rem; border-bottom-right-radius:.25rem; }
.button-wrap > .input-button:not(:first-child) { border-left:none; }

/* input, button in Group */
	/* select, checkbox, radio는 개별 wrapper 필요함 */
	/* input:text는 wrapper 없이 직접 child로 위치함 */
.input-group {}
.input-group::after { display:block; clear:both; content:''; }
.input-group > .input-member { display:block; border:1px solid #aaaaaa; float:left; overflow:hidden; }
.input-group > .input-member.input-button { border-radius:0; margin:0; }
.input-group > .input-member > input.input-checkbox + label.input-checkbox-label { border:0; }
.input-group > .input-member > input.input-radio + label.input-radio-label { border:0; }
.input-group > .input-member:first-child { border-top-left-radius:.25rem; border-bottom-left-radius:.25rem; }
.input-group > .input-member:last-child { border-top-right-radius:.25rem; border-bottom-right-radius:.25rem; }
.input-group > .input-member:not(:first-child) { border-left:none; }



/* List of Text, BBS */
.list-wrap {}
.list-wrap > li { position:relative; border:1px solid #bbbbbb; padding:.5rem .25rem .375rem .375rem; }
.list-wrap > li:not(:first-child) { border-top:0; }
.list-wrap > li:first-child { border-top-left-radius:.25rem; border-top-right-radius:.25rem; }
.list-wrap > li:last-child { border-bottom-left-radius:.25rem; border-bottom-right-radius:.25rem; }
.list-wrap > li::after { position:absolute; top:1.25rem; right:.625rem; font-family:FontAwesome; content:"\f138"; color:#aaaaaa; }
.list-wrap > li h5 { font-size:1rem; font-weight:normal; width:calc(100% - 1.5rem); text-overflow:ellipsis; overflow:hidden; white-space:nowrap; margin:0 0 5px 0; }
.list-wrap > li div.sub { padding:0 0 0 1.25rem; }
.list-wrap > li div.sub span { font-size:.8125rem; color:#777777;  }
.list-wrap > li div.sub span::after { content:'|'; margin:0 .375rem 0 .5rem; color:#aaaaaa; }
.list-wrap > li div.sub span:last-child::after { content:''; }


/**********************
 Error or Alert : overwrite JQM css
**********************/
.ui-bar { background:#444444; color:#ffffff; }
.ui-bar > h5 { text-align:center; color:#ffffff; padding:.25rem 0; }
.ui-body { margin:2rem 0 4rem; }
.ui-body .input-wrap { margin:2rem 0 0 0; text-align:center; }

/**********************
 Error or Alert : foundation Style
**********************/

.callout { margin:0px; padding:10px; }
.callout.alert { background:#f7e4e1; border:1px solid rgba(10, 10, 10, 0.25); }
.callout h5 { margin:0 0 20px 0; }
.callout p { margin:0 0 20px 0; }
.callout p + a { text-align:center; }

/**********************
 Font Style & Color
**********************/

/* decoration */
.underline { text-decoration:underline; }
.under { text-decoration:underline; }

/* text */
.bold { font-weight:600; }

/* color */
.aliceblue { color:aliceblue; }
.antiquewhite { color:antiquewhite; }
.aqua { color:aqua; }
.aquamarine { color:aquamarine; }
.azure { color:azure; }
.beige { color:beige; }
.bisque { color:bisque; }
.black { color:black; }
.blanchedalmond { color:blanchedalmond; }
.blue { color:blue; }
.blueviolet { color:blueviolet; }
.brown { color:brown; }
.burlywood { color:burlywood; }
.cadetblue { color:cadetblue; }
.chartreuse { color:chartreuse; }
.chocolate { color:chocolate; }
.coral { color:coral; }
.cornflowerblue { color:cornflowerblue; }
.cornsilk { color:cornsilk; }
.crimson { color:crimson; }
.cyan { color:cyan; }
.darkblue { color:darkblue; }
.darkcyan { color:darkcyan; }
.darkgoldenrod { color:darkgoldenrod; }
.darkgray { color:darkgray; }
.darkgreen { color:darkgreen; }
.darkkhaki { color:darkkhaki; }
.darkmagenta { color:darkmagenta; }
.darkolivegreen { color:darkolivegreen; }
.darkorange { color:darkorange; }
.darkorchid { color:darkorchid; }
.darkred { color:darkred; }
.darksalmon { color:darksalmon; }
.darkseagreen { color:darkseagreen; }
.darkslateblue { color:darkslateblue; }
.darkslategray { color:darkslategray; }
.darkturquoise { color:darkturquoise; }
.darkviolet { color:darkviolet; }
.deeppink { color:deeppink; }
.deepskyblue { color:deepskyblue; }
.dimgray { color:dimgray; }
.dodgerblue { color:dodgerblue; }
.firebrick { color:firebrick; }
.floralwhite { color:floralwhite; }
.forestgreen { color:forestgreen; }
.fuchsia { color:fuchsia; }
.gainsboro { color:gainsboro; }
.ghostwhite { color:ghostwhite; }
.gold { color:gold; }
.goldenrod { color:goldenrod; }
.gray { color:gray; }
.green { color:green; }
.greenyellow { color:greenyellow; }
.honeydew { color:honeydew; }
.hotpink { color:hotpink; }
.indianred { color:indianred; }
.indigo { color:indigo; }
.ivory { color:ivory; }
.khaki { color:khaki; }
.lavender { color:lavender; }
.lavenderblush { color:lavenderblush; }
.lawngreen { color:lawngreen; }
.lemonchiffon { color:lemonchiffon; }
.lightblue { color:lightblue; }
.lightcoral { color:lightcoral; }
.lightcyan { color:lightcyan; }
.lightgoldenrodyellow { color:lightgoldenrodyellow; }
.lightgray { color:lightgray; }
.lightgreen { color:lightgreen; }
.lightpink { color:lightpink; }
.lightsalmon { color:lightsalmon; }
.lightseagreen { color:lightseagreen; }
.lightskyblue { color:lightskyblue; }
.lightslategray { color:lightslategray; }
.lightsteelblue { color:lightsteelblue; }
.lightyellow { color:lightyellow; }
.lime { color:lime; }
.limegreen { color:limegreen; }
.linen { color:linen; }
.magenta { color:magenta; }
.maroon { color:maroon; }
.mediumaquamarine { color:mediumaquamarine; }
.mediumblue { color:mediumblue; }
.mediumorchid { color:mediumorchid; }
.mediumpurple { color:mediumpurple; }
.mediumseagreen { color:mediumseagreen; }
.mediumslateblue { color:mediumslateblue; }
.mediumspringgreen { color:mediumspringgreen; }
.mediumturquoise { color:mediumturquoise; }
.mediumvioletred { color:mediumvioletred; }
.midnightblue { color:midnightblue; }
.mintcream { color:mintcream; }
.mistyrose { color:mistyrose; }
.moccasin { color:moccasin; }
.navajowhite { color:navajowhite; }
.navy { color:navy; }
.oldlace { color:oldlace; }
.olive { color:olive; }
.olivedrab { color:olivedrab; }
.orange { color:orange; }
.orangered { color:orangered; }
.orchid { color:orchid; }
.palegoldenrod { color:palegoldenrod; }
.palegreen { color:palegreen; }
.paleturquoise { color:paleturquoise; }
.palevioletred { color:palevioletred; }
.papayawhip { color:papayawhip; }
.peachpuff { color:peachpuff; }
.peru { color:peru; }
.pink { color:pink; }
.plum { color:plum; }
.powderblue { color:powderblue; }
.purple { color:purple; }
.red { color:red; }
.rosybrown { color:rosybrown; }
.royalblue { color:royalblue; }
.saddlebrown { color:saddlebrown; }
.salmon { color:salmon; }
.sandybrown { color:sandybrown; }
.seagreen { color:seagreen; }
.seashell { color:seashell; }
.sienna { color:sienna; }
.silver { color:silver; }
.skyblue { color:skyblue; }
.slateblue { color:slateblue; }
.slategray { color:slategray; }
.snow { color:snow; }
.springgreen { color:springgreen; }
.steelblue { color:steelblue; }
.tan { color:tan; }
.teal { color:teal; }
.thistle { color:thistle; }
.tomato { color:tomato; }
.turquoise { color:turquoise; }
.violet { color:violet; }
.wheat { color:wheat; }
.white { color:white; }
.whitesmoke { color:whitesmoke; }
.yellow { color:yellow; }
.yellowgreen { color:yellowgreen; }