/*@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@300;400;700&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;400;700&display=swap');
html, body {padding:0; margin:0;}
body {font-size:1.2em; position:relative;}
body, input, select, textarea {font-family: 'Noto Sans KR'; font-weight: 400;}
input, select, textarea {font-size:1.0em; padding:5px;}
h1, h2, h3, h4, h5, h6, h7, h8 {font-weight: 700; padding:0; margin:0}
p {padding:0; margin:0; line-height: 1.5; word-break: keep-all;}
b, strong, .bold {font-weight: 700;}
li {list-style: none;}
div {overflow: hidden;}
img {max-width: 100%;}
button {font-size:inherit; cursor: pointer;}
a {text-decoration: none; color:inherit; cursor: pointer;}
a.link {text-decoration: underline;}
.none {display: none;}
.tc {text-align: center;}
.small {font-size:0.8em;}

.box {box-sizing: border-box; display: inline-block;}
.pre {white-space: pre-wrap;}

.wh {white-space: nowrap;}

.rela {position:relative;}
.flex {display: flex;}
.flex.vc {align-items: center;}
.flex.around {justify-content: space-around; align-items: center;}
.flex.between {justify-content: space-between; align-items: center;}
.flex.center {justify-content: center; align-items: center;}
.flex.end {justify-content: end; align-items: center;}

hr.point {width:20px; border:#C00 2px solid; background-color:#C00;}

.pad10 {padding:10px;}
.pad20 {padding:20px;}
.pad30 {padding:30px;}
.pad40 {padding:40px;}
.pad50 {padding:50px;}

.mh100 {min-height: 100px;}
.mh200 {min-height: 200px;}
.mh300 {min-height: 300px;}
.mh400 {min-height: 400px;}

.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt40 {margin-top: 40px;}
.mt50 {margin-top: 50px;}

.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}
.mb50 {margin-bottom: 50px;}

.w100 {width:100%; box-sizing: border-box;}
.w1400 {max-width: 1400px; margin:auto;}
.w800 {max-width: 800px; margin:auto;}
.w600 {max-width: 600px; margin:auto;}

.h100 {height:100%;}
.vh100 {min-height:100vh; padding-top:90px; box-sizing: border-box;}

.color {color:#c1302d;}

.inb {display: inline-block;}

.bg.gray {background-color:#EEE; color:#000;}
.bg.white {background-color:#FFF; color:#000}
.bg.brown {background-color:#c1302d; color:#FFF;}
.bg.black {background-color:#111; color:#FFF;}

.grid {display:grid;}
.grid.p6 {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;}
.grid.p5 {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
.grid.p4 {grid-template-columns: 1fr 1fr 1fr 1fr;}
.grid.p3 {grid-template-columns: 1fr 1fr 1fr;}
.grid.p2 {grid-template-columns: 1fr 1fr;}
.grid.p1 {grid-template-columns: 1fr;}

.btn {background-color:transparent; border:#000 2px solid; padding:10px 20px; margin:1px; font-weight: 700; display: inline-block;}
.btn.black {border:#FFF 2px solid;}
.btn:hover {background-color:#000; color:#FFF;}
.btn.black:hover {background-color:#FFF; color:#000;}

.active {color:#CF0000; font-weight: bold;}

shade {width:100%; height:100%; position:relative; z-index: 1;}
shade.black {background-color:rgba(0,0,0,0.5); display: block;}

#gnb {box-sizing: border-box;}
#gnb nav>span {padding:15px;}
#gnb nav>span a:hover {color:#E75354;}

#tagline {font-size:1.7em;}

.op50 {opacity: 0.5;}
.op60 {opacity: 0.6;}
.op70 {opacity: 0.7;}
.op80 {opacity: 0.8;}
.op50:hover {opacity: 1.0;}

.card {background-color:#FFF; height:100%; box-sizing: border-box; display: grid;}
.card.shadow {box-shadow: 1px 1px 5px 1px #CCC;}

p.link {text-decoration: underline; color:inherit;}

#introduction .wrap {margin-bottom:30px;}
#introduction .wrap:last-child {margin-bottom:0;}

section header {padding:30px;}
section header .big {font-size:1.2em; font-weight: 700;}
section header .link {color:#666; font-size:0.9em;}

#tail {background-color:#85878d; color:#FFF;}

.logo {width:50vw; max-width: 240px;} 
.cls-1{fill:#FFF;}
.cls-2{fill:#FFF;}

.mshow {display: none;}

#board {border-spacing: 0;}
#board th {background-color:#CCC; padding:5px;}
#board td {border-bottom:#CCC 1px solid; padding:5px;}

.dateNum {width:30px; height:30px; border-radius: 30px; cursor: default;}
.break {background-color:#C00; color:#FFF;}
.dateNum.desc {position:relative;}
.dateNum.desc>div {position:absolute;}
.dateNum.desc:hover {cursor: pointer; background-color:#F00 !important;}

@media screen and (max-width:1000px) and (min-width:501px) {
	.grid.t3 {grid-template-columns: 1fr 1fr 1fr;}
	.grid.t2 {grid-template-columns: 1fr 1fr;}
	.grid.t1 {grid-template-columns: 1fr;}
}

@media screen and (max-width:500px) {
	.grid.m3 {grid-template-columns: 1fr 1fr 1fr;}
	.grid.m2 {grid-template-columns: 1fr 1fr;}
	.grid.m1 {grid-template-columns: 1fr;}
	.mnone {display: none;}
	.mshow {display: inherit;}
	.mshow .cls-1{fill:#c1302d;}
	.mshow .cls-2{fill:#85878d;}
	.mshow nav div {text-align: center;}
	.mshow nav div a {padding:20px;}
	#menu {}
	#menu>span {width:30px; height:3px; background-color:#000;}
}