@charset "utf-8";

@import "/doyac/font/material-design-iconic/css/material-design-iconic-font.min.css";


@font-face {
    font-family: 'NanumGothic';
    font-style: normal;
    font-weight: 400;
    src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot);
    src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
    url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'),
    url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype');
}

@font-face {
    font-family: 'NanumGothicBold';
    font-style: normal;
    font-weight: 700;
    src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot);
    src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
    url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'),
    url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype');
}


/*-- 공통정의 Start --*/
html {font-size: 16px; text-underline-position: under;scroll-behavior: unset;}
html, body {margin: 0; padding: 0; width: 100%; min-height:100%;}
body {background: #fff; font-size:13px; line-height:1.5em; color:#808080; font-family:'나눔고딕',NanumGothic,NG,'돋움',Dotum,'맑은고딕','Malgun Gothic','굴림',Gulim,Helvetica,sans-serif!important;}
table {border-spacing: 0; line-height:1.5em; border-collapse: collapse; empty-cells: show; font-family:'나눔고딕',NanumGothic,NG,'돋움',Dotum,'맑은고딕','Malgun Gothic','굴림',Gulim,Helvetica,sans-serif;}
table caption {display:none;}
th {font-weight:bold; line-height:1.5em; font-family:'나눔고딕',NanumGothicBold,'돋움',Dotum,'맑은고딕','Malgun Gothic','굴림',Gulim,Helvetica,sans-serif;}
td {font-weight:normal; line-height:1.5em;}
input {margin: 0; padding: 0; vertical-align: middle;}
input, textarea, select {font-size:12px; line-height:1.5em; font-family:'나눔고딕',NanumGothic,NG,'돋움',Dotum,'맑은고딕','Malgun Gothic','굴림',Gulim,Helvetica,sans-serif; color:#666666;}
form {margin: 0; padding: 0;}
textarea {overflow: auto; border: 1px solid #B9B9B9; background: #ffffff;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-family:'나눔고딕',NanumGothic,NG,'돋움',Dotum,'맑은고딕','Malgun Gothic','굴림',Gulim,Helvetica,sans-serif; margin: 0 0 0 0;}
h1 {line-height: 100%;}
h2, h3, h4, h5, h6 {line-height: 120%;}
img, fieldset, button {border:none;}
fieldset {margin: 0; padding: 0;}
ol, ul, dl, li, dt, dd, pre {margin:0 0 0 0; padding:0 0 0 0;}
.alert p{margin-bottom: 0;}
li {list-style:none; line-height: 1.5em;}
li img {vertical-align:middle;} /* for IE image margin */
a {text-decoration:none; border:none;}
a, a:link, a:visited, a:hover, a:active, a:focus {text-decoration:none;}
a[target]:not(.btn) {text-decoration:none !important}
b,strong{font-weight:bold;}
option {padding-right:6px;} /* Firefox Fix */
/*legend {position:absolute; top:0; left:0; width:0; height:0; margin:0; padding:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;} !* For Screen Reader *!*/
div {margin: 0; padding: 0;}
img.map, map area{outline: none;}
html body a {color: #222223;}
/* 관리자일때만 */
html body .widget-container#main .jarviswidget a:not(.btn):not(.btn-bs3) {color: #886ab5;}
.li-style-disc{list-style: disc!important;}
.li-style-dash{list-style-type: "- " !important;}

/*img {max-width: 100%;}*/

input[type="search"] {box-sizing: border-box;}
strong {font-weight: 700;}
article {width: 100%;}
label:focus,input:focus{outline:none;}

.iframe_container {display:flex;background-image: url('https://imagedelivery.net/iF917V18P88uIhA8kbNa1A/6cd4c85d-c43d-46f2-0ba5-b0e5b0bb4100/xs');background-size:150px;background-color: #585858;background-position: center;background-repeat: no-repeat;}
.iframe_container iframe {background: transparent;}


/*bootstrap class 변경이나 추가*/
@media (min-width: 490px){
    .modal-md {
        width: 450px;
        margin: 10px auto;
    }
}

.pull-right {float: right;}
.legend {border-bottom-style:dotted; border-bottom-color: lightgrey; font-weight: 700;font-size: 16px; margin:20px 0; padding-bottom: 10px;}

/*카드형 틀 기본값*/
.bgBorderT {border-top: solid 10px #efefef;}
.bgBorderB {border-bottom: solid 1px #e2e2e2;}



.btn-danger {background-color: #e03333; border-color: #e03333;}
.btn-danger.active, .btn-danger.focus, .btn-danger:active, .btn-danger:focus, .btn-danger:hover, .open > .dropdown-toggle.btn-danger {color: #fff; background-color: #cc002f; border-color: #b40023;}
.btn-red {background-color: #c43232; border-color: #c43232; color: #fff;}
a:visited.btn-red {color: #fff;}
.btn-red.active, .btn-red.focus, .btn-red:active, .btn-red:focus, .btn-red:hover, .open > .dropdown-toggle.btn-red {color: #fff; background-color: #cc002f; border-color: #b40023;}
.btn-orange {background-color: #f70; border-color: #ff9e00; color: #fff;}
.btn-orange.active, .btn-orange.focus, .btn-orange:active, .btn-orange:focus, .btn-orange:hover, .open > .dropdown-toggle.btn-orange {color: #fff; background-color: #e65100; border-color: #ff8617;}
.btn-black {background-color: #000; border-color: #111; color: #fff;}
.btn-black.active, .btn-black.focus, .btn-black:active, .btn-black:focus, .btn-black:hover, .open > .dropdown-toggle.btn-black {color: #fff; background-color: #222; border-color: #303030;}


/** 컬러 관련 값들 **/
.blueFontTitle1{color:#2c8ad3;font-weight: 600;line-height:1.3em;font-size:21px;}


.formTypeA p {margin-bottom:0px;}
/*프린트 했을때 경로가 나와서 이 코드로 숨김처리 함*/
@media print {
    a[href]:after {
        content: " (" attr(href) ")";
    }
}
@media print {
    a[href]:after {
        content: none !important;
    }
}

/*사이트 기본값이 hr display:none 이라 summernote 를 쓰는 곳에서만 hr이 보이게 설정해둠*/
.note-editor.note-frame .note-editing-area .note-editable{
    line-height: 1.8em;
    font-size: 15px;
    font-family:"나눔고딕", NanumGothic;
}
.note-editor.note-frame .note-editing-area .note-editable hr{
    display:block;
    border-top-color: rgb(0, 0, 0);
}
.note-editable p img{
    max-width: 100%;
}
.note-editor p{
    padding-left :0;
}
.boardView .viewCont hr, .board-view-contents hr{
    display: block;
    border-top-color: rgb(0, 0, 0);
}
.note-control-selection{
    width: 100%;
}

.note-editing-area ::-moz-selection {
    background: #f00;
    color: #fff;
}
.note-editing-area ::selection {
    background: #f00;
    color: #fff;
}
/*레이아웃*/
.disBk {display: block;}
.disIn {display: inline-block;}
.disTable {display: table;}
.disTableCell {display: table-cell;}
.disNone {display: none;}
.disNoneImportant {display: none!important;}
.posiR {position: relative;}
.posiA {position: absolute;}
.posiF {position: fixed;}
.flR {float: right;}
.flL {float: left;}
.clBoth {clear: both;}
.margin0auto {margin: 0 auto;}
.pad0 {padding: 0;}
.padding0 {padding: 0;}
.pa-0{padding:0!important;}
.basicMaxWidth {width: 1100px;}
.width100 {width: 100%;}
.cursorPointer {cursor: pointer;}
.clearBothOnly:after {display: table; content: " "; clear: both;}
.transparent{background-color: transparent;-webkit-box-shadow: 0 0 0;box-shadow: 0 0 0;}
.v-align-m{vertical-align: middle;}
header .app-header{top:0px;}
header .app-header.transparent a,header .app-header.transparent a:hover,header .app-header.transparent a:link {color:#fff;}
header .app-header:hover{background-color:#fff;color: #212121;}
header.transparent .app-header:hover{background-color:#fff;color: #fff;}
header .app-header:hover #hasTitle{ color: #212121!important; -webkit-transition: color .5s;transition: color .5s ease-in-out;}
header.transparent .app-header:hover #hasTitle{ color: #fff!important; -webkit-transition: color .5s;transition: color .5s ease-in-out;}
header .app-header:hover .homeAsUp{ color: #212121!important; -webkit-transition: color .5s;transition: color .5s ease-in-out;}
header.whiteMode .app-header:hover .actionItems a{ color: #212121!important;}
header.transparent .app-header:hover .actionItems a{ color: #fff!important;}
header .app-header:hover .actionItems a{-webkit-transition: color .5s;transition: color .5s ease-in-out;}
header .app-header.force_white {     border-bottom-style: solid;box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);border-color: #e2e2e2;background-color:#fff;color: #212121!important; -webkit-transition: color .5s,background-color .5s,border-color .5s,box-shadow .5s ease-in-out;transition: color .5s,background-color .5s,border-color .5s,box-shadow .5s ease-in-out;}
header .app-header.force_white #hasTitle{ color: #212121!important; -webkit-transition: color .5s;transition: color .5s ease-in-out;}
header .app-header.force_white .homeAsUp{ color: #212121!important; -webkit-transition: color .5s;transition: color .5s ease-in-out;}
header .app-header.force_white .actionItems a{ color: #212121!important; -webkit-transition: color .5s;transition: color .5s ease-in-out;}
header.transparent .bigTopMenuLayout i {color: #fff;}


.loader-moving{position:fixed;width:100%;height:100%;left:0;top:0;background:#fff;z-index:1000;transition:all 1s}
.loader-moving > span{position:absolute;top:50%;left:50%;width:20px;height:20px;border-radius:100%;margin:-10px 0 0}
.loader-moving > span.left{background:olive;transform:translateX(-30px);animation:circleLeft 1s cubic-bezier(.645,.045,.355,1) infinite}
.loader-moving > span.right{background:#dc143c;transform:translateX(30px);animation:circleRight 1s cubic-bezier(.645,.045,.355,1) infinite}
.loader-moving.end{opacity:0;z-index:-1}


/* 폰트 */
.itemInfoBigTitle {font-size: 30px; font-weight: 600; margin-bottom: 30px; color: #444;}
.txtLineDot2 {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; overflow: hidden; text-overflow: ellipsis;}
.txtLineDot3 {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; overflow: hidden; text-overflow: ellipsis;}
.txtOverHidden {text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.txtCutBig {word-break: keep-all;}
.txtCenter {text-align: center;}
.txtLeft {text-align: left;}
.txtRight {text-align: right;}
.letterSpacing-1 {letter-spacing: -1px;}
.fontW500 {font-weight: 500;}
.fontW600 {font-weight: 600;}
.fontW700 {font-weight: 700;}
.font-bold {font-weight: bold;}

.margin5-top {margin-top: 5px;}

/*미디어쿼리를 편하게 적용하기 위해 웹디자인 할 때 자주 사용하는 사이즈를 모아둠*/
@media screen and (min-width: 850px) {
    .u-font-xl {
        font-size: 48px;
        line-height: 57px;
    }

    .u-font-lg {
        font-size: 30px;
        line-height: 39px;
    }

    .u-font-md {
        font-size: 25px;
        line-height: 34px;
    }

    .u-font-sm {
        font-size: 20px;
        line-height: 30px;
    }

    .u-font-xs {
        font-size: 16px;
        line-height: 26px;
    }

    .u-margin10-top {margin-top: 10px;}
    .u-margin10-bottom {margin-bottom: 10px;}
    .u-margin10-top-bottom {margin-top: 10px; margin-bottom: 10px;}
    .u-margin20-top {margin-top: 20px;}
    .u-margin20-bottom {margin-bottom: 20px;}
    .u-margin20-top-bottom {margin-top: 20px; margin-bottom: 20px;}
    .u-margin30-top {margin-top: 30px;}
    .u-margin30-bottom {margin-bottom: 30px;}
    .u-margin30-top-bottom {margin-top: 30px; margin-bottom: 30px;}
    .u-margin40-top {margin-top: 40px;}
    .u-margin40-bottom {margin-bottom: 40px;}
    .u-margin40-top-bottom {margin-top: 40px; margin-bottom: 40px;}
    .u-margin50-top {margin-top: 50px;}
    .u-margin50-bottom {margin-bottom: 50px;}
    .u-margin50-top-bottom {margin-top: 50px; margin-bottom: 50px;}
    .u-margin60-top {margin-top: 60px;}
    .u-margin60-bottom {margin-bottom: 60px;}
    .u-margin60-top-bottom {margin-top: 60px; margin-bottom: 60px;}
    .u-margin70-top {margin-top: 70px;}
    .u-margin70-bottom {margin-bottom: 70px;}
    .u-margin70-top-bottom {margin-top: 70px; margin-bottom: 70px;}
    .u-margin80-top {margin-top: 80px;}
    .u-margin80-bottom {margin-bottom: 80px;}
    .u-margin80-top-bottom {margin-top: 80px; margin-bottom: 80px;}
    .u-margin90-top {margin-top: 90px;}
    .u-margin90-bottom {margin-bottom: 90px;}
    .u-margin90-top-bottom {margin-top: 90px; margin-bottom: 90px;}
    .u-margin100-top {margin-top: 100px;}
    .u-margin100-bottom {margin-bottom: 100px;}
    .u-margin100-top-bottom {margin-top: 100px; margin-bottom: 100px;}

    .u-padding10-top {padding-top: 10px;}
    .u-padding10-bottom {padding-bottom: 10px;}
    .u-padding10-top-bottom {padding-top: 10px; padding-bottom: 10px;}
    .u-padding20-top {padding-top: 20px;}
    .u-padding20-bottom {padding-bottom: 20px;}
    .u-padding20-top-bottom {padding-top: 20px; padding-bottom: 20px;}
    .u-padding30-top {padding-top: 30px;}
    .u-padding30-bottom {padding-bottom: 30px;}
    .u-padding30-top-bottom {padding-top: 30px; padding-bottom: 30px;}
    .u-padding40-top {padding-top: 40px;}
    .u-padding40-bottom {padding-bottom: 40px;}
    .u-padding40-top-bottom {padding-top: 40px; padding-bottom: 40px;}
    .u-padding50-top {padding-top: 50px;}
    .u-padding50-bottom {padding-bottom: 50px;}
    .u-padding50-top-bottom {padding-top: 50px; padding-bottom: 50px;}
    .u-padding60-top {padding-top: 60px;}
    .u-padding60-bottom {padding-bottom: 60px;}
    .u-padding60-top-bottom {padding-top: 60px; padding-bottom: 60px;}
    .u-padding70-top {padding-top: 70px;}
    .u-padding70-bottom {padding-bottom: 70px;}
    .u-padding70-top-bottom {padding-top: 70px; padding-bottom: 70px;}
    .u-padding80-top {padding-top: 80px;}
    .u-padding80-bottom {padding-bottom: 80px;}
    .u-padding80-top-bottom {padding-top: 80px; padding-bottom: 80px;}
    .u-padding90-top {padding-top: 90px;}
    .u-padding90-bottom {padding-bottom: 90px;}
    .u-padding90-top-bottom {padding-top: 90px; padding-bottom: 90px;}
    .u-padding100-top {padding-top: 100px;}
    .u-padding100-bottom {padding-bottom: 100px;}
    .u-padding100-top-bottom {padding-top: 100px; padding-bottom: 100px;}

    .u-padding20-all {padding: 20px;}
    .u-padding2025-all {padding: 20px 25px;}
    .u-padding3035-all {padding: 30px 35px;}
    .u-padding40-all {padding: 40px;}
}
@media screen and (max-width: 849px) {
    .u-font-xl {
        font-size: 30px;
        line-height: 40px;
    }

    .u-font-lg {
        font-size: 23px;
        line-height: 31px;
    }

    .u-font-md {
        font-size: 18px;
        line-height: 27px;
    }

    .u-font-sm {
        font-size: 16px;
        line-height: 23px;
    }

    .u-font-xs {
        font-size: 13px;
        line-height: 18px;
    }

    .u-margin10-top {margin-top: 5px;}
    .u-margin10-bottom {margin-bottom: 5px;}
    .u-margin10-top-bottom {margin-top: 5px; margin-bottom: 5px;}
    .u-margin20-top {margin-top: 10px;}
    .u-margin20-bottom {margin-bottom: 10px;}
    .u-margin20-top-bottom {margin-top: 10px; margin-bottom: 10px;}
    .u-margin30-top {margin-top: 15px;}
    .u-margin30-bottom {margin-bottom: 15px;}
    .u-margin30-top-bottom {margin-top: 15px; margin-bottom: 15px;}
    .u-margin40-top {margin-top: 20px;}
    .u-margin40-bottom {margin-bottom: 20px;}
    .u-margin40-top-bottom {margin-top: 20px; margin-bottom: 20px;}
    .u-margin50-top {margin-top: 25px;}
    .u-margin50-bottom {margin-bottom: 25px;}
    .u-margin50-top-bottom {margin-top: 25px; margin-bottom: 25px;}
    .u-margin60-top {margin-top: 30px;}
    .u-margin60-bottom {margin-bottom: 30px;}
    .u-margin60-top-bottom {margin-top: 30px; margin-bottom: 30px;}
    .u-margin70-top {margin-top: 35px;}
    .u-margin70-bottom {margin-bottom: 35px;}
    .u-margin70-top-bottom {margin-top: 35px; margin-bottom: 35px;}
    .u-margin80-top {margin-top: 40px;}
    .u-margin80-bottom {margin-bottom: 40px;}
    .u-margin80-top-bottom {margin-top: 40px; margin-bottom: 40px;}
    .u-margin90-top {margin-top: 45px;}
    .u-margin90-bottom {margin-bottom: 45px;}
    .u-margin90-top-bottom {margin-top: 45px; margin-bottom: 45px;}
    .u-margin100-top {margin-top: 50px;}
    .u-margin100-bottom {margin-bottom: 50px;}
    .u-margin100-top-bottom {margin-top: 50px; margin-bottom: 50px;}

    .u-padding10-top {padding-top: 5px;}
    .u-padding10-bottom {padding-bottom: 5px;}
    .u-padding10-top-bottom {padding-top: 5px; padding-bottom: 5px;}
    .u-padding20-top {padding-top: 10px;}
    .u-padding20-bottom {padding-bottom: 10px;}
    .u-padding20-top-bottom {padding-top: 10px; padding-bottom: 10px;}
    .u-padding30-top {padding-top: 15px;}
    .u-padding30-bottom {padding-bottom: 15px;}
    .u-padding30-top-bottom {padding-top: 15px; padding-bottom: 15px;}
    .u-padding40-top {padding-top: 20px;}
    .u-padding40-bottom {padding-bottom: 20px;}
    .u-padding40-top-bottom {padding-top: 20px; padding-bottom: 20px;}
    .u-padding50-top {padding-top: 25px;}
    .u-padding50-bottom {padding-bottom: 25px;}
    .u-padding50-top-bottom {padding-top: 25px; padding-bottom: 25px;}
    .u-padding60-top {padding-top: 30px;}
    .u-padding60-bottom {padding-bottom: 30px;}
    .u-padding60-top-bottom {padding-top: 30px; padding-bottom: 30px;}
    .u-padding70-top {padding-top: 35px;}
    .u-padding70-bottom {padding-bottom: 35px;}
    .u-padding70-top-bottom {padding-top: 35px; padding-bottom: 35px;}
    .u-padding80-top {padding-top: 40px;}
    .u-padding80-bottom {padding-bottom: 40px;}
    .u-padding80-top-bottom {padding-top: 40px; padding-bottom: 40px;}
    .u-padding90-top {padding-top: 45px;}
    .u-padding90-bottom {padding-bottom: 45px;}
    .u-padding90-top-bottom {padding-top: 45px; padding-bottom: 45px;}
    .u-padding100-top {padding-top: 50px;}
    .u-padding100-bottom {padding-bottom: 50px;}
    .u-padding100-top-bottom {padding-top: 50px; padding-bottom: 50px;}

    .u-padding20-all {padding: 10px;}
    .u-padding2025-all {padding: 10px 15px;}
    .u-padding3035-all {padding: 18px 23px;}
    .u-padding40-all {padding: 20px;}
}

/*기존의 col-ㅁㅁ-nn 방식은 스크린 사이즈가 바뀌어도 좌우 패딩이 너무 넓은 문제가 있어서 덧붙일 class를 하나 만들었음*/
@media (max-width: 991px) {
    .u-col {
        padding-left: 8px;
        padding-right: 8px;
    }
}
@media (max-width: 767px) {
    .u-col {
        padding-left: 3px;
        padding-right: 3px;
    }
}

/* 보더 */
.borderRadius50 {border-radius: 50%;}
.borderRadius3 {border-radius: 3px;}
.borderSolid {border-style: solid;}
.borderW1 {border-width: 1px;}
.borderT {border-top-style: solid}
.borderB {border-bottom-style: solid}
.borderR {border-right-style: solid}
.borderL {border-left-style: solid}

/* 색상 - 폰트, 배경, 보더, 그림자 */
.whiteFont {color: #ffffff;}
.whiteBack {background-color: #ffffff;}
.whiteBorder {border-color: #ffffff;}

.pinkRedFont {color: #f14254;}
.pinkRedBack {background-color: #ff7583;}
.pinkRedBorder {border-color: #ff7583;}

.pinkRedLFont {color: #ff2b6e;}
.pinkRedLBack {background-color: #ff2b6e;}
.pinkRedMFont {color: #f3214f;}
.pinkRedMBack {background-color: #f3214f;}
.pinkRedDFont {color: #d60d46;}

.redFont {color: #e94657;}
.redBack {background-color: #e94657;}
.redBorder {border-color: #e94657;}
.redDFont {color: #e03333;}
.redDBack {background-color: #e03333;}
.redDDBack {background-color: #c50000;}

.grayLLBack {background-color: #f2f2f2;}
.grayLLBorder {border-color: #f2f2f2;}

.grayLBack {background-color: #e2e2e2;}
.grayLBorder {border-color: #e2e2e2;}
.grayLShadow {box-shadow: 0 0 7px #e2e2e2;}

.grayMBorder {border-color: #cccccc;}

.grayDFont {color: #9e9e9e;}
.grayDBorder {border-color: #9e9e9e;}


.blackMFont {color: #575757;}
.blackDFont {color: #212121;}

.black9Font {color: #999;}
.black8Font {color: #888;}
.black5Font {color: #555;}
.black4Font {color: #444;}
.black3Font {color: #333;}
.black2Font {color: #222;}

.tealFont {color: #30c5c7;}

.whiteFont {color: #fff;}

.txt-color-blue{color:#57889c!important}
.txt-color-blueLight{color:#92a2a8!important}
.txt-color-blueDark{color:#4c4f53!important}
.txt-color-green{color:#356e35!important}
.txt-color-greenLight{color:#71843f!important}
.txt-color-greenDark{color:#496949!important}
.txt-color-red{color:#a90329!important}
.txt-color-yellow{color:#b09b5b!important}
.txt-color-orange{color:#b19a6b!important}
.txt-color-orangeDark{color:#a57225!important}
.txt-color-pink{color:#ac5287!important}
.txt-color-pinkDark{color:#a8829f!important}
.txt-color-purple{color:#6e587a!important}
.txt-color-darken{color:#404040!important}
.txt-color-lighten{color:#d5e7ec!important}
.txt-color-white{color:#fff!important}
.txt-color-grayDark{color:#525252!important}
.txt-color-magenta{color:#6e3671!important}
.txt-color-teal{color:#568a89!important}
.txt-color-redLight{color:#a65858!important}

.blackTransShadow {box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);}

.modal-header.redDDBack {background-color: #c50000;}
.modal-centered-transparent .modal-header{background-color: transparent;}

/*이미지 색상을 회색조로 바꿔주는 필터*/
.imgGrayFilter {
    filter:gray; /* IE6-9 */
    -webkit-filter:grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
}

/*종이뜯겨나간 배경*/
.paperVBack {background: #f1f1f1 url(/renewal_ingang/img/paper_bg.png) repeat-x;}

/*기본 반투명 배경*/
.basicTransBackBk20 {background-color: rgba(0, 0, 0, 0.2);}

/*이미지 위에 반투명 배경 깔기*/
.transBackBk50 {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5);}
.transBackBk40 {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4);}
.transBackBk30 {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3);}
.transBackBk25 {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.25);}
.transBackBk15 {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.15);}

.transBackBlack20:before {position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; background-color: rgba(0, 0, 0, 0.2); z-index: 1;}

/*그라데이션*/
.gradi:before {content: ""; display: block; position: absolute; right: 0; bottom: 0; left: 0; height: 80px; background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, transparent), color-stop(30%, rgba(0, 0, 0, .30)), color-stop(100%, rgba(0, 0, 0, .75)));}
.gradiL:before {content: ""; display: block; position: absolute; right: 0; bottom: 0; left: 0; height: 100px; background: -webkit-gradient(linear,0 0,0 100%,color-stop(0,transparent),color-stop(80%,rgba(0,0,0,.10)),color-stop(100%,rgba(0,0,0,.40)));}
.gradiO:before {content: ""; display: block; position: absolute; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.4));}

/*이미지 처리*/
.thumbBackImg {display: block; background-position: center; background-size: cover;}
.thumbBackImg.backgroundSizeContain {background-size: contain;background-repeat: no-repeat;}
.thumbBackImg.hoverBig{transition: -webkit-transform .3s ease-in-out;transition: transform .3s ease-in-out;transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; }
a:hover .thumbBackImg.hoverBig{-webkit-transform: scale(1.1);transform: scale(1.1);}
.thumbBackImg.autoHeight {height:200px;}
@media (max-width:767px) {
    .thumbBackImg.autoHeight {height:150px;}
}

/*기본 모달*/
.magnific-pc {
    position: relative;
    background: #FFF;
    padding: 20px;
    width: auto;
    max-width: 1000px;
    margin: 20px auto;
}

.magnific-mobile {
    position: relative;
    background: #FFF;
    padding: 20px;
    width: auto;
    max-width: 500px;
    margin: 20px auto;
}

/*기본틀*/
.rowWrap {width: 1100px; margin: 0 auto;}
.rowWrap:after {display: table; content: " "; clear: both;}
.viewCont p, .board-view-contents p, .note-editing-area p{margin-bottom:0px;}
.viewCont hr, .board-view-contents hr,.note-editing-area hr{border-bottom:0px;border-top:1px dashed #9c9c9c;}


/*큰 타이틀 두 줄*/
.mainContentsTitleWrap {text-align: center; color: #555; margin-bottom: 46px;}
.mainContentsTitleWrap .contentsTitleBig {font-size: 40px; font-weight: 600; line-height: 40px; letter-spacing: -1px; margin: 22px 0;}
.mainContentsTitleWrap .contentsTitleSub {font-size: 20px; letter-spacing: -.5px;}

/*큰 타이틀 한 줄*/
.basic_set {background-color: #FFFFff; margin: 0 0 10px 0;}
.main_title_wrap {min-height: 45px; padding: 0 15px;}
.main_title_all {color: #222222; letter-spacing: -1px; padding: 14px 19px 12px 0; margin: 0; font-size: 1.125rem; font-weight: 400; line-height: 1.0625rem;}
.main_title {margin-right: 10px; font-size: 1.125rem; font-weight: 700; color: #000000; letter-spacing: -1px;}

/*목록 보는 방법 선택 아이콘*/
.howToView>i {color: #f3214f; border: solid 1px #f3214f; padding: 2px 6px; font-size: 24px;}

/*롤링이 아닌 고정형 틀에 그라데이션이나 단색 hover 사용하는 줌인/줌아웃 틀*/
.fadeGradiBottom:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -moz-linear-gradient(bottom, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0) 80%);
    background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0) 80%);
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0) 80%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
    content: '';
    opacity: .8;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    z-index: 1;
}
.itemArea.fadeGradiBottom:hover:before {opacity: .3;}
.itemArea.fadeGradiBottom:hover img {-webkit-transform: scale(1.1); transform: scale(1.1);}

.fadeTransBackBk15:before {position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; background-color: rgba(0, 0, 0, 0.15); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; z-index: 1;}
.itemArea.fadeTransBackBk15:hover:before {background-color: rgba(0, 0, 0, 0);}
.itemArea.fadeTransBackBk15:hover img {-webkit-transform: scale(1.1); transform: scale(1.1);}

.itemArea {position: relative; cursor: pointer; overflow: hidden; margin-bottom: 8px;}
.itemArea .ttlContainer {width: 100%; height: 100%;}
.itemArea img {
    min-height: 232px;
    max-height: 240px;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    vertical-align: middle;
    width: 100%;
    height: 232px;
}
.itemArea .areaTtl {color: #fff; text-shadow: 0.5px 0.5px 10px #000000; position: absolute; width: 100%; top: 50%; margin-top: -20px; text-align: center; z-index: 1;}
.itemArea .areaTtl .ttl {font-size: 16pt; font-weight: 600;}
.itemArea .areaTtl .sub {font-size: 12pt; font-weight: 100; text-transform: uppercase; line-height: 35px;}
.zoomImageColPadding {padding: 0 4px !important;}

/*리스트 카드형 - 왼쪽에 사진, 오른쪽에 설명*/
.itemWideListWrap {margin: 30px 10px; border: solid 1px #dedede; background-color: #fff; position: relative;}
.itemWideListWrap .bookmarkIcon {position: absolute; top: 20px; right: 36px; font-size: 32px; z-index: 100;}
.itemWideListInnerWrap:after {display: table; content: " "; clear: both;}
.itemWideListInnerWrap .itemCategory {position: absolute; top: 20px; left: 20px; z-index: 1; font-size: 18px; color: #fff; background-color: rgba(0, 0, 0, 0.1); padding: 4px; border-radius: 3px;}
.itemWideListInnerWrap .bigImg {float: left; height: 280px;}
.itemWideListInnerWrap .infoWrap {float: left; padding: 44px 36px; height: 280px;}
.itemWideListInnerWrap .infoWrap .title {font-size: 22px; line-height: 22px; color: #444; font-weight: 500;}
.itemWideListInnerWrap .infoWrap .subTxt {font-size: 16px; margin-top: 12px; height: 45px; line-height: 24px;}
.itemWideListInnerWrap .infoWrap .detailInfo {margin: 14px 0 44px; padding-top: 14px; border-top: solid 1px #d6d6d6;}
.itemWideListInnerWrap .infoWrap .detailInfo span {font-size: 16px; margin-right: 14px;}
.itemWideListInnerWrap .infoWrap .detailInfo i {font-size: 21px; vertical-align: text-top; margin-right: 4px;}
.itemWideListInnerWrap .infoWrap .lowerTxt {font-size: 22px; color: #00b2f1; font-weight: 500;}
.itemWideListInnerWrap .infoWrap .rightTxt {position: absolute; bottom: 23px; right: 34px; font-size: 18px; letter-spacing: -1px;}
.itemWideListInnerWrap .infoWrap .buttonWrap {position: absolute; bottom: 44px; right: 34px;}
.itemWideListInnerWrap .infoWrap .buttonWrap span {margin-left: 6px; padding: 6px 12px; border-radius: 3px; background-color: #f3214f; color: #fff; font-size: 16px;}

/*리스트 카드형 - 위에 큰 사진, 아래 설명*/
.bigImgItemListAllWrap {padding: 14px;}
.bigImgItemListInnerWrap {border: solid 1px #dedede; position: relative; background-color: #fff;}
.bigImgItemListInnerWrap .listArrow {position: absolute; top: 0; z-index: 100; height: 300px; display: none;}
.bigImgItemListInnerWrap .listArrow.chevLeft {left: 10px;}
.bigImgItemListInnerWrap .listArrow.chevRight {right: 28px;}
.bigImgItemListInnerWrap .listArrow .icon {position: absolute; top: 50%; color: #fff; font-size: 60px; margin-top: -30px;}
.bigImgItemListInnerWrap:hover .listArrow {display: block;}
.bigImgItemListInnerWrap .imgTxtWrap>div {z-index: 9;}
.bigImgItemListInnerWrap .bookmarkWrap>div {z-index: 1000;}
.bigImgItemListInnerWrap .itemCategory {position: absolute; top: 16px; left: 13px; font-size: 20px; color: #fff; background-color: rgba(0, 0, 0, 0.2); padding: 4px; border-radius: 3px;}
.bigImgItemListInnerWrap .itemCategory>i:first-child {margin-left: 2px;}
.bigImgItemListInnerWrap .topIcon {position: absolute; right: 12px; top: 8px;}
.bigImgItemListInnerWrap .topIcon>a>i {font-size: 32px;}
.bigImgItemListInnerWrap .topIcon>i {font-size: 32px;}
.bigImgItemListInnerWrap .topIcon .topIconOutline {color: #fff;}
.bigImgItemListInnerWrap .topIcon .topIconBack {color: rgba(0, 0, 0, 0.2);}
.bigImgItemListInnerWrap .itemName {position: absolute; left: 15px; bottom: 15px; font-size: 20px; line-height: 24px; color: #ffffff; margin-right: 10px;}
.bigImgItemListInnerWrap .itemName>i {margin-right: 4px;}
.bigImgItemListInnerWrap .itemImg {height: 300px;}
.bigImgItemListInnerWrap .itemTxtWrap {position: relative; padding: 19px 0; height: 116px;}
.bigImgItemListInnerWrap .itemTxtWrap:after {display: table; content: " "; clear: both;}
.bigImgItemListInnerWrap .itemTxtWrap>div {height: 100%; padding: 0 10px;}
.bigImgItemListInnerWrap .itemTxtWrap:after {clear: both;}
.bigImgItemListInnerWrap .itemTxtWrap .rightWrap {border-left: solid 1px #e2e2e2; text-align: center;}
.bigImgItemListInnerWrap .itemTxtWrap .rightWrap div:first-child {font-size: 26px; line-height: 28px;}
.bigImgItemListInnerWrap .itemTxtWrap .rightWrap div:nth-child(2)>i {font-size: 16px; line-height: 28px;}
.bigImgItemListInnerWrap .itemTxtWrap .rightWrap div:nth-child(3) {font-size: 13px;}
.bigImgItemListInnerWrap .itemTxtWrap .rightWrap div:nth-child(3)>i {font-size: 18px; vertical-align: bottom;}
.bigImgItemListInnerWrap .itemTxtWrap .upperText {font-size: 16px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; overflow: hidden; text-overflow: ellipsis; line-height: 21px; max-height: 42px; letter-spacing: -1px; color: #5d5d5d;}
.bigImgItemListInnerWrap .itemTxtWrap .lowerText {font-size: 16px; position: absolute; bottom: 0; font-weight: 500; color: #00b2f1;}
.bigImgItemListInnerWrap .bookmarkWrap {position: absolute; width: 50px; height: 50px; right: 0;}
.specialBadge {position: absolute; top: 0; right: 24px; text-align: center; font-size: 16px; color: #fff; background-color: rgba(243, 33, 79, 0.8); padding: 8px 12px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);}
.bigImgItemListInnerWrap .specialBadge {z-index: 100; top: -8px;}
.bigImgItemListInnerWrap .specialBadgeShadow:after {border-style: solid; border-color: transparent transparent transparent #f3214f; right: 0; top: -2px; border-width: 10px 15px; content: ''; position: absolute; transform: rotate(25deg);}

.bigImgItemListAllWrap.middleSize {padding: 10px;}
.bigImgItemListAllWrap.middleSize .bigImgItemListInnerWrap {border: none; position: relative;}
.bigImgItemListAllWrap.middleSize .itemName {font-size: 18px;}
.bigImgItemListAllWrap.middleSize .itemImg {height: 200px;}
.bigImgItemListAllWrap.middleSize .itemTxtWrap>div {padding: 0 14px;}

.bigImgItemListAllWrap.smallSize {padding: 0;}
.bigImgItemListAllWrap.smallSize .bigImgItemListInnerWrap {border: none; position: relative; margin: 5px; /*width: 154px;*/ box-shadow: 0 0 4px #d5d5d5;}
.bigImgItemListAllWrap.smallSize .itemName {font-size: 18px;}
.bigImgItemListAllWrap.smallSize .itemImg {height: 100px;}
.bigImgItemListAllWrap.smallSize .itemTxtWrap {padding: 12px 8px 8px; height: 88px; text-align: left;}
.bigImgItemListAllWrap.smallSize .itemTxtWrap>div {padding: 0;}
.bigImgItemListAllWrap.smallSize .topIcon>i {font-size: 26px;}
.bigImgItemListAllWrap.smallSize .itemTxtWrap .upperText {font-size: 13px; line-height: 18px; max-height: 36px;}
.bigImgItemListAllWrap.smallSize .itemTxtWrap .lowerText {font-size: 13px;}

@media (max-width:767px) {
    .bigImgItemListAllWrap.middleSize .itemImg {height: 150px;}
    .bigImgItemListInnerWrap .itemCategory {top: 5px; left: 5px; font-size: 13px;}
}

/*리스트 카드형 - 정보가 하단에서 올라오는 틀*/
.updownItemAllWrap {position: relative; padding: 14px 10px;}
.updownItemAllWrap .updownItemInnerWrap {position: relative; overflow: hidden;}
.updownItemAllWrap .updownItemInnerWrap>a {height: 312px;}
.updownItemAllWrap .itemImg {height: 190px;}
.updownItemAllWrap .itemTxtWrap {position: absolute; top: 190px; padding: 20px 15px; height: 258px; width: 100%; background-color: #fff; -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; text-align: center;}
.updownItemAllWrap .itemTxtWrap .itemName {margin-bottom: 15px; text-align: left; font-weight: 500; font-size: 16px; letter-spacing: -0.5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; overflow: hidden; text-overflow: ellipsis; line-height: 22px; height: 46px; color: #575757;}
.updownItemAllWrap .itemTxtWrap .upperText {font-size: 16px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; overflow: hidden; text-overflow: ellipsis; line-height: 21px; max-height: 58px; letter-spacing: -1px; text-align: left; border-top: dashed 1px #d0d0d0; padding-top: 15px;}
.updownItemAllWrap .itemTxtWrap .lowerText {margin-bottom: 23px; text-align: left; font-size: 16px; font-weight: 500; color: #00b2f1;}
.updownItemAllWrap .updownItemInnerWrap:hover .itemTxtWrap {top: 48px;}
.updownItemAllWrap .itemTxtWrap .itemButton {position: absolute; bottom: 23px; margin-left: -75px; text-align: center; width: 150px; padding: 10px 30px; background-color: #333; color: #fff; font-size: 14px;}
.updownItemAllWrap .bookmarkWrap {position: absolute; width: 50px; height: 50px; right: 0;}
.updownItemAllWrap .bookmarkWrap>div {z-index: 1000;}
.updownItemAllWrap .topIcon {position: absolute; right: 12px; top: 8px;}
.updownItemAllWrap .topIcon>a>i {font-size: 32px;}
.updownItemAllWrap .topIcon>i {font-size: 32px;}
.updownItemAllWrap .topIcon .topIconOutline {color: #fff;}
.updownItemAllWrap .topIcon .topIconBack {color: rgba(0, 0, 0, 0.2);}

/*슬라이드 양옆 화살표*/
.slideChevronRectangle {padding: 24px 10px; position: absolute; top: 50%; margin-top: -40px; background-color: rgba(0, 0, 0, 0.2); z-index: 1; cursor: pointer;}
.slideChevronRectangle.rectangleLeft {left: -40px;}
.slideChevronRectangle.rectangleRight {right: -40px;}
.slideChevronRectangle>i {font-size: 30px; color: #ffffff;}

/*후기*/
.reviewWrap {position: relative;}
.reviewWrap .reviewChevronWrap {position: absolute; top: 40px;}
.reviewWrap .reviewChevronWrap .reviewChevron {width:50px; height: 132px; display: block;}
.reviewWrap .review {text-align: center; padding: 12px 65px; color: #444;}
.reviewWrap .review .reviewStars {color: #ff5e71; font-size: 35px;}
.reviewWrap .review .reviewMent {margin: 33px 0; letter-spacing: -1px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; overflow: hidden; text-overflow: ellipsis; font-size: 20px; line-height: 33px; max-height: 99px;}

.itemInfoReviewWrap li {padding: 0 0 24px; position: relative; margin-top: -1px; font-size: 16px;}
.itemInfoReviewWrap li .userPicture {float: left; border-radius: 50%; width: 50px; height: 50px; border: solid 1px #f2f2f2;}
.itemInfoReviewWrap li .userTextWrap {border-bottom: solid 1px #eee; padding-bottom: 20px; margin-left: 76px;}
.itemInfoReviewWrap .userTextWrap span:first-child {font-weight: 600; margin-right: 8px; color: #000;}
.itemInfoReviewWrap .userTextWrap span:nth-child(2) {font-size: 16px; letter-spacing: -1px; color: #f3214f;}
.itemInfoReviewWrap .userTextWrap span:nth-child(3) {font-size: 14px; color: #888; float: right;}
.itemInfoReviewWrap .userTextWrap span a {float: right; padding: 0 4px; border: solid 1px #ddd; text-decoration: none; font-size: 12px; margin-right: 8px;}
.itemInfoReviewWrap .userTextWrap .userText {margin-top: 14px; color: #444;}
.itemInfoReviewWrap .userTextWrap .userReviewPhoto {margin-top: 10px;}
.itemInfoReviewWrap .userTextWrap .userReviewPhoto .open-popup {float: left; margin: 3px 3px 0 0; border: solid 1px #f2f2f2; position: relative;}
.itemInfoReviewWrap .userTextWrap .userReviewPhoto .imgThumbnailPhoto {width: 100px; height: 100px;}

/*검색바*/
.itemType {float: left; margin-right: 10px; padding: 10px 15px; border: solid 1px #dadada; border-radius: 3px; font-size: 17px;}
.itemType.selectedType {background-color: #f3214f; border: solid 1px #f3214f; color: #fff;}
.mapViewButton {color: #f3214f; border-color: #f3214f;}
.mapViewButton:hover {background-color: #f3214f; color: #fff;}
.searchKeywordVertical>div>a {margin-right: 8px;}
.searchKeywordVertical>div>i {color: #c3c3c3;}
.searchKeyword>span>a {margin-right: 8px;}
.searchKeyword>a {margin-right: 8px;}
.searchKeyword>i {margin-right: 18px; color: #c3c3c3;}
.cookie_keyword>span>a {margin-right: 5px;}
.cookie_keyword>span>i {margin-right: 10px;}

/*좌측메뉴 고객센터 및 계좌정보*/
.customerCenterLeft .title {color: #555; font-weight: 600; margin: 4px 0 21px; letter-spacing: -1px; line-height: 22px;}
.customerCenterLeft .csTime {float: left; width: 60px;}
.customerCenterLeft dt {margin-top: 7px; font-size: 13px;}
.customerCenterLeft dd {margin-top: 2px; font-size: 16px; color: #ff6632; letter-spacing: -0.2px; font-weight: 700;}

/*큰 썸네일 width 100% 가로형 리스트*/
.bigThumbListTitle {font-size: 32px; font-weight: normal; color: #000; margin-top: 40px;margin-left:10px;}
.bigThumbListInfo {margin: 20px 0; font-size: 14px; line-height: 22px;}
.bigThumbListWrap {width: 100%; overflow: hidden; margin-bottom: 10px; font-family: '나눔고딕',NanumGothicBold,'맑은고딕','Malgun Gothic','돋움',Dotum,'굴림',Gulim,sans-serif;}
.bigThumbListWrap a:hover {text-decoration: none;}
.bigThumbList {display: table; width: 100%;}
.bigThumbList>div {display: table-cell; text-align: center; vertical-align: middle;}
.bigThumbListCategory {height: 36px; margin-bottom: 10px; background: #f5f5f5; border: solid 1px #e1e1e1; text-align: center; font-weight: 600;}
.bigThumbListBox {font-size: 13px; margin-bottom: 10px; border: solid 1px #dadada; color: #000;}
.bigThumbListBox .bigThumbListPhoto {border: solid 1px #efefef;}
.bigThumbListBox .specialBadge {position: absolute; top: -6px; left: 8px; right: 63px; text-align: center; font-size: 12px; color: #fff; background-color: rgba(243, 33, 79, 1); padding: 6px 9px; box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.3);}
.bigThumbListBox .specialBadgeShadow:after {border-style: solid; border-color: transparent transparent transparent #f3214f; left: 5px; top: 0; border-width: 3px 15px; content: ''; position: absolute; transform: rotate(25deg);}
.bigThumbListBox .bigThumbListName {font-size: 15px;}
.bigThumbListBox .bigThumbListName i {font-size: 22px; vertical-align: middle; margin-left: 3px;}
.bigThumbListBox .bigThumbListButton {font-size: 11px; font-weight: inherit; padding: 6px; color: #fff; border-radius: 3px; text-align: center; line-height: 11px; display: inline-block;}
.bigThumbListButton.rightButton {display: block; width: 64px; margin: 0 auto 3px;}
.bigThumbListButtonColorOn {background-color: #00bfff;}
.bigThumbListButtonColorOff {background-color: #4f9ad8;}
.bigThumbListBox .scrapButton {position: absolute; top: -1px; right: -141px; background-color: rgba(255, 98, 23, 0.9); text-align: center; -webkit-transition: all .5s ease; transition: all .5s ease; display: table; z-index: 100;}
.bigThumbListBox:hover .scrapButton {animation-duration: .5s; right: 0;}


.lavelIconGroup {position: absolute; top: -6px; width: 100%; padding-right: 5px;}
.lavelIconGroup div.label{padding: .3em .6em .2em;background-color: #F44336;height: 35px; border-radius: 0 0 4px 4px; color:#fff; font-size: 0.7rem; font-weight:600; z-index: 4; float: right; margin-right: 6px; position: relative;}
.lavelIconGroup div.label.drink{background-color: #FF9800;}
.lavelIconGroup div.label span{display:block;text-align:center;line-height:44px}
.lavelIconGroup div.label span.tx{line-height:14px;padding-top:8px}
.lavelIconGroup .specialBadgeShadow:after {border-style: solid; border-color: transparent transparent transparent #f3214f; right: -4px; top: 2px; border-width: 4px 3.5px; content: ''; position: absolute; transform: rotate(135deg);}
.lavelIconGroup .specialBadgeShadow.Drink:after {border-color: transparent transparent transparent #f3214f;}
.lavelIconGroup .specialBadgeShadow.verified:after {border-color: transparent transparent transparent #ad2643;}


.searchValueGroup span {border-radius: 18px; position: relative; padding: 8px 12px 6px 12px; margin-right: 5px; color: #fff; background-color: #f19206; font-size: 12px; display: inline-block; margin-top: 5px;}
/*매그니픽 팝업으로 이미지 띄울 경우, 최대 사이즈 제한*/
img.mfp-img {
    width: auto;
    max-width: 1000px;
}

/*페이지 공유 버튼 후버 효과*/
.zmdi.zmdi-share.pinkRedLFont:hover{color:#d63568}


/* 모바일 하단 퀵 메뉴 */
.bottomQucickMenu{padding-top: 10px;padding-bottom: 10px;position:fixed;right:0;bottom:0;left:0;display:-webkit-box;display:-webkit-flex;display:flex;z-index:600;background-color:#fff;border-top:1px solid rgba(230,232,234,.5)}
.bottomQucickMenu::before{content:"";display:block;position:absolute;top:-6px;right:0;left:0;height:6px;background-image:-webkit-gradient(linear,left top,left bottom,from(transparent),to(rgba(0,0,0,.05)));background-image:-webkit-linear-gradient(top,transparent,rgba(0,0,0,.05));background-image:linear-gradient(to bottom,transparent,rgba(0,0,0,.05))}
.bottomQucickMenu i{font-size:18px;padding-bottom:4px;}
.bottomQucickMenu .ms_menu_item .menu_txt{margin-top:2px;line-height:11px;font-size:11px;font-weight:400;letter-spacing:-.1px;color:#2f3036}
.bottomQucickMenu .col{padding-left:0px;padding-right:0px;}
.bottomQucickMenu .active{font-weight:700;}


/*안내사항*/
.noticeBoxOutline {padding: 25px 30px; border: 1px #eeeeee solid; background-color: #f8f8f8; margin-bottom: 14px; margin-left:auto; margin-right:auto; border-radius: 12px 0 12px 0;}
.noticeBoxOutline .noticeTitle {font-size: 1.1875rem; margin-bottom: 16px; color: #555; font-weight: 500;}
.noticeBoxOutline .titleIcon {margin-right: 6px; vertical-align: sub; font-size: 1.5625rem;}
.noticeBoxOutline .noticeText {line-height: 22px; font-size: 13px; color: #222;}
.noticeBoxOutline .noticeText div {position: relative; padding-left: 0.75rem;}
.noticeBoxOutline .noticeText .textIcon {position: absolute; left: 0.125rem; top: .25rem;}

/*BS4적용시 스크롤 바를 내리면 강의편집 안에서 사용된 섬머노트의 width가 줄어드는 문제를 해결하기 위한 코드*/
.note-editor.note-frame.panel{width: 100%;}

@media (max-width:576px) {
    .hidden-xs{display:none!important}
}
@media (min-width:577px) and (max-width:767px) {
    .hidden-sm{display:none!important}
}
@media (min-width:768px) and (max-width:991px) {
    .hidden-md{display:none!important}
}
@media (min-width:992px) and (max-width:1199px) {
    .hidden-lg{display:none!important}
}
@media (min-width:1200px) {
    .hidden-xl{display:none!important}
}

.form-actions {display: block;padding: 13px 14px 15px;border-top: 1px solid rgba(0,0,0,.1);background: rgba(249,249,249,.9);text-align: right;margin: 25px -13px -13px;}
.no-margin {margin: 0!important;}
.no-padding {padding: 0!important;}
.padding-10 {padding: 10px!important;}

@media (min-width: 768px){
    .form-horizontal .control-label {text-align: right;margin-bottom: 0;padding-top: 7px;}
}

.smart-form footer {display: block;padding: 7px 14px 15px;border-top: 1px solid rgba(0,0,0,.1);background: rgba(248,248,248,.9);text-align: right;}

.btn-bs3{display:inline-block;margin-bottom:0;font-weight:400;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid transparent;white-space:nowrap;padding:6px 12px;font-size:13px;line-height:1.42857143;border-radius:2px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.btn-bs3.active.focus,.btn-bs3.active:focus,.btn-bs3.focus,.btn-bs3:active.focus,.btn-bs3:active:focus,.btn-bs3:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}
.btn-bs3.focus,.btn-bs3:focus,.btn-bs3:hover{color:#333;text-decoration:none}
.btn-bs3.active,.btn-bs3:active{outline:0;background-image:none;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}
.btn-bs3.disabled,.btn-bs3[disabled],fieldset[disabled] .btn-bs3{cursor:not-allowed;opacity:.65;filter:alpha(opacity=65);-webkit-box-shadow:none;box-shadow:none}
a.btn-bs3.disabled,fieldset[disabled] a.btn-bs3{pointer-events:none}


.btn-bs3-default{color:#333;background-color:#fff;border-color:#ccc}
a:not([href]):not([tabindex]).btn-bs3-default{color:#333}
.btn-bs3-default.focus,.btn-bs3-default:focus{color:#333;background-color:#e6e6e6;border-color:#8c8c8c}
.btn-bs3-default.active,.btn-bs3-default:active,.btn-bs3-default:hover,.open>.dropdown-toggle.btn-bs3-default{color:#333;background-color:#e6e6e6;border-color:#adadad}
.btn-bs3-default.active.focus,.btn-bs3-default.active:focus,.btn-bs3-default.active:hover,.btn-bs3-default:active.focus,.btn-bs3-default:active:focus,.btn-bs3-default:active:hover,.open>.dropdown-toggle.btn-bs3-default.focus,.open>.dropdown-toggle.btn-bs3-default:focus,.open>.dropdown-toggle.btn-bs3-default:hover{color:#333;background-color:#d4d4d4;border-color:#8c8c8c}
.btn-bs3-default.active,.btn-bs3-default:active,.open>.dropdown-toggle.btn-bs3-default{background-image:none}
.btn-bs3-default.disabled.focus,.btn-bs3-default.disabled:focus,.btn-bs3-default.disabled:hover,.btn-bs3-default[disabled].focus,.btn-bs3-default[disabled]:focus,.btn-bs3-default[disabled]:hover,fieldset[disabled] .btn-bs3-default.focus,fieldset[disabled] .btn-bs3-default:focus,fieldset[disabled] .btn-bs3-default:hover{background-color:#fff;border-color:#ccc}
.btn-bs3-default .badge{color:#fff;background-color:#333}
.btn-bs3-primary{color:#fff;background-color:#3276b1;border-color:#2c699d}
a:not([href]):not([tabindex]).btn-bs3-primary{color:#fff;}
.btn-bs3-primary.focus,.btn-bs3-primary:focus{color:#fff;background-color:#275b89;border-color:#10263a}
.btn-bs3-primary.active,.btn-bs3-primary:active,.btn-bs3-primary:hover,.open>.dropdown-toggle.btn-bs3-primary{color:#fff;background-color:#275b89;border-color:#1f496d}
.btn-bs3-primary.active.focus,.btn-bs3-primary.active:focus,.btn-bs3-primary.active:hover,.btn-bs3-primary:active.focus,.btn-bs3-primary:active:focus,.btn-bs3-primary:active:hover,.open>.dropdown-toggle.btn-bs3-primary.focus,.open>.dropdown-toggle.btn-bs3-primary:focus,.open>.dropdown-toggle.btn-bs3-primary:hover{color:#fff;background-color:#1f496d;border-color:#10263a}
.btn-bs3-primary.active,.btn-bs3-primary:active,.open>.dropdown-toggle.btn-bs3-primary{background-image:none}
.btn-bs3-primary.disabled.focus,.btn-bs3-primary.disabled:focus,.btn-bs3-primary.disabled:hover,.btn-bs3-primary[disabled].focus,.btn-bs3-primary[disabled]:focus,.btn-bs3-primary[disabled]:hover,fieldset[disabled] .btn-bs3-primary.focus,fieldset[disabled] .btn-bs3-primary:focus,fieldset[disabled] .btn-bs3-primary:hover{background-color:#3276b1;border-color:#2c699d}
.btn-bs3-primary .badge{color:#3276b1;background-color:#fff}
.btn-bs3-success{color:#fff;background-color:#739e73;border-color:#659265}
a:not([href]):not([tabindex]).btn-bs3-success{color:#fff;}
.btn-bs3-success.focus,.btn-bs3-success:focus{color:#fff;background-color:#5b835b;border-color:#314731}
.btn-bs3-success.active,.btn-bs3-success:active,.btn-bs3-success:hover,.open>.dropdown-toggle.btn-bs3-success{color:#fff;background-color:#5b835b;border-color:#4c6e4c}
.btn-bs3-success.active.focus,.btn-bs3-success.active:focus,.btn-bs3-success.active:hover,.btn-bs3-success:active.focus,.btn-bs3-success:active:focus,.btn-bs3-success:active:hover,.open>.dropdown-toggle.btn-bs3-success.focus,.open>.dropdown-toggle.btn-bs3-success:focus,.open>.dropdown-toggle.btn-bs3-success:hover{color:#fff;background-color:#4c6e4c;border-color:#314731}
.btn-bs3-success.active,.btn-bs3-success:active,.open>.dropdown-toggle.btn-bs3-success{background-image:none}
.btn-bs3-success.disabled.focus,.btn-bs3-success.disabled:focus,.btn-bs3-success.disabled:hover,.btn-bs3-success[disabled].focus,.btn-bs3-success[disabled]:focus,.btn-bs3-success[disabled]:hover,fieldset[disabled] .btn-bs3-success.focus,fieldset[disabled] .btn-bs3-success:focus,fieldset[disabled] .btn-bs3-success:hover{background-color:#739e73;border-color:#659265}
.btn-bs3-success .badge{color:#739e73;background-color:#fff}
.btn-bs3-info{color:#fff;background-color:#57889c;border-color:#4e7a8c}
a:not([href]):not([tabindex]).btn-bs3-info{color:#fff}
.btn-bs3-info.focus,.btn-bs3-info:focus{color:#fff;background-color:#456b7b;border-color:#20323a}
.btn-bs3-info.active,.btn-bs3-info:active,.btn-bs3-info:hover,.open>.dropdown-toggle.btn-bs3-info{color:#fff;background-color:#456b7b;border-color:#385764}
.btn-bs3-info.active.focus,.btn-bs3-info.active:focus,.btn-bs3-info.active:hover,.btn-bs3-info:active.focus,.btn-bs3-info:active:focus,.btn-bs3-info:active:hover,.open>.dropdown-toggle.btn-bs3-info.focus,.open>.dropdown-toggle.btn-bs3-info:focus,.open>.dropdown-toggle.btn-bs3-info:hover{color:#fff;background-color:#385764;border-color:#20323a}
.btn-bs3-info.active,.btn-bs3-info:active,.open>.dropdown-toggle.btn-bs3-info{background-image:none}
.btn-bs3-info.disabled.focus,.btn-bs3-info.disabled:focus,.btn-bs3-info.disabled:hover,.btn-bs3-info[disabled].focus,.btn-bs3-info[disabled]:focus,.btn-bs3-info[disabled]:hover,fieldset[disabled] .btn-bs3-info.focus,fieldset[disabled] .btn-bs3-info:focus,fieldset[disabled] .btn-bs3-info:hover{background-color:#57889c;border-color:#4e7a8c}
.btn-bs3-info .badge{color:#57889c;background-color:#fff}
.btn-bs3-warning{color:#fff;background-color:#c79121;border-color:#b1811d}
a:not([href]):not([tabindex]).btn-bs3-warning{color:#fff;}
.btn-bs3-warning.focus,.btn-bs3-warning:focus{color:#fff;background-color:#9b711a;border-color:#44310b}
.btn-bs3-warning.active,.btn-bs3-warning:active,.btn-bs3-warning:hover,.open>.dropdown-toggle.btn-bs3-warning{color:#fff;background-color:#9b711a;border-color:#7d5b15}
.btn-bs3-warning.active.focus,.btn-bs3-warning.active:focus,.btn-bs3-warning.active:hover,.btn-bs3-warning:active.focus,.btn-bs3-warning:active:focus,.btn-bs3-warning:active:hover,.open>.dropdown-toggle.btn-bs3-warning.focus,.open>.dropdown-toggle.btn-bs3-warning:focus,.open>.dropdown-toggle.btn-bs3-warning:hover{color:#fff;background-color:#7d5b15;border-color:#44310b}
.btn-bs3-warning.active,.btn-bs3-warning:active,.open>.dropdown-toggle.btn-bs3-warning{background-image:none}
.btn-bs3-warning.disabled.focus,.btn-bs3-warning.disabled:focus,.btn-bs3-warning.disabled:hover,.btn-bs3-warning[disabled].focus,.btn-bs3-warning[disabled]:focus,.btn-bs3-warning[disabled]:hover,fieldset[disabled] .btn-bs3-warning.focus,fieldset[disabled] .btn-bs3-warning:focus,fieldset[disabled] .btn-bs3-warning:hover{background-color:#c79121;border-color:#b1811d}
.btn-bs3-warning .badge{color:#c79121;background-color:#fff}
.btn-bs3-danger{color:#fff;background-color:#a90329;border-color:#900323}
a:not([href]):not([tabindex]).btn-bs3-danger{color:#fff;}
.btn-bs3-danger.focus,.btn-bs3-danger:focus{color:#fff;background-color:#77021d;border-color:#130005}
.btn-bs3-danger.active,.btn-bs3-danger:active,.btn-bs3-danger:hover,.open>.dropdown-toggle.btn-bs3-danger{color:#fff;background-color:#77021d;border-color:#540114}
.btn-bs3-danger.active.focus,.btn-bs3-danger.active:focus,.btn-bs3-danger.active:hover,.btn-bs3-danger:active.focus,.btn-bs3-danger:active:focus,.btn-bs3-danger:active:hover,.open>.dropdown-toggle.btn-bs3-danger.focus,.open>.dropdown-toggle.btn-bs3-danger:focus,.open>.dropdown-toggle.btn-bs3-danger:hover{color:#fff;background-color:#540114;border-color:#130005}
.btn-bs3-danger.active,.btn-bs3-danger:active,.open>.dropdown-toggle.btn-bs3-danger{background-image:none}
.btn-bs3-danger.disabled.focus,.btn-bs3-danger.disabled:focus,.btn-bs3-danger.disabled:hover,.btn-bs3-danger[disabled].focus,.btn-bs3-danger[disabled]:focus,.btn-bs3-danger[disabled]:hover,fieldset[disabled] .btn-bs3-danger.focus,fieldset[disabled] .btn-bs3-danger:focus,fieldset[disabled] .btn-bs3-danger:hover{background-color:#a90329;border-color:#900323}
.btn-bs3-danger .badge{color:#a90329;background-color:#fff}

.btn-bs3-xs{padding:1px 5px}
.btn-bs3-sm{padding:6px 10px 5px}
.btn-bs3-lg{padding:10px 16px}

.btn-circle{width:30px;height:30px;text-align:center;padding:6px 0;font-size:12px;line-height:18px;border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%}
.btn-circle.btn-bs3-lg{width:50px;height:50px;padding:10px 15px;font-size:18px;line-height:30px;border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%}
.btn-circle.btn-bs3-xl{width:70px;height:70px;padding:10px 15px;font-size:24px;line-height:50px;border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%}

/*.btn-bs3,a:link,button{-webkit-tap-highlight-color:rgba(169,3,41,.5)}*/
.btn-bs3-default.disabled{color:#999}
.btn-bs3:active{position:relative;top:1px;left:1px}

.modal-body .row.width100{width:auto;width: initial;}




@media only screen and (max-width: 992px){
    body {
        overflow-x: overlay;
    }
}

a > p{margin-bottom: 0;}

/** lazyload 블러처리 **/
.blur-up {-webkit-filter: blur(5px);filter: blur(5px);transition: filter 400ms, -webkit-filter 400ms;}
.blur-up.lazyloaded {-webkit-filter: blur(0);filter: blur(0);}

/*자주 쓰는 위치 설정

-webkit-transform: translateY(50%);
transform: translateY(50%);
*/

/*자주 쓰는 트랜지션 설정 - 설정값이 변하는 것에는 전부 적용됨

-webkit-transition: all .5s ease;
transition: all .5s ease;
*/

.modal-dialog.modal-confirm-dialog{width:100%;}
.modal-dialog.modal-confirm-dialog .modal-header {
    background-color: rgba(255, 255, 255, 0);
}



/** 관리자 관련 페이지 디자인 css **/
.admin_right_default_button{position:absolute;}
@media only screen and (max-width: 850px){
    .right_default_button{position: initial;margin-bottom:20px;}
}
.jarviswidget{margin:0 0 30px;position:relative;-moz-border-radius:0;-khtml-border-radius:0;-webkit-border-radius:0;border-radius:0;padding:0}
.jarviswidget>header{border:1px solid #C2C2C2;height:34px;padding:0;line-height:40px}
.jarviswidget>header>:first-child.widget-icon{margin-left:0}
.jarviswidget>header>.widget-icon{display:block;width:30px;height:32px;position:relative;float:left;font-size:111%;line-height:32px;text-align:center;margin-right:-10px}
.jarviswidget-color-darken>header{border-color:#383838!important;background:#404040!important;color:#fff}
.jarviswidget-color-blueDark>header{background:#353D4B!important;border-color:#353D4B!important}
.jarviswidget-color-blueDark>header>h2{color:#fff;}
.adminPage-body{margin: -13px -13px 0;}



/** 플레이어js용 CSS **/
.vjs-menu-button-popup .vjs-menu .vjs-menu-content {max-height: 20em!important;}
.vjs-playback-rate .vjs-menu {width: 6em!important;}

/** 로딩 UI **/
.doyac-loading{position:absolute;width:100%;height:100%;left:0;top:0;z-index:100;transition:all 1s}
.doyac-loading > span{position:absolute;top:50%;left:50%;width:20px;height:20px;border-radius:100%;margin:-10px 0 0}
.doyac-loading > span.left{background:olive;transform:translateX(-30px);animation:circleLeft 1s cubic-bezier(.645,.045,.355,1) infinite}
.doyac-loading > span.right{background:#dc143c;transform:translateX(30px);animation:circleRight 1s cubic-bezier(.645,.045,.355,1) infinite}
.doyac-loading.end{opacity:0;z-index:-1}




.filter-area{display:block;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding-top:80px;padding-bottom:150px}
.filter-area:after,.filter-area:before{clear:both;content:"";display:block}
.filter-area .conditions{float:left;width:200px;margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:none;-moz-osx-font-smoothing:grayscale;letter-spacing:-.03em;box-sizing:inherit}
.filter-area .conditions>*{margin-bottom:5px}
.modal-content.filter-area .conditions{width:100%;display:block;}
.filter-area .filter-title{position:relative;padding:24px 0 26px;font-size:16px;border-bottom:1px solid #999}
.filter-area .filter-title p{font-weight:700;text-transform:uppercase}
.filter-area .gotham{font-family:Gotham A,Gotham B,sans-serif!important}
.filter-area .filter-items>div{padding:30px 0 25px}
.filter-area .filter-items>div+div{border-top:1px dotted #ababab}
.filter-area .price{font-size:16px}
.filter-area .filter-items>div+div .filter-name{display:block}
.filter-area .filter-items>div .filter-name{display:none;margin-bottom:15px;font-size:12px;font-weight:700;text-transform:uppercase}
.filter-area .filter-items .days .selected,.filter-items .price .selected{font-size:12px;margin-bottom:6px}
.filter-area .el-slider__button-wrapper .el-tooltip,.el-slider__button-wrapper:after{vertical-align:middle;display:inline-block}
.filter-area .el-menu{border-right:0;border-bottom:1px solid #999;list-style:none;position:relative;margin:0;padding-left:0}
.filter-area .el-menu-item{padding-right:0!important}
.filter-area .el-menu-item:first-child{border-top:none}
.filter-area .el-menu-item{padding-left:0!important}
.filter-area .el-menu-item,.el-submenu__title{height:auto;padding:0;font-weight:700;color:#666;border-top:1px solid #e5e5e5;height:56px;line-height:56px;position:relative;-webkit-box-sizing:border-box;white-space:nowrap;list-style:none}
.filter-area .el-menu-item,.el-submenu{border-top:none}
.filter-area .el-menu-item{font-size:14px;color:#303133;padding:0 20px;cursor:pointer;-webkit-transition:border-color .3s,background-color .3s,color .3s;transition:border-color .3s,background-color .3s,color .3s;-webkit-box-sizing:border-box;box-sizing:border-box}
.filter-area .el-submenu.is-opened>.el-submenu__title .submenu_icon_array{color:#f06c5e;-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.filter-area .el-submenu .submenu_icon_array{right:0;font-size:11px;color:#ccc;-webkit-transform-origin:50% 50%;transform-origin:50% 50%}
.filter-area .submenu_icon_array{position:absolute;top:50%;right:20px;margin-top:-7px;-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;font-size:12px}
.filter-area .el-menu-item>a{display:block;padding:14px 0;z-index:10;white-space:normal;line-height:1.4}
.filter-area .el-submenu{list-style:none;margin:0;padding-left:0}
.filter-area .el-submenu.is-active .el-submenu__title{border-bottom-color:#409eff}
.filter-area .el-submenu.is-opened>.el-submenu__title{color:#f06c5e}
.filter-area .el-submenu.is-opened .el-submenu__title{border-top-color:#e5e5e5}
.filter-area .el-submenu__title:focus{outline:none}
.filter-area .el-submenu__title{-webkit-transition:none;transition:none;white-space:normal;font-size:14px;color:#303133;cursor:pointer;-webkit-transition:border-color .3s,background-color .3s,color .3s;transition:border-color .3s,background-color .3s,color .3s;-webkit-box-sizing:border-box;box-sizing:border-box}
.filter-area .el-submenu .el-menu{border:none}
.filter-area .el-menu--inline{border-top:1px solid #e5e5e5}
.filter-area .el-submenu .el-menu-item--theme-grey:first-child{padding-top:15px}
.filter-area .el-submenu .el-menu-item--theme-grey{padding-right:0;background-color:#f7f7f7}
.filter-area .el-submenu .el-menu-item--theme-grey,.el-submenu .el-submenu--theme-grey .el-menu .el-menu-item{min-width:auto;height:auto;border-top:none;font-weight:400;line-height:1.4}
.filter-area .el-submenu .el-menu-item--theme-grey a,.el-submenu .el-submenu--theme-grey .el-menu .el-menu-item a{position:relative;display:block;padding:5px 20px 5px 33px}
.el-submenu .el-submenu--theme-grey .el-menu .el-menu-item a.router-link-active{font-weight:700;}
.filter-area .el-menu-item *{vertical-align:middle}
.filter-area .el-submenu .el-menu-item--theme-grey a:after,.el-submenu .el-submenu--theme-grey .el-menu .el-menu-item a:after{position:absolute;top:13px;left:20px;content:"";width:3px;height:3px;border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%;background:#ccc}
.filter-area .el-menu-item.is-active,.el-menu-item.is-opened{color:#f06c5e}
.filter-area .el-menu:after{clear:both}
.filter-area .el-menu:after,.el-menu:before{display:table;content:""}
.filter-area .product-list{width:850px;float:right;}
.filter-area .app-list-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;height:50px;margin-bottom:30px;padding:35px 0 34px;border-bottom:1px solid #999}
.filter-area:after,.filter-area:before{clear:both;content:"";display:block}
.filter-area .app-list-header .title{font-size:20px;-webkit-box-flex:1;-ms-flex:1;flex:1;color:#666}
.filter-area .app-list-header .title .depth1{color:#333;padding-left:5px;}
.filter-area .app-list-header .title .depth2{position:relative;margin-left:15px;padding-left:14px}
.filter-area .app-list-header .title>span{display:inline-block;vertical-align:top}
.filter-area .toggle-list-type{margin-left:10px;border:1px solid #ccc;border-radius:7px;color:#333;height:35px;-webkit-box-sizing:border-box;box-sizing:border-box}
.filter-area .toggle-list-type>button:first-child{border-right:1px solid #ccc}
.filter-area .toggle-list-type>button{display:inline-block;width:44px;height:33px;background-size:14px;vertical-align:middle;cursor:pointer;text-align:center}
.filter-area .toggle-list-type .icon{display:inline-block;color:#ccc;font-size:14px;margin-top:4px}
.filter-area .icon{font-style:normal;font-weight:400}
.filter-area .icon:hover{font-style:normal;font-weight:400;color:#f06c5e}
.filter-area .product-list-wrap{-webkit-transition:opacity .3s;transition:opacity .3s}
.filter-area .product-list-wrap .product-list{margin:0 auto;-webkit-box-sizing:border-box;box-sizing:border-box}
.filter-area .list-layer{position:relative;width:100%}
.filter-area .product-card{position:relative;height:auto;border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:12px;border-bottom-left-radius:12px;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-shadow:0 2px 24px rgba(0,0,0,.1);box-shadow:0 2px 24px rgba(0,0,0,.1);opacity:0}
.filter-area .product-card{opacity:1!important;-webkit-transform:translate(0);transform:translate(0);overflow: hidden;}
.filter-area .product-list.column-1 .product-card{height:207px;}
.filter-area .product-list:not(.column-1) .product-card .card-layer{position:relative;display:block;cursor:pointer}
.filter-area .product-list.column-1 .card-layer{
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.product-card .sorting-badge {position: absolute;top: 21px;left: -8px;height: 38px;background-repeat: no-repeat;background-size: cover;z-index: 4;display: inline-block;}
.product-card .sorting-badge:nth-child(2) {position: absolute;top: 53px;left: -8px;height: 38px;background-repeat: no-repeat;background-size: cover;z-index: 4;display: inline-block;}
.product-card .sorting-badge:nth-child(3) {position: absolute;top: 85px;left: -8px;height: 38px;background-repeat: no-repeat;background-size: cover;z-index: 4;display: inline-block;}
.product-card .sorting-badge:nth-child(4) {position: absolute;top: 117px;left: -8px;height: 38px;background-repeat: no-repeat;background-size: cover;z-index: 4;display: inline-block;}
.sorting-badge:before {top: 0;right: 1px;border-radius: 0 5px 0 0;-webkit-transform: skewX(-18deg);transform: skewX(-18deg);}
.sorting-badge:after, .sorting-badge:before {content: "";position: absolute;width: 10px;height: 16px;background: #f06c5e;-webkit-transform-origin: 0 100%;transform-origin: 0 100%;}
.sorting-badge .inner {z-index: 2;position: relative;display: inline-block;min-width: 41px;height: 28px;padding: 0 9px 0 12px;-webkit-box-sizing: border-box;box-sizing: border-box;border-radius: 5px 0 0 0;background: #f06c5e;color: #fff;line-height: 28px;font-size: 12px;}
.sorting-badge .inner:after, .sorting-badge .inner:before {content: "";position: absolute;left: 0;width: 8px;border-radius: 4px 0 0 5px;}
.sorting-badge .inner:before {top: 0;height: 38px;background: #f06c5e;}
.sorting-badge .inner:after {top: 28px;height: 10px;background: #a61e0f;}
.sorting-badge:after {top: 12px;right: -4px;border-radius: 0 0 5px 0;-webkit-transform: skewX(18deg);transform: skewX(18deg);}
.filter-area .image-area,.text-area{position:relative;width:100%;overflow:hidden}
.filter-area .product-list:not(.column-1) .image-area{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0}
.filter-area .product-list.column-1 .image-area{
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 277px;
    border-top-right-radius: 0;
    border-bottom-left-radius: 12px;
}
.filter-area .product-card .card-layer .product-writer{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out}
.filter-area .product-card .card-layer .image-gradation,.product-card .card-layer .product-writer{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out}
.filter-area .product-writer{display:block;opacity:0;color:#fff;width:100%;padding:0 30px;font-size:12px;text-align:center}
.filter-area .product-list .image-box{position:relative;width:100%;height:207px;background-color:#bfc1c4;border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-transform:rotate(0);transform:rotate(0);overflow:hidden}
.filter-area .product-list.column-1 .card-layer .image-box{
    border-top-left-radius: 12px;
    border-top-right-radius: 0 12px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 12px;
}
.filter-area .text-area{padding:19px 25px 21px;border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:12px;border-bottom-left-radius:12px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#fff}
.filter-area .image-area,.text-area{position:relative;width:100%;overflow:hidden}
.filter-area .product-list.column-1 .text-area{
    width: calc(100% - 285px);
    padding: 50px 30px;
    height: 207px;
    max-height:100%;
    background-color: #fff;
    border-top-right-radius: 12px;
    display: inline-block;
}
.filter-area .product-list.column-1 .image-area{width:277px;display: inline-block;}
.filter-area .product-list.column-1 .col-6,.filter-area .product-list.column-1 .col-md-4{width:100%;-ms-flex: 100%;flex: 100%;max-width: 100%;}
.filter-area .product-title{height:45px;font-size:16px;line-height:1.5;display:-webkit-box;word-wrap:break-word;word-break:break-all;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:0px;}
.filter-area .city-name,.product-title{text-overflow:ellipsis;overflow:hidden;font-weight:700}
.filter-area .price-wrap{margin-top:10px;font-size:15px;}
.filter-area .product-status .counting-status{font-size:11px;color:#666}
.filter-area .out-of-stock,.secret-price{font-size:16px;font-weight:700}
.filter-area .out-of-stock{color:#999}
.filter-area .rating{margin-top:15px}
.filter-area .el-rate,.el-rate-wrap{display:inline-block}
.filter-area .product-status:not(.column-1){height:40px;margin-top:11px;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;font-size:12px}
.filter-area .product-status .counting-status{padding:13px 0;color:#666}
.filter-area .product-status .counting-status .icon.reverse{margin-top:3px;-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.filter-area .product-status .counting-status .icon{display:inline-block;margin-top:2px;margin-left:2px;font-size:10px;height:11px;color:#999;vertical-align:top;overflow:hidden}
.filter-area .product-status span+span{margin-left:10px}
.filter-area .list-layer:after{content:"";display:block;clear:both}
.filter-area .like-badge-wrap{position:absolute;overflow:hidden;top:181px;right:4px;width:104px;height:40px;text-align:center;cursor:pointer;z-index:4;-webkit-box-sizing:border-box;box-sizing:border-box}
.filter-area .like-badge-wrap:after,.like-badge-wrap:before{content:"";position:absolute;bottom:14px;display:block;width:38px;height:38px;-webkit-box-shadow:0 24px 0 0 #fff;box-shadow:0 24px 0 0 #fff}
.filter-area .like-badge-wrap:after{right:0;border-radius:0 30px}
.filter-area .like-badge-wrap:before{left:0;border-radius:30px 0}
.filter-area .like-badge-wrap .like-badge{position:relative;width:40px;height:40px;border-radius:100%;background:#fff;padding:10px;z-index:5}
.filter-area .like-badge-wrap button>span{position:relative;display:inline-block;vertical-align:top}
.filter-area .product-list.column-1 .like-badge-wrap{top:50%;right:auto;left:250px;width:48px;height:48px;overflow:visible;-webkit-transform:translateY(-50%);transform:translateY(-50%)}
.filter-area .product-list.column-1 .like-badge-wrap:after,.column-1 .like-badge-wrap:before{left:-11px;-webkit-box-shadow:24px 0 0 0 #fff;box-shadow:24px 0 0 0 #fff}
.filter-area .product-list.column-1 .like-badge-wrap:before{bottom:41px;border-radius:30px 0}
.filter-area .product-list.column-1 .like-badge{position:relative;width:40px;height:40px;border-radius:100%;background:#fff;padding:10px;z-index:5}
.filter-area .product-list.column-1 .like-badge-wrap:after{top:32px;border-radius:0 30px}
.filter-area .filter .btn-area button{display:block;width:100%;height:57px;background:#f06c5e;color:#fff;text-align:center;font-size:15px;font-weight:700;outline:none}
.filter-area .masonry-container .col{padding-right:0px;}
@media (max-width:767px) {
    .filter-area{padding-top:30px;}
    .filter-area .product-list .image-box{height:147px;}
    .filter-area .like-badge-wrap{top:121px;}
    .filter-area .product-list:not(.column-1) .masonry-container .col:nth-child( 2n - 1 ){padding-left:5px}
    .filter-area .product-list:not(.column-1) .masonry-container .col:nth-child(2n){padding-right:5px;}
    .filter-area .product-list.column-1 .image-box{height:150px;}
    .filter-area .product-list.column-1 .like-badge-wrap {top:125px;}
    .filter-area .product-list.column-1 .image-area{width:150px;height:130px;display: inline-block;}
    .filter-area .product-list.column-1 .product-card{height:130px;}
    .filter-area .product-list.column-1 .text-area {width: calc(100% - 150px); padding: 10px 30px;}
    .filter-area .product-list.column-1 .like-badge-wrap {
        top: 50%;
        right: auto;
        left: 124px;
        width: 48px;
        height: 48px;
        overflow: visible;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    .filter-area .product-list.column-1 .text-area{height:130px;}
    .filter-area .masonry-container .col{padding-right:10px;}
}
@media (min-width:768px) {
    .filter-area .product-list.column-1 .product-title{width:280px;}
    .filter-area .product-list:not(.column-1) .masonry-container .col:nth-child( 3n - 2 ){padding-left:0}
    .filter-area .product-list:not(.column-1) .masonry-container .col:nth-child(3n){padding-right:0}
    .filter-area .product-list.column-1 .stock{position:absolute;top:0;left:290px;display:-webkit-box;display:-ms-flexbox;display:flex;width:180px;height:100%;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
    .filter-area .product-list.column-1 .product-status{position:absolute;top:0;right:33px;display:-webkit-box;display:-ms-flexbox;width:97px;height:100%;margin:0;border:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:center;}
}
@media (max-width:1099px) { .filter-area .conditions{display:none} .filter-area .product-list {max-width: 100%;} .filter-area .toggle-list-type{/*display:none;*/} .filter-area .text-area{padding: 13px 7px 13px;}.filter-area .like-badge-wrap {right: -16px;}.filter-area .product-list{width:100%;}}


.theme-area{padding:110px 0;background-color:#f7f7f7;-webkit-box-sizing:border-box;box-sizing:border-box}
.theme-area .theme-title-area{text-align:center}
.theme-area .title{font-size:40px;color:#f06c5e;font-weight:700}
.theme-area .subtitle{margin-top:8px;color:#666}
.theme-area .more-link{display:inline-block;font-size:13px;color:#666;font-weight:400;margin:27px auto 0;text-align:center}
.theme-area .more-link .sr-only{display:inline-block}
.theme-area .theme-layout{width:1100px;margin:64px auto 0;padding:0px;-webkit-box-sizing:border-box;box-sizing:border-box}
.theme-area .theme-layout .list-layer{width:100%}
.theme-area .theme-layout .list-layer .normal-item,.theme-layout .list-layer .product-card{height:267px;width:100%;}
.theme-area .theme-list .normal-item{overflow:hidden;float:left;position:relative;margin:15px;padding:0px 0 44px;border-radius:10px;-webkit-box-sizing:border-box;box-sizing:border-box}
.theme-area .product-card{position:relative;float:left;height:auto;margin:0 0px 30px;border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:12px;border-bottom-left-radius:12px;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-shadow:0 2px 24px rgba(0,0,0,.1);box-shadow:0 2px 24px rgba(0,0,0,.1);opacity:0}
.theme-area .data-lazy-view.data-in-view{opacity:1!important;-webkit-transform:translate(0);transform:translate(0)}
.theme-area .data-lazy-view{-webkit-transition-property:opacity,-webkit-transform;transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform;-webkit-transition-duration:.6s;transition-duration:.6s;opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}
.theme-area .rounded-title{display:inline-block;position:relative;padding:5px 14px;margin:1px;height:26px;color:#f3786c;font-size:12px;font-weight:800;line-height:16px;text-transform:uppercase}
.theme-area .theme-list .normal-item .title{margin-top:17px;font-size:32px;font-weight:700;line-height:1.4}
.theme-area .theme-list .normal-item .rounded-title{display:inline-block;position:relative;padding:5px 14px;margin:1px;height:26px;color:#f3786c;font-size:12px;font-weight:800;line-height:16px;text-transform:uppercase}
.theme-area .theme-list .normal-item .rounded-title svg{left:0;top:0;position:absolute;width:100%;height:100%;overflow:visible}
.theme-area .theme-list .normal-item .rounded-title svg rect{fill:transparent;stroke-width:2px;stroke-dasharray:999em,15px;stroke-dashoffset:-20px;stroke-linecap:round}
.theme-area .theme-list .normal-item .go-more{width:100%;position:absolute;bottom:54px}
.theme-area .go-more{position:relative;display:inline-block;font-size:24px;color:#999;font-weight:700}
.theme-area .go-more span{padding-bottom:3px;border-bottom:5px solid #999}
.theme-area .theme-list .normal-item .go-more .sr-only{display:inline-block}
.theme-area .sr-only{overflow:hidden;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);margin:-1px;width:1px;height:1px}
.theme-area .product-card .card-layer{display:block;cursor:pointer}
.theme-area .image-area,.text-area{position:relative;width:100%;overflow:hidden}
.theme-area .image-area{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0}
.theme-area .product-card .card-layer .image-gradation,.product-card .card-layer .product-writer{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out}
.theme-area .image-gradation{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:auto;background-color:#333;opacity:0;z-index:2}
.theme-area .image-gradation .icon.profile{display:block;margin-bottom:5px;font-size:17px;color:#fff;opacity:0;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out}
.theme-area .product-card .card-layer:focus .image-gradation, .product-card .card-layer:hover .image-gradation {opacity: .8;}
.theme-area .product-card .card-layer .image-gradation,.product-card .card-layer .product-writer{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out}
.theme-area .product-writer{display:block;color:#fff;width:100%;padding:0 30px;font-size:12px;text-align:center}
.theme-area .image-box{position:relative;width:100%;height:150px;background-color:#bfc1c4;border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-transform:rotate(0);transform:rotate(0);overflow:hidden}
.theme-area .theme-list .text-area{height:119px}
.theme-area .text-area{padding:19px 25px 21px;border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:12px;border-bottom-left-radius:12px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#fff}
.theme-area .product-title{height:45px;font-size:16px;line-height:1.5;display:-webkit-box;word-wrap:break-word;word-break:break-all;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.theme-area .city-name,.product-title{text-overflow:ellipsis;overflow:hidden;font-weight:700}
.theme-area .price-wrap{margin-top:20px}
.theme-area .out-of-stock,.secret-price{font-size:16px;font-weight:700}
.theme-area .out-of-stock{color:#999}
.theme-area .theme-layout:after{content:"";display:block;clear:both}



blockquote {position: relative;display: block;font-size: 20px;color: #222;line-height: 140%;font-weight: normal;padding: 0 0 0 22px;margin: 17px 0;}  blockquote:before {content: '';position: absolute;top: 5px;bottom: 4px;left: 0;display: block;width: 8px;background: #777;}
#modal-member-detail .intro p{margin-bottom:0px;font-size:14px!important;}


/*샤나 에러 설명 블럭*/
.form-group .help-block {color:#ff4500;}
.form-group.has-error input{background-color: #ffe4e4 !important;}


/* 데스크탑 하단 이벤트 토스트 관련 */
.evt-toast {animation: eventToast 6s .2s forwards;-webkit-animation: eventToast 6s .2s forwards;}
.banner-event-toast {animation-delay:3s;overflow: hidden;position: fixed;bottom: 0;left: 50%;z-index: 0;width:100%;max-width: 1040px;height: 50px;margin-left: -520px;background-color: rgba(0,0,0,0.8);border-radius: 9px;text-align: center;opacity: 0;font-weight: normal;}
.banner-event-toast .btn-close {position: absolute;top: 50%;right: 40px;margin-top: -8px;background-color: transparent;color: #fff;font-size: 12px;}

/* 팬시박스 css */
.fancybox-content.hidden-close-btn button.fancybox-close-small{display:none;}

/*** 이펙트 효과 모음 ***/
/* 페이드인 */
@-webkit-keyframes fadeIn { from {opacity: 0} to {opacity: 1} }  @keyframes fadeIn { from {opacity: 0} to {opacity: 1} }
/* 로딩 UI keyframes 정의 */
@keyframes circleLeft { 0%{transform:translateX(-20px)} 50%{transform:translateX(20px)} 100%{transform:translateX(-20px)} }
@keyframes circleRight { 0%{transform:translateX(20px)} 50%{transform:translateX(-20px)} 100%{transform:translateX(20px)} }
/* 화살표가 위아래로 바운스 하는 이펙트 */
.bounceUpAndDown {-webkit-animation-name: bounce;animation-name: bounce;-webkit-transform-origin: center bottom;transform-origin: center bottom;-webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-delay: 3s;animation-delay: 3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation-iteration-count: 5;animation-iteration-count: 5;}
.bounceUpAndDown_short {-webkit-animation-name: bounce_short;animation-name: bounce_short;-webkit-transform-origin: center bottom;transform-origin: center bottom;-webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-delay: 0.5s;animation-delay: 0.5s;-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation-iteration-count: 3;animation-iteration-count: 3;}
@-webkit-keyframes bounce { 0%, 10%, 26%, 40%, 50% {-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);-webkit-transform: translate3d(0, 0, 0)} 20%, 22% {-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);-webkit-transform: translate3d(0, -30px, 0)} 35% {-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);-webkit-transform: translate3d(0, -15px, 0)} 45% {-webkit-transform: translate3d(0, -4px, 0)} 50%, 100% {-webkit-transform: translate3d(0, 0, 0)} }  @keyframes bounce { 0%, 10%, 26%, 40%, 50% {transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);transform: translate3d(0, 0, 0)} 20%, 22% {transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);transform: translate3d(0, -30px, 0)} 35% {transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);transform: translate3d(0, -15px, 0)} 45% {transform: translate3d(0, -4px, 0)} 50%, 100% {transform: translate3d(0, 0, 0)} }
@-webkit-keyframes bounce_short { 0%, 10%, 26%, 40%, 50% {-webkit-transition-timing-function: cubic-bezier(0.115, 0.310, 0.175, 0.500);-webkit-transform: translate3d(0, 0, 0)} 20%, 22% {-webkit-transition-timing-function: cubic-bezier(0.355, 0.025, 0.455, 0.030);-webkit-transform: translate3d(0, -15px, 0)} 35% {-webkit-transition-timing-function: cubic-bezier(0.355, 0.025, 0.455, 0.030);-webkit-transform: translate3d(0, -7px, 0)} 45% {-webkit-transform: translate3d(0, -2px, 0)} 50%, 100% {-webkit-transform: translate3d(0, 0, 0)} }  @keyframes bounce { 0%, 10%, 26%, 40%, 50% {transition-timing-function: cubic-bezier(0.115, 0.310, 0.175, 0.500);transform: translate3d(0, 0, 0)} 20%, 22% {transition-timing-function: cubic-bezier(0.355, 0.025, 0.455, 0.030);transform: translate3d(0, -15px, 0)} 35% {transition-timing-function: cubic-bezier(0.355, 0.025, 0.455, 0.030);transform: translate3d(0, -7px, 0)} 45% {transform: translate3d(0, -2px, 0)} 50%, 100% {transform: translate3d(0, 0, 0)} }
@keyframes eventToast { 0% {bottom:0px; opacity:1; z-index:50000;} 10% {bottom:80px;} 20% {bottom:60px;} 80% {bottom:60px; opacity:1; z-index:50000;} 100% {opacity:0; z-index:0;} }
.neon {animation: neon 1s ease infinite;-moz-animation: neon 1s ease infinite;-webkit-animation: neon 1s ease infinite;}
@keyframes neon { 0%, 100% {text-shadow: 0 0 1vw #FA1C16, 0 0 3vw #FA1C16, 0 0 10vw #FA1C16, 0 0 10vw #FA1C16, 0 0 .4vw #FED128, .5vw .5vw .1vw #806914;color: #FED128;} 50% {text-shadow: 0 0 .5vw #800E0B, 0 0 1.5vw #800E0B, 0 0 5vw #800E0B, 0 0 5vw #800E0B, 0 0 .2vw #800E0B, .5vw .5vw .1vw #40340A;color: #806914;} }
.flux {animation: flux 2s linear infinite;-moz-animation: flux 2s linear infinite;-webkit-animation: flux 2s linear infinite;-o-animation: flux 2s linear infinite;}
@keyframes flux { 0%, 100% {text-shadow: 0 0 1vw #1041FF, 0 0 3vw #1041FF, 0 0 10vw #1041FF, 0 0 10vw #1041FF, 0 0 .4vw #8BFDFE, .5vw .5vw .1vw #147280;color: #28D7FE;} 50% {text-shadow: 0 0 .5vw #082180, 0 0 1.5vw #082180, 0 0 5vw #082180, 0 0 5vw #082180, 0 0 .2vw #082180, .5vw .5vw .1vw #0A3940;color: #146C80;} }
.fa-spin-3s {-webkit-animation: fa-spin 3s infinite linear;animation: fa-spin 3s infinite linear;}
.fa-spin-4s {-webkit-animation: fa-spin 4s infinite linear;animation: fa-spin 4s infinite linear;}

/*뷰에서 v-cloak을 사용하면 vue가 로딩되는 동안에 불필요한 템플릿이 뜨지 않도록 함*/
[v-cloak] {display: none;}

/* 이미지가 뿌옇게 나오는 현상 제거를 위해 */
img{
    image-rendering: -moz-crisp-edges;         /* Firefox */
    image-rendering:   -o-crisp-edges;         /* Opera */
    image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */
}