@charset 'utf-8';
html,body {width:100%;margin:0;padding:0;border:0;min-width:320px;scroll-behavior: smooth;overflow-x: hidden};
body {width:100%;}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
address, code, em, img,
small, strong, sub, sup, var, button,
b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, input, textarea,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary, mark, video, a, a:visited, a:active {margin:0;padding:0;font-family: 돋움, Dotum, Baekmuk Dotum, Undotum, Apple Gothic, Latin font, verdana, sans-serif; font-size:16px;word-break: normal;font-weight:400;line-height:normal; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-moz-box-sizing: border-box; -webkit-box-sizing: border-box;box-sizing:border-box;word-break:keep-all;color:#231F20;}
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }
a, a:hover, a:visited, a:active {text-decoration:none;}
a {-webkit-transition: .3s ease-in-out; transition: .3s ease-in-out;text-decoration: none; color: black}
a:hover {color:#5F9EA0; transition: 0.5s;}
img,iframe,table {border:0}
img,input,select,button,textarea {vertical-align:middle}
ol,ul,li {list-style:none}
tr,td {vertical-align:middle}
em,address {font-style:normal}

::-moz-selection{color:#fff;background:#231F20}
::selection {color:#fff;background:#231F20}
:lang(en) {font-family: 'Poppins', sans-serif;}
svg {height:auto}

@media all and (max-width:320px) {
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
address, code, em, img,
small, strong, sub, sup, var,
b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary, mark, video, a {font-size:13px}
}

/* 인풋 기본 스타일 제거 */
textarea,
input,
select,
button {-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-border-radius:0;border-radius:0;border:0;line-height:normal;}

/* input type number 에서 화살표 제거 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {-webkit-appearance:none;-moz-appearance:none;appearance:none}
input:focus,textarea:focus,button:focus,select:focus {outline: none}
select::-ms-expand {display:none}
textarea {width:100%;background:none;resize:none}
button {border:0;background:none;cursor: pointer;}
select {cursor:pointer;background-color:#fff;outline :none;overflow :hidden;width:100%;background:#fff url('/_public/images/board/bg_select.gif') no-repeat 90% center}

/* placeholder css 적용하기 */
input::placeholder,
textarea::placeholder {color: #231F20;opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {color: #231F20}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {color: #231F20 }
input:-mos-input-placeholder,
textarea:-mos-input-placeholder {color: #231F20;}

/* placeholder 포커스시 감추기*/
input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder { /* WebKit browsers */ color:transparent; }
input:focus:-moz-placeholder, 
textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:transparent; } 
input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */ color:transparent; }
input:focus:-ms-input-placeholder,
textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */ color:transparent; }

/* Padding & Margin  */
.p0 {padding:0px !important}
.pt0 {padding-top:0px !important}
.pr0 {padding-right:0px !important}
.pb0 {padding-bottom:0px !important}
.pl0 {padding-left:0 !important}
.m0 {margin-top:0 !important}
.mt0 {margin-top:0 !important}
.mr0 {margin-right:0 !important}
.mb0 {margin-bottom:0 !important}
.ml0 {margin-left:0 !important}

/* Float */
.fl {float:left}
.fr {float:right}
.cb {clear:both !important}
.clear::after {content:"";display:block;clear:both}

/* Display */
.db {display:block !important}
.di {display:inline !important}
.dib {display:inline-block !important}
.dibw100 {width:100%;display:inline-block;}

/* Alaign */
.tac {text-align:center}

/* Bold */
.bold {font-weight: bold;}

/* Absolute align */
.xyalign {position:absolute;top:50%;left:50%;-moz-transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
.yalign {position:absolute;top:50%;-moz-transform:translateY(-50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);}
.xalign {position:absolute;left:50%;-moz-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);}

/* Border */
.b0 {border:0 !important}
.bt0 {border-top:0 !important}
.bl0 {border-left:0 !important}
.br0 {border-right:0 !important}
.bb0 {border-bottom:0 !important}

/* Popup */
.popup {width:90%;height:auto;display:inline-block;position:absolute; z-index:1000000;max-width:500px}
.popup .popuparea {width:100%;height:auto;position:relative}
.popup .popuparea .ppimg {width:100%;display:inline-block;border:1px solid #fff;overflow:hidden}
.popup .popuparea img {width:100%;object-fit: cover;}
.popup .popuparea .ppclose {position:absolute;font-size:40px;color:#fff;right:-3.5rem;top:-0.5rem;opacity:0.8}
.popup .popuparea .ppclose:hover {opacity:1}
.popup .ppcheck {width:100%;display:inline-block;border:1px solid #fff;line-height:2;text-align:center;background-color:rgba(0,0,0,0.4);color:#fff;}
.popup .ppcheck:hover {background-color:#333;color:#fff;}
.popup .ppcheck i {font-size:1.214rem}
.popup .ppcheck:hover i {font-size:1.214rem;color:#fff;}
.popup .close {width:30px;height:30px;text-align:center;display:inline-block;position:absolute;background-color:#555555;right:0;z-index:9999999;border-radius:100%;right:3%;top:1.8rem}
.popup .close .line {display: inline-block;position:relative;padding: 0;width:2px;height:14px;background:#fff;transform: rotate(45deg);margin-top:0}
.popup .close .line:before {display: block;content: "";position: absolute;top:6px;left:-6px;height:2px;width:14px;background:#fff}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    svg {height:100%}
}

/* float 관련 */
.clear::after {content: ""; display: block; clear: both}
.leftbox {float: left}
.rightbox {float: right}

/* box-shadow */
.shadow {
    -webkit-box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1);
}
/* 말줄임 */
.dot {
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
}
.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
/* 효과 */
.effect1 {
    transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
}