.swal-modal{    padding-top: 0px !important; }
.swal-button--cancel { color: #555 !important; background-color: #efefef !important; }
.swal-button{background-color:#BFCE18; color: #fff;}
.swal-button:not([disabled]):hover{background-color:#BFCE18; color: #fff;}

#layer.post_wrap{display:none;position:fixed; max-width: 600px; width:80%; height:80%;
    left:50%; transform: translateX(-50%); top: 10%; bottom: 10%;
    overflow:hidden;z-index:9999;-webkit-overflow-scrolling:touch; border: 1px solid #ddd; border-radius: 10px;}
#layer.post_wrap .hd{ color: #fff; height: 60px; line-height: 60px; text-align: center; font-size: 1.4em; background: #343434; position:relative;}
#layer.post_wrap .hd .btn_close{cursor:pointer;position:absolute;right:15px;top:50%; transform: translateY(-50%); z-index:1; color: #fff;}
#layer.post_wrap .hd .btn_close i{color: #fff;}

/* 폰트어썸 아이콘 */
i{margin:0 2px;}

/*가로스크롤*/
.scroll_x{overflow-x:scroll; padding:0px; -webkit-overflow-scrolling:touch;-ms-overflow-scrolling:touch;-mos-overflow-scrolling:touch;-o-overflow-scrolling:touch;}
.scroll_x ul{white-space:nowrap;}
.scroll_x li{display:inline-block; white-space:nowrap; margin-right:5px; vertical-align:top; position:relative;}

/*브라우저 상하단이동버튼*/
#gobtn{position:fixed; display:block; right:10px; bottom:20px; display:none; z-index:9999;}
.goHd, .goFt{width:30px; height:30px; background:#F7F7F7; z-index:9999; text-indent:-9999px; border:1px solid #CCC; position:relative;
	  transition:all 0.5s; box-shadow:0px 0px 3px RGBA(0, 0, 0, 0.5); border-radius:4px; display:block; margin-bottom:3px;}
.goHd span{position:absolute; top:60%; left:9px; display:block; width:10px; height:10px; border-left:2px solid #666; border-top:2px solid #666; border-radius:2px;
    transform:translateY(-50%) rotate(45deg);}
.goFt span{position:absolute; top:40%; left:9px; display:block; width:10px; height:10px; border-left:2px solid #666; border-top:2px solid #666; border-radius:2px;
    transform:translateY(-50%) rotate(-135deg);}
.goHd:hover, .goFt:hover{background:#333; border:1px solid #333}
.goHd:hover span, .goFt:hover span{border-left:2px solid #FFF; border-top:2px solid #FFF;}

/* 준비중페이지 */
#ready{text-align:center; background:url(../img/common/ready.png) no-repeat 50% 0; margin:80px 0;
        padding-top:130px; font-size:1.5em; line-height:1.3em; color:#333;}
#ready strong{font-weight:600; color:#23B1BD;}
#ready p{font-size:0.8em; color:#666;}

/* 블랙 표
.tbl table{width:100%; margin:10px 0px 0px 0; font-size:0.95em; border-top:1px solid #E3E3E3; border-bottom:1px solid #E3E3E3; font-size:1.1em; line-height:1.8em; }
.tbl td, .tbl th{vertical-align:middle; border-bottom:1px solid #8C8C8C; padding:10px 15px; border-left:1px solid #8C8C8C; text-align:center;}
.tbl td{}
.tbl th{border-right:1px solid #8C8C8C; color:#FFF; background:#C4E6F6; font-weight:bold;}

.tbl thead th{border-bottom:1px solid #fff; background:#000;}
.tbl tbody th{background:#404040; border-bottom:1px solid #8C8C8C; font-weight:normal;}

.tbl tr th:first-child, .tbl tr td:first-child{border-left:0;}
.tbl tr:last-child th{border-right:0;}

.tbl table.td_left td{text-align:left;}*/

/* 화이트 표 */
.tbl table{width:100%; margin:10px 0px 0px 0; border-left:1px solid #CBCBCB; border-top:1px solid #CBCBCB; border-bottom:1px solid #E3E3E3; font-size:1em; line-height:1.5em; }
.tbl td, .tbl th{vertical-align:middle; border-bottom:1px solid #CBCBCB; padding:10px 5px; border-right:1px solid #CBCBCB; text-align:center;}
.tbl td{}
.tbl th{border-right:1px solid #CBCBCB; color:#333; background:#E3E3E3; font-weight:bold;}

.tbl thead th{border-bottom:1px solid #CBCBCB; background:#E0EEF8;}
.tbl tbody th{background:#FBFBFB; border-bottom:1px solid #CBCBCB; font-weight:normal;}

/*.tbl tr th:first-child,
.tbl tr td:first-child{border-left:0;}
.tbl tr td:last-child,
.tbl tr th:last-child{border-right:0;}*/

.tbl table.td_left td{text-align:left;}

/*가로스크롤*/
.row-horizon {
  position:relative;
  width:98%;
  padding:0 0 20px 0;
  margin:0 auto 20px auto;
  overflow-x: hidden;
  overflow-y: hidden;
}
@media screen and (max-width:787px) {
.row-horizon:before{content:"← 좌우스크롤로 확인해주세요 →"; display:block; text-align:center; margin-bottom:10px;}
.row-horizon {
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
}
}

/*hoverBOX*/
.block-texts{position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity:0.6; z-index:2;}
.block-texts .drawborder{display:block; background:#FFD040; position: absolute;}

.block-texts .drawborder-top{width: 0%; height: 15px; left: 0; top: 0; transition-delay: 0s;}
.block-texts .drawborder-left{width: 15px; height: 0%; top: 0; right: 0; transition-delay: 0s;}
.block-texts .drawborder-bottom{width: 0%; height: 15px; right: 0; bottom: 0; transition-delay: 0s;}
.block-texts .drawborder-right{width: 15px; height: 0; left: 0; bottom: 0; transition-delay: 0s;}

.block-texts:hover .drawborder{transition: all 0.25s;}
.block-texts:hover .drawborder-top{width: 100%; transition-delay: 0s;}
.block-texts:hover .drawborder-left{height: 100%; transition-delay: 0.1s;}
.block-texts:hover .drawborder-bottom{width: 100%; transition-delay: 0.2s;}
.block-texts:hover .drawborder-right{height: 100%; transition-delay: 0.3s;}

/*clearfix*/
.cf{}/* 여기서 cf는 float속성을 가진 태그의 부모태그라고 생각한다.*/
.cf:after{display:block; content:""; clear: both;}
.hide{display:none;}
.cb{clear:both!important;}
.bgn{background:none!important;}
.bdn{border:none!important;}
.pa{position:absolute!important;}
.fwb{font-weight:bold!important;}
.fl{float:left;}
.fr{float:right;}

/*pagination*/
.pagination>li:first-child>a, .pagination>li:first-child>span {
    margin-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;    
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    background-color:#4B82C3;
    border-color: #4B82C3;}
.pagination>li:last-child>a, .pagination>li:last-child>span {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.pagination.justify-content-center {    display: flex;    justify-content: center;}
.pagination .page-link{ cursor: pointer !important; }
/*기본모달*/
/*모달*/
.btn-primary,.btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open>.dropdown-toggle.btn-primary {border-radius: 0;}
.modal-backdrop.in{opacity:.7;}
.modal-content{    border-radius: 0;box-shadow:none; -webkit-box-shadow:none; border:0; padding:0;}

.modal-dialog{position:fixed; bottom:-0px; width:90%; max-width: 700px }

.modal-body{padding:15px;    max-height: 70vh;    overflow-y: auto}

.modal-footer {background: #f5f5f5}
.modal.fade .modal-dialog {
  -webkit-transition: -webkit-transform .3s ease-out;
       -o-transition:      -o-transform .3s ease-out;
          transition:         transform .3s ease-out;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
       -o-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
	
    top: 32%;
    height: auto;
    left: 50%;
}
.modal.fade.in .modal-dialog {
          transition:transform .3s ease-out;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
       -o-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}


.modal .mod_inp{
    display: block;
    width: 100%;
    margin: 0px auto;
    text-align: center;
	padding:20px 0 10px
}
.modal .mod_inp input{
    border: 1px solid #DDD;
    border-radius: 5px;
    line-height: 3;
    text-align: center;
    margin: 10px auto;
    width: 90%;
}
.modal .mod_btn{
    display: block;
    width: 100%;
    background: #4acad7;
    border: 0;
    outline: none;
    font-weight: 600;
    line-height: 43px;
    font-size: 1.3em;
    border-radius: 0 0 5px 5px;
}
.mod_center .modal-footer {
    text-align: center;
    padding: 0;
}
.mod_center .modal-header button.close {position: absolute;right: -15px;top: -20px;background: #FFF;opacity: 1;border: 1px solid #DDD;width: 40px;height: 40px;border-radius: 50%;z-index: 9;font-size: 30px;font-weight: 400;color: #868686;}
.modal-dialog.mod_center {bottom:inherit;top:50%;}
.mod_center .modal-header{border:0}
.mod_center button.close{
    position: absolute;
    top: -20px;
    right: -10px;
    background: #FFF;
    opacity: 1;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 1px solid #898989;
    z-index: 9;
    font-size: 29px;
    font-weight: 300;
    color: #898989;}

.pop_comp {
    padding: 20px;
}
.pop_comp .name{
    color: #8d8d8d;
}
.pop_comp .name span{
    display: inline-block;
    font-size: 1.4em;
    font-weight: 500;
    color: #4acad6;
    margin-right: 4px;
}
.pop_comp .s_info{
    margin-bottom: 8px;
    font-size: .9em;
    color: #8d8d8d;
}
.pop_comp .sts{
    FONT-WEIGHT: 100;
    /* font-size: 1.1em; */
    color: #494949;
}
.pop_comp .sts span{
    display: inline-block;
    font-weight: 500;
    margin-right: 7px;
    padding-right: 7px;
position:relative;
}
.pop_comp .sts span.tm:after{
	content: '';
    display: inline-block;
    position: absolute;
    right: -2px;
    top: 5px;
    height: 17px;
    width: 1px;
    background: #DDD;
}
.pop_comp .sts {}
/*원형모달*/
#circle{}
#circle .modal-backdrop{background:;}
#circle .modal-backdrop.in{opacity:.7;}
#circle .modal-content{box-shadow:none; -webkit-box-shadow:none; border:0; padding:0;}
#circle .modal-header {text-align:right; padding:10px 15px;}
#circle .modal-header .close{ float:none;}

#circle .modal-dialog{margin:0; position:fixed; bottom:80px; width:auto; }
#circle .modal-content{border-radius:20px 20px 0 0; background:none; }
#circle .modal-body{padding:15px;}
#circle .modal-body a{display:block; padding:10px 0px; background:#12bcbb; color:#fff; font-weight:600; font-size:1.1em; text-align:center; width:70px; height:70px; border-radius:50%; margin-bottom:10px;}
#circle .modal-body a i{font-size:1.8em; line-height:1.2em;}
#circle .modal-body a p{font-size:0.75em; line-height:1.4em; font-weight:normal;}

#circle .modal.fade .modal-dialog {
  -webkit-transition: -webkit-transform .3s ease-out;
       -o-transition:      -o-transform .3s ease-out;
          transition:         transform .3s ease-out;
  -webkit-transform: translate(0, 25%);
      -ms-transform: translate(0, 25%);
       -o-transform: translate(0, 25%);
          transform: translate(0, 25%);
}
#circle .modal.fade.in .modal-dialog {
  -webkit-transition: -webkit-transform .3s ease-out;
       -o-transition:      -o-transform .3s ease-out;
          transition:         transform .3s ease-out;
  -webkit-transform: translate(0, -0%);
      -ms-transform: translate(0, -0%);
       -o-transform: translate(0, -0%);
          transform: translate(0, -0%);
}
/*체크박스*/
input[type=checkbox] { display: none; }
input[type=checkbox] + label { cursor: pointer; margin:5px 0; font-size:1em; }
input[type=checkbox] + label > div {
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    background: #a5a5a5;
    box-sizing: border-box;
    width: 20px; height: 20px;
    margin-top: -4px;
    border-radius:50%;
	margin-right:5px;
	position:relative;
}
input[type=checkbox] + label > div:before {
	font-family: "Font Awesome 5 Pro";
    color: #fff;
    content: "\f00c";
	position:absolute;
	top:50%; left:50%; transform:translate(-50%,-50%);
	font-weight:900;
}
input[type=checkbox]:checked + label{font-weight:600 !important; color:#00b5d0;}
input[type=checkbox]:checked + label > div{
	background:#00b5d0;
	border:0;
}
input[type=checkbox] + label:hover > div { border-width: 2px; }

/*라디오버튼*/
input[type=radio] { display: none; }
input[type=radio] + label { cursor: pointer; margin:5px 0; font-size:1em; }
input[type=radio] + label > div {
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    background: #a5a5a5;
    box-sizing: border-box;
    width: 20px; height: 20px;
    margin-top: -4px;
    border-radius:50%;
	margin-right:5px;
	position:relative;
}
input[type=radio] + label > div:before {
	font-family: "Font Awesome 5 Pro";
    color: #fff;
    content: "\f00c";
	position:absolute;
	top:50%; left:50%; transform:translate(-50%,-50%);
	font-weight:900;
}
input[type=radio]:checked + label{font-weight:600 !important; color:#00b5d0;}
input[type=radio]:checked + label > div{
	background:#00b5d0;
	border:0;
}
input[type=checkbox] + label:hover > div { border-width: 2px; }


/*라운드형*/
.round{}
.round input[type=radio] { display: none; }
.round input[type=radio] + label { cursor: pointer; margin:5px 0; font-size:0.85em; font-weight:normal; padding:2px 10px;
								display:inline-block !important; margin-right:5px; background:#F7F7F7; border-radius:30px; }
.round input[type=radio] + label > div {
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    background: #ddd;
    box-sizing: border-box;
    width: 14px; height: 14px;
    margin-top: 0px;
    border-radius:50%;
	margin-right:5px;
	position:relative;
}
.round input[type=radio] + label > div:before {
	font-family: "Font Awesome 5 Pro";
    color: #fff;
    content: "\f00c";
	position:absolute;
	top:50%; left:50%; transform:translate(-50%,-50%);
	font-weight:400;
	font-size:0.7em;
}
.round input[type=radio]:checked + label{font-weight:500 !important; color:#4acad6; background:#f0f9fa;}
.round input[type=radio]:checked + label > div{
	background:#4acad6;
	border:0;
}
.round input[type=radio] + label:hover > div { border-width: 2px; }

/*박스디자인*/
.box_in input[type=radio] { display: none; }
.box_in input[type=radio] + label { cursor: pointer; margin:0px 0; font-size:0.95em; font-weight:normal; display:inline-block !important; text-align:center;
									margin:0 5px 5px 0; background:#fff; padding:8px 10px; line-height:1em; border-radius:8px; border:1px solid #ddd; }
.box_in input[type=radio] + label > div {display:none;}
.box_in input[type=radio]:checked + label{
	background:#4acad6;
	border:1px solid #4acad6;
	color:#fff;
	font-weight:600;
}
.box_in input[type=checkbox] + label:hover > div { border-width: 2px; }

.box_in input[type=checkbox] { display: none; }
.box_in input[type=checkbox] + label { cursor: pointer; margin:0px 0; font-size:0.95em; font-weight:normal; display:inline-block !important;
									margin-right:5px; background:#fff; padding:5px 10px; line-height:1em; border-radius:20px; border:1px solid #ddd; }
.box_in input[type=checkbox] + label > div {display:none;}
.box_in input[type=checkbox]:checked + label{
	background:#f0f9fa;
	border:1px solid #4acad6;
	color:#4acad6;
}
.box_in input[type=radio] + label:hover > div { border-width: 2px; }