body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, p { margin:0; padding:0; font-size: 1em; }
img { border: 0; vertical-align: middle; }
ol, ul { list-style: none; }
button,
input,
body { font-family: 'Noto Sans KR', sans-serif; }

body > header.default {
	border-top: 35px solid rgb(247,240,240);
	display: flex; justify-content: center; align-items: center;
	height: 180px;
	box-sizing: border-box;
	border-bottom: 1px solid rgb(247,240,240);
}
body > header.default > h1 { text-align: center; }
body > header.default > h1 a { color: silver; font-weight: 700; font-size: 4em; }
body > header.default > h1 img { margin-top: -20px; vertical-align: top; }
body > header.default menu { width: 500px; display: flex; justify-content: center; align-items: center; text-align: center; }
body > header.default menu li { width: calc(100% / 3); }
body > header.default menu li a { color: black; font-size: 1.2em; }
body > header.default div.users { width: 420px; }
body > header.default div.users form { overflow: hidden; }
body > header.default div.users form select,
body > header.default div.users form input { width: 126px; height: 37px; border: 1px solid rgb(170,170,170); box-sizing: border-box; padding: 0 10px; font-size: 0.9em; }
body > header.default div.users form button { width: 75px; height: 37px; border: 1px solid rgb(170,170,170); box-sizing: border-box; background: rgb(252,176,65); color: white; font-size: 0.9em; }
body > header.default div.users form a {
	display: inline-block; width: 75px; height: 37px; border: 1px solid rgb(170,170,170); box-sizing: border-box; background: rgb(28,117,187); color: white;
	line-height: 35px; text-align: center; font-size: 0.9em;
}
body > header.default div.users form div.superid,
body > header.default div.users form div.id { float: left; margin: 0 4px 0 0; }
body > header.default div.users form div.pw { float: left; margin: 0 4px 0 0; }
body > header.default div.users form div.submit { float: left; margin: 0 5px 0 0; }
body > header.default div.users form div.signup { float: left; }
body > header.default div.users form #superlogin div.id { display: none; }
body > header.default div.users ul { display: flex; justify-content: center; align-items: center; text-align: center; }
body > header.default div.users li { margin-left: 5px; }
body > header.default div.users li a {
	display: block; width: 75px; height: 37px; line-height: 35px; box-sizing: border-box; border: 1px solid rgb(170,170,170); color: white;
	font-size: 0.9em;
}
body > header.default div.users li:nth-of-type(1) a { background: rgb(28,116,187); }
body > header.default div.users li:nth-of-type(2) a { background: rgb(252,176,66); }
body > header.default div.users li:nth-of-type(3) a { background: rgb(100,153,197); }
body > header.default div.users li:nth-of-type(4) a { background: rgb(170,170,170); }
body > header.default div.users li:nth-of-type(5) a { background: rgb(0,0,0); }
body > header.default div.users ul.myinfo { padding: 10px 0; }
body > header.default div.users ul.myinfo li { font-weight: 700; margin: 0 10px; }
body > header.default div.users ul.myinfo li:before { font-family: 'Font Awesome 6 Free'; color: red; margin: 0 2px 0 0; text-shadow: 1px 1px 1px black; }
body > header.default div.users ul.myinfo li.ruby:before { content: '\f3a5'; color: magenta; }
body > header.default div.users ul.myinfo li.gold:before { content: '\f51e'; color: gold; }
body > header.default div.users ul.myinfo li.silver:before { content: '\f51e'; color: silver; }

body > main.default { overflow: hidden; min-height: 500px; }
main.default > section { max-width: 1200px; margin: 0 auto 50px; }
main.default > section > h2 { text-align: center; padding: 50px 0; font-size: 2em; font-weight: 700; }
main.default > section > article { background: #f4f4f4; padding: 10px; }
main.default > section > article > h3 { border-bottom: 1px solid #ddd; padding: 10px 0; margin: 0 0 20px; }
main.default > section > div.shortcuts { text-align: right; margin: 0 0 10px; }
main.default > section > div.shortcuts a { color: black; font-size: 1.2em; margin: 0 10px; }
main.default > section > div.shortcuts a i { margin: 0 5px 0 0; color: red; }
main.default > section > article > form > dl { margin: 0 0 20px; }
main.default > section > article > form > dl > dt { font-weight: 700; margin: 0 0 5px; }
main.default > section > article > form > dl > dd > select { padding: 6px 10px 7px; box-sizing: border-box; border: 1px solid #ddd; outline: 0; border-radius: 0; vertical-align: middle; }
main.default > section > article > form > dl > dd > textarea,
main.default > section > article > form > dl > dd > input[type=number],
main.default > section > article > form > dl > dd > input[type=text] { padding: 3px; box-sizing: border-box; border: 1px solid #ddd; outline: 0; border-radius: 0; vertical-align: middle; }
main.default > section > article > form > dl > dd > input::placeholder { color: darkgray; font-size: 0.9em; }
main.default > section > article > form div.buttons { padding: 20px 0; text-align: center; display: flex; justify-content: center; align-items: center; }
main.default > section > article > form div.buttons button { background: gray; color: white; padding: 10px 20px; margin: 10px; border: 0; }
main.default > section > article > form div.buttons button.submit { background: rgb(37,61,190); }

body > footer.default { background: url('../img/footerbg.gif'); padding: 0 0 100px; color: white; text-align: center; padding: 10px 0; }
body > footer.default section:nth-of-type(1) { display: flex; justify-content: center; align-items: center; height: 190px; }
body > footer.default section:nth-of-type(1) dl { width: 390px; box-sizing: border-box; padding-left: 30px; position: relative; }
body > footer.default section:nth-of-type(1) dl:after {
	content: ''; width: 1px; height: 80px; background: rgb(121,121,121);
	position: absolute; right: 0; top: 50%; margin-top: -40px;
}
body > footer.default section:nth-of-type(1) dt { color: rgb(229,225,225); }
body > footer.default section:nth-of-type(1) dd { color: rgb(157,157,157); }
body > footer.default section:nth-of-type(1) ul { display: flex; justify-content: center; align-items: center; width: 400px; }
body > footer.default section:nth-of-type(1) li { margin: 0 20px; }
body > footer.default section:nth-of-type(1) li a { color: rgb(165,165,165); }
body > footer.default section:nth-of-type(1) li a i {
	display: block; width: 60px; height: 60px; border: 1px solid rgb(106,106,106); border-radius: 30px; box-sizing: border-box;
	text-align: center; line-height: 58px; font-size: 2em;
}
body > footer.default section:nth-of-type(2) { border-top: 1px solid rgb(62,62,62); border-bottom: 1px solid rgb(62,62,62); margin: 0 0 34px; }
body > footer.default section:nth-of-type(2) ul { height: 60px; max-width: 1200px; margin: 0 auto; display: flex; justify-content: center; align-items: center; }
body > footer.default section:nth-of-type(2) ul li { padding: 0 15px; }
body > footer.default section:nth-of-type(2) ul a { color: rgb(164,164,164); }
body > footer.default section:nth-of-type(3) { max-width: 1200px; margin: 0 auto; overflow: hidden; color: rgb(163,163,163); }
body > footer.default section:nth-of-type(3) div.copyright { float: left; width: 720px; box-sizing: border-box; padding-left: 20px; }
body > footer.default section:nth-of-type(3) div.copyright p span:before { content: '/'; margin: 0 20px; }
body > footer.default section:nth-of-type(3) div.copyright p span:first-child:before { display: none; }
body > footer.default section:nth-of-type(3) div.logo {
	float: left; width: 480px; min-height: 100px; box-sizing: border-box; padding-left: 105px;
	background: url('../img/footerlogo.png') no-repeat; font-size: 0.9em;
}

@media (max-width: 1000px) {
	body > header.default { display: block; height: auto; }
	body > header.default h1 { padding: 20px 0; text-align: center; }
	body > header.default menu { width: 100%; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; }
	body > header.default menu a { display: block; padding: 15px 0; }
	body > header.default div.users { text-align: center; padding: 10px 0; width: 100%; }
	body > footer.default div.signature div.copyright { width: auto; float: none; margin: 0 0 20px; }
	body > footer.default div.signature div.logo { width: auto; float: none; }
}