/*-------------------------------------------------
Author : JMKIM
Create date : 2018. 01. 11
=== Author : SY, CHo
Create date : 2018. 11. 20 고도화사업
-------------------------------------------------*/
#header { height: 180px; background-image: url("../../../resources/images/status_board/header-bg.jpg"); background-position: left; background-repeat: no-repeat;
background-size: cover;
color: #fff; }
#header .container {
  height: auto;
  padding: 50px;
  padding-bottom: 150px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#header .header-title {
  width: 200px;
    flex-shrink: 0;
}
#header .header-p {
  flex-grow: 1;
    padding-left: 20px;
}
#header .header-i {
    padding-right: 50px;
    display: flex;
}
#header .header-i > a {
  width: 70px;
  height: 70px;
  background: #fff;
  display: inline-block;
  border-radius: 100%;
  color: #182866;
  font-weight: bold;
  box-sizing: border-box;
  padding: 5px;
  text-align: center;
  font-size: 14px;
  padding-top: 15px;
  margin-right: 15px;
}
#header .header-i > a > img{
  margin-bottom: 5px;
}
/* #header .container { position: relative; height: 100%; } */
#header .gohome,
#header .logo { -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; left: 0; }
#header .logo::before { content: ""; width: 93px; height: 58px; background: url(../../../resources/images/status_board/bg_logo.gif) no-repeat; position: absolute; top: -30px; left: -80px; z-index: -1; }
#header .logo > a { width: 242px; height: 47px; font-size: 0; line-height: 0; overflow: hidden; display: block; background: url("../../../resources/images/status_board/logo.png") 0 center no-repeat; }
#header .gohome {left: 245px; font-size: 25px; color: #fff;}
#header .notice-list { -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; left: 320px; }
#header .notice-list > li { font-weight: 200; line-height: 1.4; padding-left: 16px; position: relative; }
#header .notice-list > li::before { content: ""; width: 5px; height: 5px; background-color: #d3d6dc; position: absolute; top: 6px; left: 0; }
#header .notice-list > li a.link { color: #7ec4ff; text-decoration: underline; }
#header .notice-list > li .sky {color: #7ec4ff;}
#header .btn {color: #fff; border: none; text-align: center; border-radius: 10px; position: absolute; top: 50px; width: 130px; height: 70px; line-height: 3; padding-top: 11px;}
#header .btn.checkin {background-color: #3db9fa; right: 250px;}
#header .btn.checkout {background-color: #ffa200; right: 110px;}

.animate { -webkit-transform: scale(0.35); transform: scale(0.35); position: absolute; top: -70px; right: 0; }
.animate::after { content: ""; width: 61px; height: 41px; background: url(../../../resources/images/status_board/bg_star.gif) no-repeat; position: absolute; top: 120px; right: -30px; z-index: -1; -webkit-transform: scale(3); transform: scale(3); }

.animate2 { -webkit-transform: scale(0.25) rotate(45deg); transform: scale(0.25) rotate(45deg); position: absolute; top: -90px; left: 105px; }

.rocket_wrap { width: 91px; height: 305px; -webkit-animation: vibration 0.2s infinite; animation: vibration 0.2s infinite; }

.rocket_wrap .rocket, .rocket_wrap .fire { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: no-repeat 50% 50%; }

.rocket_wrap .rocket { background-image: url(../../../resources/images/cluster/main/roket_img.png); }

.rocket_wrap .fire { background-image: url(../../../resources/images/cluster/main/roket_file.png); }

.rocket_wrap [class*="spark"] { position: absolute; width: 10px; height: 15px; border-radius: 50%; background: #ffa200; -webkit-animation: dancing_fire 0.24s infinite; animation: dancing_fire 0.24s infinite; }

.rocket_wrap .spark-2 { bottom: 44px; left: 65px; -webkit-animation-delay: 0.22s; animation-delay: 0.22s; }

.rocket_wrap .spark-3 { bottom: 68px; left: 45px; -webkit-animation-delay: 0.32s; animation-delay: 0.32s; }

.rocket_wrap .spark-4 { bottom: 20px; left: 25px; -webkit-animation-delay: 0.16s; animation-delay: 0.16s; }

@-webkit-keyframes vibration { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
  50% { -webkit-transform: translate(1px, -1px); transform: translate(1px, -1px); }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } }

@keyframes vibration { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
  50% { -webkit-transform: translate(1px, -1px); transform: translate(1px, -1px); }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } }
@-webkit-keyframes dancing_fire { 0% { opacity: 1; transform-origin: 50% 50%; transform: translate(0, -10px) scale(1); -webkit-transform-origin: 50% 50%; -webkit-transform: translate(0, -10px) scale(1); }
  100% { opacity: 0; transform: translate(0, 50px) scale(1); -webkit-transform: translate(0, 50px) scale(1); } }
@keyframes dancing_fire { 0% { opacity: 1; transform-origin: 50% 50%; transform: translate(0, -10px) scale(1); -webkit-transform-origin: 50% 50%; -webkit-transform: translate(0, -10px) scale(1); }
  100% { opacity: 0; transform: translate(0, 50px) scale(1); -webkit-transform: translate(0, 50px) scale(1); } }
@media (max-width: 1820px) { .wrap { width: 1820px; }
  .container { width: 1820px; } }
/*# sourceMappingURL=layout.css.map */

/* 팝업레이어 */
.btnRight {margin-top: 30px; text-align: right;}

/* 버튼 */
.btn-type-a {display: inline-block; padding: 0 50px; height: 35px; line-height: 35px; text-align: center; vertical-align: top; color: #fff; border-radius: 4px;}
.btn-type-a.sky {background-color: #28b1fa; box-shadow: 0 3px 0 #0380c2;}
.btn-type-a.darkgray {background-color: #5f6577; box-shadow: 0 3px 0 #444956;}

.btn-type-a + .btn-type-a {margin-left: 5px;}

.popup-layout {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 999;}
.popup-inner {position: absolute; top: 50%; left: 50%; padding: 40px; width: 985px; height: auto; background-color: #fff; border: 1px solid #9ca6b1; border-top: 8px solid #28b1fa; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);}
.popup-inner::after {position: absolute; top: -8px; right: 0; width: 230px; height: 8px; background-color: #38425a; content: ''; z-index: 0;}
.popup-logo {position: absolute; top: 30px; right: 40px;}
.popup-close {position: absolute; top: -8px; right: 40px; width: 60px; height: 60px; line-height: 60px; text-align: center; font-size: 32px; color: #fff; background-color: #28b1fa; z-index: 1;}

.popup-inner.edit {background-color: #f7fafe;}
.popup-inner.edit h1 {margin-bottom: 20px; font-size: 22px; font-weight: 400; color: #424242; letter-spacing: -0.07em;}
.popup-inner.edit .popup-contents {padding: 30px; line-height: 1.5; background-color: #fff; border: 1px solid #e8ecf1; overflow: hidden;}
.popup-inner.edit .popup-contents p + p {margin-top: 5px;}
.popup-inner.edit .popup-contents input {padding: 0 20px; height: 35px; line-height: 33px; background-color: #fff; border: 1px solid #d6dde7;}
.popup-inner.edit .popup-contents label.block {display: inline-block; margin-right: 10px; min-width: 145px; color: #424242;}
.popup-inner.edit .popup-contents .table.radio-table {margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #e8ecf1;}
.popup-inner.edit .popup-contents .table.radio-table table td {height: 50px; vertical-align: middle;}
.popup-inner.edit .popup-contents .table.radio-table table label {display: inline-block; vertical-align: middle; border: none;}


/*================================== 폼요소 */

/* 폼요소(체크박스, 라디오버튼) 라벨영역 */
.controlgroup .ui-visual-focus{
	box-shadow: none;
}
.controlgroup .ui-state-default,
.controlgroup .ui-widget-content .ui-state-default,
.controlgroup .ui-widget-header .ui-state-default,
.controlgroup .ui-button,
html .controlgroup .ui-button.ui-state-disabled:hover,
html .controlgroup .ui-button.ui-state-disabled:active {
    background: inherit;
    border: none;
}
.controlgroup .ui-state-hover,
.controlgroup .ui-widget-content .ui-state-hover,
.controlgroup .ui-widget-header .ui-state-hover,
.controlgroup .ui-state-focus,
.controlgroup .ui-widget-content .ui-state-focus,
.controlgroup .ui-widget-header .ui-state-focus,
.controlgroup .ui-button:hover,
.controlgroup .ui-button:focus {
    border: none;
    background: inherit;
    font-weight: inherit;
    color: inherit;
}
.controlgroup .ui-icon {
    width: 21px;
    height: 21px;
    /*width: 23px;
    height: 23px;*/
}

/* 폼요소영역 */
.controlgroup .ui-icon-check {
	background-color: #28b1fa;
    background-image: url(/resources/js/cluster/jquery-ui-1.12.1.custom/images/ui-icons_ffffff_256x240.png);
}
.controlgroup .ui-checkboxradio-label .ui-icon-background {
	background-color: #d6dde7;
    background-image: url(/resources/js/cluster/jquery-ui-1.12.1.custom/images/ui-icons_ffffff_256x240.png);
    box-shadow: none;
    border-radius: 3px;
    /*border-radius: 50%;*/
    border: none;
}
.controlgroup .ui-icon-background,
.controlgroup .ui-state-active .ui-icon-background {
    border: none;
	background-color: #28b1fa;
}
.controlgroup .ui-state-active,
.controlgroup .ui-widget-content .ui-state-active,
.controlgroup .ui-widget-header .ui-state-active, a.ui-button:active,
.controlgroup .ui-button:active,
.controlgroup .ui-button.ui-state-active:hover {
    border: none;
    background: inherit;
    background-color: inherit;
    font-weight: inherit;
    color: inherit;
}

/* 라디오버튼 */
.radio-line .ui-checkboxradio-label .ui-icon-background {
    border-radius: 50%;
}
.radio-line .ui-checkboxradio-label .ui-icon-background,
.radio-line .ui-icon-check {
	background-position: -77px -142px;
    /*background-position: -76px -141px;*/
}
.radio-line .ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon,
.radio-line .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon {
    background-image: url(/resources/js/cluster/jquery-ui-1.12.1.custom/images/ui-icons_ffffff_256x240.png);
    width: 21px;
    height: 21px;
    /*width: 23px;
    height: 23px;*/
	border: none;
}

/* 20200414 추가 */
.terms-list {overflow-y: auto; height: 116px; padding: 10px 20px; border: 1px solid #d6dde7; background-color: #fff;}
.terms-list li {position: relative; padding: 2px 0; padding-left: 10px; font-size: 14px;}
.terms-list li::before {content: ""; width: 3px; height: 3px; background-color: #8b8c8e; border-radius: 50%; position: absolute; top: 11px; left: 0;}
#check-in-popup .popup-inner {overflow: hidden; overflow-y: auto;}