body,h1,h2,h3{font-family:"Malgun Gothic",arial,Tahoma,sans-serif;padding:0;margin:0;font-size:16px}
table {border-collapse:collapse;border-spacing:0;}
img{width:100%;vertical-align:top;border:none}
a{text-decoration:none;color:inherit}
ul,li,ol{list-style:none;padding:0;margin:0}
h2{font-family: 'Noto Sans KR', sans-serif;font-size:16px;line-height:24px;font-weight:700;padding:0 0 10px;color:#06C;border-bottom:1px solid #dedede;}
h4{font-family: 'Noto Sans KR',helvetica,sans-serif,verdana;;font-size:24px;font-weight:700;line-height:1.3;color:#222222;position:relative;margin:10% 0% 3% 2%;padding-left:8px;border-left:5px solid #222222}
@font-face {
    font-family: 'LINESeedKR-Bd';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/LINESeedKR-Bd.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'LINESeedKR-Rg';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/LINESeedKR-Rg.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

u{text-decoration: underline;  text-underline-position: under;}


.mo{display: none;}
.pc{display: block;}

.userCounter { font-size: 1.8em; line-height: 1.3;  background: #361206; text-align: center; padding:7px 5px; letter-spacing: -0.05em; position:relative; z-index:999;}
.datebg { display: inline-block; color:#000; font-weight: bold; height: auto; width: 46px; margin-right: 2px; background-color: #fff; border-radius: 8px; box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .2), inset 2px 4px 0 0 rgba(255, 255, 255, .08); padding: 5px 0;}
.datebg2{ display: inline-block; color:#fff; font-weight: 400; margin-top: 5px; }
.datebg2 p {animation:change_color 2s  infinite; margin: 0}

@keyframes change_color{
  0% {background-color: #d50e0e;}
  50% {background-color: #000;}
  100% {background-color: #d50e0e;}
}

.date2::after, .date4::after{padding-left:10px;}


#container{width:100%;max-width:640px;margin:0 auto}
#container header .toptxt{padding:5% 2% 1%;margin:0 0% 4%;border-bottom:1px solid #dedede}
#container header .toptxt h1{font-family: 'Noto Sans KR',helvetica,sans-serif,verdana; letter-spacing: -1.5px;font-size:32px; line-height:45px;font-weight:bold; padding: 20px 0px 0px;color:131313}
#container header  .toptxt i {color: #4795f7;font-style: normal;font-weight: bold;text-align: left;padding: 10px 0px 10px 0px;}
#container header .toptxt h1 span{color:red}
#container header .toptxt h1 b{font-weight:800;}
#container header .toptxt p{ font-family: 'Noto Sans KR',helvetica,sans-serif,verdana;;font-size:18px;font-weight:500;line-height:1.8;color:#717171;position:relative;}

#container main article p{line-height:30px;font-size:18px;font-family:'Noto Sans KR';color:#333;letter-spacing:-0.2px;text-align:justify;word-break:break-all;padding:3px 3%;box-sizing:border-box;}
#container main article p span{color:red;font-weight: 600;}
#container main article p b{color:#0a0a0a;font-weight: 600;}
#container main article p.subtxt {font-size: 13px;color: #888;text-align: center;}
#container main article img{display:block;margin:0 auto}
#container main .reply{margin-top:2em}
#container main .reply .retop{width:100%;padding:0 5%;box-sizing:border-box;margin:0 auto;position:relative;height:40px;border-bottom:1px solid #a9a9a9}
#container main .reply .retop p{display:inline-block;font-weight:700;margin:0;line-height:40px;letter-spacing:-.035em}
#container main .reply .retop button{position:absolute;right:5%;bottom:7px;font-size:11px;font-weight:700;background:#f2f2f2;border:1px solid #ccc;height:30px}
#container main .reply .retop button span{font-size:10px;color:#ccc}
#container main .reply .retap{white-space:nowrap;border-top:1px solid #ddd}
#container main .reply .retap li{float:left;height:40px;line-height:40px;width:50%;box-sizing:border-box;text-align:center;font-weight:700}
#container main .reply .retap li:first-child{background:#fff;border-bottom:1px solid #ddd;border-right:1px solid #ddd}
#container main .reply .retap li:last-child{color:#396dba;background:#f7f7f7}
#container main .reply .retap::after{content:'';display:block;clear:both}
#container main .reply .retxt{margin:4% 5%;border-bottom:1px solid #ccc}
#container main .reply .retxt img{width:30%}
#container main .reply .retxt p{margin-top:.5em;font-size:.9em;color:#666}
#container main .reply .retxt h3 span{font-size:12px;padding:3px 6px;background:red;color:#fff;border-radius:2px}
#container main .reply .retxt .retime{color:#777;font-size:11px}
#container main .reply .rebtn{position:relative;height:30px;margin:.5em 0}
#container main .reply .rebtn button{font-size:11px;font-weight:700;background:#fbfbfb;border:1px solid #cdcdcd;height:25px}
#container main .reply .rebtn ul{float:right}
#container main .reply .rebtn ul li{float:left;margin-left:.4em}
#container main .reply .rebtn ul li button{padding-left:20px;position:relative}
#container main .reply .rebtn ul li button::before{position:absolute;left:5px;top:5px;content:'';display:block;width:12px;height:12px;background:url(../images/up.png)no-repeat;background-size:100% 100%}
#container main .reply .rebtn ul li:last-child button::before{background:url(../images/down.png)no-repeat;background-size:100% 100%}
#container main .renum{text-align:center}
#container main .renum li{font-size:12px;display:inline-block;width:30px;height:30px;line-height:30px;border:1px solid #ccc;margin:0 5px}
#container main .renum li:first-child{font-weight:700}

#container main footer{display:block;margin-top:2em;border-top:1px solid #d9d9d9;background:#f4f4f4;padding:5%;text-align:center}
#container main footer .foot_p {font-size: 0.85em; margin-top: 3em}
#container main footer button{width:22%;border:1px solid #c7c7c7;height:35px;background:linear-gradient(to bottom,#fefefe,#eeefee);background:-webkit-linear-gradient(to bottom,#fefefe,#eeefee);background:-moz-linear-gradient(to bottom,#fefefe,#eeefee);background:-o-linear-gradient(to bottom,#fefefe,#eeefee)}

#container main button:active{box-shadow:inset 0 2px 5px rgba(0,0,0,.1)}

#db{width:100%;margin: auto 0;box-sizing:border-box}
#db table{width:100%;margin:0 auto 10px;border:10px solid #111;}
#db table th,td{padding:8px 0}
#db table th{width:27%}
#db table td{width:73%}
#db table th span{color:red}
#db table input,#db table select{height:40px;padding-left:5px;box-sizing:border-box;width:90%;font-size:1em}
#db table .tel{font-size:0}
#db table .tel input,#db table .tel select{width:29%;font-size:15px;margin-right: 1%;}
#db table .agree{font-size:10px;text-align:center;color:#999}
#db table .agree input{width:10px;height:10px}
#db table .dbbt{text-align:center;width:100%}
#db table .dbbt input{border:none;width:90%;height:auto}
#db table .result{text-align:center;font-size:12px}
#db table .result input{height:20px;width:20%;background:#f5f5f5;border:1px solid #ccc}

nav {
    position: relative;
    height: 50px;
    padding: 0 20px;
    line-height: 45px;
     margin:0 auto;
    display: flex;
    align-items: center; 
    justify-content: center;
}

nav .logo{
    width:148px;
    height: 50px;
    margin:0 auto;
    text-align:center
}
nav span {
    font-family: 'Noto Sans KR';
    font-weight: 800;
    font-size: 22px;
    color: #333
}

nav #top {
    position: absolute !important;
    right: 10px !important;
    top: 0 !important;
    height: 45px !important;
    width: 60%
}

nav #top ul {
    font-size: 13px;
    color: #999;
    right: 0 !important;
    text-align: right
}

nav #top ul li {
    font-family: 'Noto Sans KR';
    line-height: 45px;
}

nav::after {
    font-family: 'Noto Sans KR';
    content: '';
    display: block;
    clear: both
}

.menu {
border-bottom: 1px solid #dedede;
    background: #fff;
    border-top: 1px solid #dedede;
}

.menu ul {
    font-family: 'Noto Sans KR';
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 640px;
    white-space: nowrap;
    overflow-x: hidden;
 
}

.menu ul li {
    display: inline-block;
    color: #232323;
    width: 19%;
    text-align: center;
    margin: 0;
    padding: 7px 0;
    font-size: 16px;
    
   
}

.menu ul li.chk {
    font-family: 'Noto Sans KR';
    font-weight: 700;
    background: #015aba;
    color:#fff;
}



.fixbt{position:fixed;bottom:0;z-index:8; right:0}
.fixbt img{width:40%;margin:0 auto;float: right;}
.tostPop{position:fixed;left:10%;bottom:12%;width:80%;transform:scale(0);opacity:0;transition:all 0;z-index:9}
.tostPop.on{transform:scale(1);opacity:1;transition:all .3s}
.tostPop .wrapInner{width:100%;max-width:640px;margin:0 auto;position:relative;background:rgba(0,0,0,.7);border-radius:10px;padding:18px 0;color:#fff;text-align:center;box-sizing:border-box;font-weight:700;font-size:17px}
.tostPop .wrapInner b{color:#ffde00}

.w95{width:95%}
.w90{width:90%}
.w20{width:20%}
.p1{color:red}@media screen and (max-width:640px)
{.flip-clock-wrapper ul{width:14%;white-space:nowrap;height:50px;line-height:50px}
.flip-clock-divider{width:5%}
.inn{font-size:40px!important}
.flip-clock-dot.top{top:33px}
.flip-clock-dot.bottom{bottom:32px}
.flip-clock-divider{height:50px}}

article {margin-top: 20px}

.mt20 {margin-top: 20px;}
.mt10 {margin-top: 10px;}

.top_icon img {float: right;width: 26%;padding: 0px 8px 0px 0px;margin-bottom: 7px;}

mark {background: linear-gradient(to top, #fffb8e 50%, transparent 50%)}

@media screen and (max-width: 1080px) {
#db{width:100%;margin:auto 0;box-sizing:border-box}
#db table{width:100%;margin:0 auto 10px;border:10px solid #111;}
#db table th,td{padding:8px 0}
#db table th{width:27%;font-size:0.8em;}
#db table td{width:72%}
#db table th span{color:red}
#db table input,#db table select{height:40px;padding-left:5px;box-sizing:border-box;width:90%;font-size:1em;text-align:left;}
#db table .tel{font-size:0}
#db table .tel input,#db table .tel select{width:29%;font-size:15px;margin-right: 1%;}
#db table .agree{font-size:10px;text-align:center;color:#999}
#db table .agree input{width:10px;height:10px}
#db table .dbbt{text-align:center;width:100%}
#db table .dbbt input{border:none;width:90%;height:auto}
#db table .result{text-align:center;font-size:12px}
#db table .result input{height:20px;width:20%;background:#f5f5f5;border:1px solid #ccc}
}

@media screen and (max-width: 500px){
#container header .toptxt h1{font-family: 'Noto Sans KR',helvetica,sans-serif,verdana; letter-spacing: -1.5px;font-size:20px; line-height:34px;font-weight:bold; padding: 5px 0px 0px;}
#container header  .toptxt i {color: #4795f7;font-style: normal;font-weight: bold;text-align: left;padding: 10px 0px 10px 0px; font-size: 15px}
#container header .toptxt p{ font-family: 'Noto Sans KR',helvetica,sans-serif,verdana;;font-size:13px;font-weight:500;line-height:1.5;color:#717171;position:relative;}
    .userCounter { font-size: 1.0em; line-height: 1.3;  background: #361206; text-align: center; padding:7px 5px; letter-spacing: -0.05em; position:relative; z-index:999;}
.datebg { display: inline-block; color:#000; font-weight: bold; height: auto; width: 46px; margin-right: 2px; background-color: #fff; border-radius: 8px; box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .2), inset 2px 4px 0 0 rgba(255, 255, 255, .08); padding: 5px 0;}
.datebg2{ display: inline-block; color:#fff; font-weight: 400; margin-top: 5px; }
.datebg2 p {animation:change_color 2s  infinite; margin: 0}

@keyframes change_color{
  0% {background-color: #d50e0e;}
  50% {background-color: #000;}
  100% {background-color: #d50e0e;}
}

.date2::after, .date4::after{padding-left:10px;}

    
    h4 {
    font-family: 'Noto Sans KR', helvetica, sans-serif, verdana;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    color: #222222;
    position: relative;
    margin: 10% 0% 3% 2%;
    padding-left: 5px;
    border-left: 5px solid #222222;
}
}


@media screen and (max-width: 280px){
#container main footer button{width:22%;border:1px solid #c7c7c7;height:35px;background:linear-gradient(to bottom,#fefefe,#eeefee);background:-webkit-linear-gradient(to bottom,#fefefe,#eeefee);background:-moz-linear-gradient(to bottom,#fefefe,#eeefee);background:-o-linear-gradient(to bottom,#fefefe,#eeefee);font-size: 0.7em;}
#container main footer .foot_p {font-size: 0.8em; margin-top: 3em}
}

@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

.notosanskr * { 
 font-family: 'Noto Sans KR', sans-serif;
}
