html, body {
		padding:0px;
		width:100%;
		box-sizing:border-box;
		height:100%;
		margin:0px;
		background-color:#f1f1f1;

	}
	.app_header {
		height:56px;
		box-sizing:border-box;
		text-align:center;
		background-color:#0D5289;
		position:fixed;
		color:#ffffff;
		z-index:9999;
		top:0px;
		width:100%;
	}


	.left_menu_button { 

		position:absolute;
		left:16px;
		top:15px;
		color:#ffffff;
		font-size:24px;
		
	}


	.center_login { 
		width:100%;
		height:380px;
		overflow:hidden;
		margin:0 auto;
		position:relative;
		/*margin-top:calc(50% - 45px);*/
	}	

	.right_menu_button { 

		position:absolute;
		right:16px;
		top:15px;
		color:#ffffff;
		font-size:24px;

	}



	.main_item {
		box-sizing:border-box;
		width:100%;
	}

	.main_item .cont {
		padding:10px;
		font-size:12px;
	}


	.main_item_color1{
		background-color:#6EDC8F;
		color:#ffffff;
	}
	.main_item_color2{
		background-color:#69C2D2;
		color:#ffffff;
	}
	.main_item_color3{
		background-color:#6CC5A0;
		color:#ffffff;
	}



	.main_quick{
		width:33.3333%;
		float:left;
		padding-top:12px;
		height:72px;
		box-sizing:border-box;
		text-align:center;
		background-color:#888888;
		color:#ffffff;
		font-size:14px;
	}

	.main_quick i {
		margin-bottom:6px;
	}


	.ticket_summary {
		border-collapse:collapse;
		width:100%;

	}


	.ticket_summary th {
		background-color:#888888;
		color:#ffffff;
		width:32px;
		font-size:12px;
		text-align:center;
	}

	.ticket_summary td {
		text-align:right;
		padding-right:8px;
		font-size:12px;
		height:22px;

	}



	.app_main { 
		width:100%;
		height:100%;
		padding-top:56px;
		overflow:hidden;
		overflow-y:auto;
	}

		
	.app_footer {
		z-index:500;
		width:100%;
		position:fixed;
		bottom:0px;
		font-size:12px;
	}


	.app_footer ul {
		margin:0px;
		padding:0px;
		list-style:none;
		border-top:2px solid #69C2D2;
	}

	.app_footer li {
		margin:0px;
		padding:0px;
		list-style:none;
		width:25%;
		height:56px;
		float:left;
		text-align:center;
		background-color:#ffffff;
		color:#333333;
	}

	.app_footer li i {
		font-size:20px;
		padding-top:8px;
		padding-bottom:5px;
		color:#aaaaaa;
	}


	.app_footer li.active {
		background-color:#69C2D2;
		color:#ffffff;
	}

	.app_footer li.active i {
		color:#ffffff;
	}


	.left_menu { 

		position:fixed;
		left:0;
		top:0px;
		width:100%;
		height:100%;
		z-index:21000;
		display:none;
	}

	.left_menu .blinder{

		position:absolute;
		z-index:800;
		left:0px;
		top:0px;
		width:100%;
		height:100%;
		background-color:#000000;
		opacity:0.5;

	}

	.left_menu .menu {
		
		position:absolute;
		z-index:2000;

		background-color:#f2f2f2;
		width:100%;
		min-height:100px;
		height:100%;
	}

	.left_menu .menu li {
		
		background-color:#ffffff;
		list-style:none;
		padding:0px;
		height:48px;
		box-sizing:border-box;
		padding-top:15px;
		padding-left:12px;
		font-size:13px;
		border-bottom:1px solid #eeeeee;

	}


	.left_menu .menu li span {
		float:right;
		padding-right:12px;
		color: #aaaaaa;
	}




	.left_menu .menu li.active {
		background-color: #0D5289;
		color:#ffffff;
	}



	.left_menu .menu li.active span {
		color:#ffffff;
	}



	.left_menu .menu .user_info {
		
		font-size:12px;
		text-align:center;
		margin-bottom:16px;

	}

	.left_menu .close_btn { 
		right:12px;
		display:block;
		height:24px;
		width:24px;
		box-sizing:border-box;
		padding:6px;
		position:absolute;
	}
/*
	.left_menu .menu .user_info .thumb {
		
		display:inline-block;
		margin:10px;
		background-color:#ffffff;
		height:72px;
		width:72px;
		border-radius:72px;
		border:2px solid #32ac63;

	}
*/

	.left_menu .menu .user_info .no_profile {
		
		color:#ffffff;
		font-size:32px;
		padding-top:18px;
	}


	.left_menu .menu .seperator {
		height:5px;
		width:100%;
		background-color:#f2f2f2;
		border:0px none;
		padding:0px;
	}

	.left_menu .menu_header { 
		width:100%;
		height:56px;
		box-sizing:border-box;
		padding-top:6px;
		background-color:#ffffff;
	}

	.left_menu .close_btn {
		position:absolute;
		top:12px;
		right:8px;
	}

	.left_menu .menu_frame {
		display:block;
		height:100%;
		overflow:hidden; 
		overflow-y:scroll;
		font-weight:bold;
		color:#555555;
	}

	.modify_btn { 
		background-color: #32ac63;
		border-radius:5px;
		color:#ffffff;
		width:70px;
		margin-top:10px;
		display:inline-block;
		height:24px;
		padding-top:4px;
		box-sizing:border-box;
	}

	.logout_btn { 
		background-color: #ffac32;
		border-radius:5px;
		color:#ffffff;
		width:70px;
		margin-top:10px;
		display:inline-block;
		height:24px;
		padding-top:4px;
		box-sizing:border-box;
	}



	.latest_article_title { 

		padding-left:16px;
		height:42px;
		border:1px solid #eeeeee;
		background-color:#f2f2f2;
		padding-top:12px;
		box-sizing:border-box;
		font-size:12px;
		color:#666666;

	}

	.latest_article_title .detail_btn {
		float:right;
		margin-right:16px;
		color:#888888;
	}


	.latest_article_list {

		padding-left:8px;
		padding-right:8px;
	}


	.latest_article_list li {
		height:42px;
		border-bottom:1px solid #eeeeee;
		list-style:none;
		padding:0px;
		padding-top:12px;
		display:block;
		box-sizing:border-box;
		width:100%;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
		word-wrap:normal;
	}




	.write_form * { 
		box-sizing:border-box;
	}


	.btn_confirm { 
		background-color:#69C2D2 !important;
		color:#ffffff !important;
	}



	

.error-box .s-tt {  margin-top:20px; }
.error-box .s-tt span { display:block; }
.error-box strong { color:#216bd0; }
.error-box { font-size:1.2em; word-wrap:break-word; word-break:keep-all; font-weight:600; }
.error-box .btn { margin-top:25px; }
.error-box { border:1px dashed #b2b2b2; background-color:#fafafa; text-align:center; padding:60px 15px; border-radius:5px; }


	.mypage_menu {
		
		width:100%;
		/*
		position:absolute;
		bottom:0px;
		margin-top:120px;*/
		background-color:#ffffff;
		
	}

	.mypage_menu  .info {
		padding-top:8px;
		padding-bottom:8px;
	}



	.mypage_menu li {
		list-style:none;
		margin:0px;
		height:42px;
		border:1px solid #eeeeee;
		overflow:hidden;
		color:#666666;
		box-sizing:border-box;
		padding:8px;
		position:relative;
	}


	.mypage_menu li div {
		position:absolute;
		left:0px;
		top:0px;
		color:#888888;
		height:100%;
		width:100%;
	}




	.mypage_menu li div strong {
		padding-left:16px;
		padding-top:12px;
		display:block;
		font-size:14px;
	}


	.mypage_menu .link_arrow {
		font-size:15px;
		float:right;
		display:block;
		margin-top:5px;
		margin-right:8px;
		color:#888888;
	}



	.mypage { 
		display:inline-block;
		position:relative;
		width:100%;
		height:100%;
		background-color:#f2f2f2;
	}


	.app_header .title {
		font-size:18px;
		padding-top:17px;
		display:block;
		height:56px;
		color:#ffffff;
	}

/*
	.app_sub_header { 
		background-color:#69C2D2;
		border:0px none;
	}

	.app_sub_header .left_menu_button {
		color:#ffffff;
	}	

	.app_sub_header .right_menu_button {
		color:#ffffff;
	}	
*/


	.myinfo { 
		width:100%;
		border:1px solid #eeeeee;
		border-collapse:collapse;
		color:#555555;
		font-size:12px;
	}


	.myinfo th {
		width:100px;
		height:34px;
		text-align:center;
		background-color:#f5f5f5;
		color:#333333;
		padding:5px;
	}
	
	.myinfo td {
		padding:5px;
		text-align:center;
		border:1px solid #eeeeee;
	}


	.result_payment th, .result_payment td {
		text-align:center;
	}


	.mypage_ok_btn { 
		margin-top:8px;
		font-size:15px;
		padding-top:12px;
		padding-bottom:12px;
		padding-left:24px;
		padding-right:24px;
		letter-spacing:0.6px;
		cursor:pointer;
		background-color:#ffffff;
		color:#0D5289;
		border:1px solid #0D5289;
		text-align:center;
		border-radius:16px;
	}


	.top-info-box {
		font-size:11px;
	}



	.qr_frame {
		padding:0px;
		width:232px;
		border:3px solid #eeeeee;
		margin:0 auto;
		margin-top:24px;

	}


	.ticket_use_desc { 
		width:100%;
		font-weight:bold;
		line-height:30px;
		text-align:center;	
		display:block;

	}

	.ticket_use_desc .use_status {
		font-size:32px;	
	}

	.ticket_use_desc .in_use {
		color:#ff6666 !important;
	}




	.app_loading { 
		background-color:#ffffff;
		width:100%;
		height:100%;
		position:fixed;
		left:0px;
		top:0px;
		z-index:38000;
		display:none;
	}

	.app_loading .bg {
		width:120px;
		height:120px;;
		position:absolute;
/*		background-color:#000000;
		opacity:0.5;*/
		z-index:8001;
		left:50%;
		top:50%;
		margin-left:-55px;
		margin-top:-55px;
		border-radius:20px;
	}

	.app_loading .indicator {

		width:100px;
		height:100px;
		position:absolute;
		left:50%;
		top:50%;
		margin-left:-25px;
		margin-top:-38px;
		color:#333333;
		z-index:8002;

	}



	.lds-ring {
	  display: inline-block;
	  position: relative;
	  width: 64px;
	  height: 64px;
	}
	.lds-ring div {
	  box-sizing: border-box;
	  display: block;
	  position: absolute;
	  width: 51px;
	  height: 51px;
	  margin: 6px;
	  border: 6px solid #333;
	  border-radius: 50%;
	  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
	  border-color: #333 transparent transparent transparent;
	}
	.lds-ring div:nth-child(1) {
	  animation-delay: -0.45s;
	}
	.lds-ring div:nth-child(2) {
	  animation-delay: -0.3s;
	}
	.lds-ring div:nth-child(3) {
	  animation-delay: -0.15s;
	}
	@keyframes lds-ring {
	  0% {
		transform: rotate(0deg);
	  }
	  100% {
		transform: rotate(360deg);
	  }
	}





.term_info { 
	font-size:12px;
	text-align:center;
	padding:10px;
	background-color: #d80647;
	color:#ffffff;
}

.term_info span { 

}



.stayout_accept_btn {

	background-color:#d80647;
	color:#ffffff;
	border-radius:5px;
	padding:5px;
}

.stayout_reject_btn {
	background-color:#888888;
	color:#ffffff;
	border-radius:5px;
	padding:5px;
}

.roomcheck_accept_btn { 
	background-color:#d80647;
	color:#ffffff;
	border-radius:5px;
	padding:5px;
	
}



.search_window {
	position:fixed;
	width:100%;
	height:100%;
	left:0px;
	top:0px;
	box-sizing:border-box;
	display:none;

}

.search_window .blinder { 
	position:absolute;
	width:100%;
	height:100%;
	background-color:#000000;
	opacity:0.8;
	z-index:1000;
	box-sizing:border-box;

}

.search_window .search_contents {
	position:relative;
	padding:15px;
	z-index:2000;
	box-sizing:border-box;
}

.search_window .search_contents .myinfo {
	background-color:#ffffff;
		box-sizing:border-box;

}



.search_window .search_contents * {
	box-sizing:border-box;
}

.search_window input[type=text] , .search_window select {
	width:100%;
	height:32px;
	border:1px solid #eeeeee;
	font-size:11px;
}

.top_search_btn {
	text-align:center; border:1px solid #eeeeee; font-size:11px; padding:10px; background-color:#f2f2f2; 
}


.img-thumbnail { 
	border:5px solid #eeeeee;
	border-radius:5px;
}




.notification {
	list-style:none;
}

.notification li {
	margin:0px;
	padding:5px;
	font-size:12px;
	border:1px solid #eeeeee;
	background-color:#ffffff;
	color:#333333;
	font-weight:normal;
	border-radius:6px;
}

.notification li .remove {
	float:right;
	padding-right:5px;
}

.notification li .date {
	color:#aaaaaa;
	font-size:11px;

}	


.notification .readed {
	background-color:#cccccc;
}
.notification .readed .date {
	color:#888888;
}	

.notification .readed .noti_text {
	color:#888888;
}	
.notification .readed .noti_text strong {
	color:#888888;
}	




.notification .noti_text {
	font-weight:normal;
	color:#555555;
}

.notification .noti_text strong {
	font-weight:bold;
	font-size:14px !important;
	color:#333333;
}

.number_badge {

	background-color:#ffffff;
	color:#d80647;
	font-size:10px;
	border-radius:12px;
	width:20px;
	box-sizing:border-box;
	border:1px solid #d80647;
	text-align:center;
	height:20px;
	display:block;
	float:left;
	right:-12px;
	top:14px;
	position:absolute;
	
}


.login_form_tbl {
	width:100%;
}
.login_form_tbl td, .login_form_tbl th { 
	text-align:center;
	font-size:12px;
}
.repair_status_waiting{ 
	 background-color:#32ac63;
	 color:#ffffff !important;
}

.repair_status_process {
	 background-color:#32acff;
	 color:#ffffff !important;
}


.repair_status_proceed {
	 background-color:#eeeeee;
	 color:#666666 !important;
}

.repair_status {
	padding:4px;
	font-size:11px  !important;
	display:inline-block;
	border-radius:3px;
}




html,body,img {

 -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

 }










 	.mobile_pass { 
		position:fixed;
		top:0px;
		left:0px;
		width:100%;
		height:100%;
		z-index:20000;
	}

	.mobile_pass .bg { 
		width:100%;
		height:100%;
		z-index:20010;
		background-color:rgba(0,0,0, 0.3);
	}


	.mobile_pass .body {
		padding:24px;
		box-sizing:border-box;
		width:100%;
		height:100%;
		top:0px;
		left:0px;
		position:fixed;
	}	

	.mobile_pass .body .frame{
		background-color:#ffffff;
		border-radius:6px;
		width:100%;
		z-index:20020;
		overflow:hidden;
		box-sizing:border-box;
	}

	.mobile_pass .header { 
		display:block;
	}


	.mobile_pass .center_vertical { 
		max-width:320px;
		top:50%;
		position:absolute;
		width:90%;
		left:50%;
		transform: translate(-50%, -50%);
	}


	.mobile_pass .photo_zone {
		background-image:url('<?=$_app_url?>/res/img/img-popup-bg.png');
		background-repeat:no-repeat;
		background-position:50% 50%;
		width:100%;
		text-align:center;
	}

	.mobile_pass .photo_zone .photo {
		display:inline-block;
		border:3px solid #DFDCD5;
		width:115px;
		height:115px;
		background-color:#ffffff;
		border-radius:120px;
		margin-top:58px;
		padding:8px;
		box-sizing:border-box;
	}


	.mobile_pass .photo_zone .photo  img {
		width:100%;
		height:100%;
		border-radius:100%;
	}

	.photo_zone .name { 
		color:#275885;
		font-size:26px;
		margin-top:20px;
		display:inline-block;
		font-weight:bold;
	}


	.photo_zone .info1 { 
		margin-top:6px;
	}

	.photo_zone .info1 , .photo_zone .info2 {
		color:#333333;
		margin-top:6px;
		font-weight:bold;
		display:inline-block;
	}

	.mobile_pass .qr_zone { 
		width:100%;
		height:220px;
		background-color:#f1f1f1;
		border-top:1px dashed #b2b2b2;
		text-align:center;
	}

	.mobile_pass .qr_zone .zone_name {
		background-color:#3684C1;
		display:inline-block;
		color:#ffffff;
		font-size:14px;
		padding:6px;
		width:100px;
		border-bottom-left-radius:8px;
		border-bottom-right-radius:8px;
	}


.qr_frame {
	position:relative;
	border:0px none;
	width:100%;
}

.qr_frame1 {
  position:absolute;
  height:150px;
  width:150px;
  background-color:#f1f1f1;
  border:3px solid #A8A8A8;
  left:50%;
  margin-left:-75px;
  box-sizing:border-box;
}

.qr_frame2 {
  position:absolute;
  top:20px;
  left:-3px;
  height:104px;
  width:156px;
  background-color:#f1f1f1;
}


.qr_frame3 {
  position:absolute;
  top:-5px;
  left:20px;
  height:156px;
  width:104px;
  background-color:#f1f1f1;
}

.qr_frame img {
	position:absolute;
	top:10px;
	left:10px;
	width:125px;
	height:125px;

}















	.index_menu_frame {
		position:relative;
		width:160px;;
		text-align:center;
		height:160px;
		float:left;
		padding:8px;
		box-sizing:border-box;
		overflow:hidden;
		filter: drop-shadow(3px 3px 2px #dddddd);
	}
	.menu_item_frame { 
		background-color:#ffffff;
		width:100%;
		height:100%;
		overflow:hidden;
	}

	.menu_item { 
		display:inline-block;
		width:150px;
		padding:16px;
		height:150px;
		box-sizing:border-box;
		text-align:left;
		
		background-repeat: no-repeat;
		background-position:80px 70px;
	}

	.menu_item .color-highlight{
		height:4px;
		width:32px;
		background-color:#333333;
		margin-bottom:8px;
	}

	.menu_item .title {
		font-weight:bold;
		font-size:14px;
		color:#262626;
	}

	.menu_item .title small { 
		color:#8d8d8d;
		font-size:12px;
		font-weight:normal;
	}
	
	.menu_item img { 
		float:right;
		margin-top:12px;
	}

	.menu_list { 
		margin:0 auto;
		position:absolute;
		left:50%;
		width:320px;
		transform: translate(-50%, 0);
		padding-top:32px;
		z-index:1000;
	}



	.app_login_header { 
		height:56px;
		background-color:#ffffff;
		position:fixed;
		width:100%;
		top:0px;
		left:0px;
	}


	.app_login_header .right_menu_button {
		position: absolute;
		right: 16px;
		top: 15px;
		color: #333333;
		font-size: 24px;
	}

	.login_button { 
		background-color:#0D5289;
		width:82px;
		height:96px;
		padding-top:40px;
		font-size:15px;
		color:#ffffff;
		box-sizing:border-box;
		text-align:center;
		border-radius:6px;
	}

	.login_button:hover { 
		background-color:#969696;
	}

	.signin_form input[type=text], .signin_form input[type=password] {
		width:100%;
		height:46px;
		padding:3px;
		border:1px solid #eeeeee;
		padding-left:16px;
		padding-right:16px;
		border-radius:8px !important;
		box-sizing:border-box;
		margin-bottom:3px;
	}


	.login_footer { 
		width:100%;
		background-color:#c1c1c1;
		color:#333333;
		border-top:1px solid #a8a8a8;
		padding-top:6px;
		padding-bottom:6px;
		box-sizing:border-box;
		height:60px;
		position:absolute;
		bottom:0px;
	}


	.login_footer table {
		width:100%;
	}

	.login_footer td { 
		width:100%;
	}

	


.sing_in_box {
	padding:10px; position:relative; height:380px; position:absolute; top:50%; margin-top:-190px; width:100%; box-sizing:border-box;
}



	.fa-toggle-off {
		color:#dddddd;
	}

	.toggle_status { 
		position:absolute;
		right:8px;
		top:8px;
		width:75px !important;
		background-color:#eeeeee;
		height:24px !important;
		border-radius:12px;
		overflow:hidden;
	}


	.toggle_status .bg_color {
		width:100%;
		height:100%;
		z-index:100;
		background-color:#00cf00;
		opacity:0.0;
	}

	.toggle_status .ball_containner { 
		width:100%;
		height:100%;
		z-index:200;
	}

	.toggle_ball { 
		position:absolute;
		width:20px;
		height:20px;
		left:6px;
		top:2px;
		background-color:#ffffff;
		border-radius:22px;
		border-color:1px solid #cccccc;
	}


	.profile_area { 
		position:relative;
		width:100%;
	}

	.profile_area .profile_info {
		width:100%;
		height:200px;
		text-align:center;
		padding-top:24px;
		box-sizing:border-box;
	}

	.profile_area .profile_image {
		width:100px;
		height:100px;
		border-radius:144px;
		display:block;
		margin:0 auto;
		border:3px solid #DFDCD5;
		padding:8px;		
	}

	.profile_area .pic_area { 
		position:relative;
		width:100px;
		height:100px;
		box-sizing:border-box;
		background-color:#ffffff;
		border-radius:144px;
		overflow:hidden;
	}


	.profile_area .pic_area img {
		width:100px;
		height:100px;
	}


	.profile_info .name { 
		/*color: #275885;*/
		color:#555555;
		font-size: 26px;
		margin-top: 20px;
		display: inline-block;
		font-weight: bold;
	}

	.mypage_menu { 
		margin-top:36px;
	}







	.pincode_win { 
		display:block;
		position:fixed;
		top:56px;
		left:0px;
		width:100%;
		height:calc(100% - 56px);
		z-index:20001;
		background-color:#f2f2f2;
	}


	.input-view { 
		text-align:center;
		width:100%;
		padding-top:62px;
	}

	.input-view h2{
		text-align:center;
	}


	.password_view { 
		text-align:center;
		margin-top:12px;
	}

	.password_view .pass_icon { 
		list-style:none;
		background-color:#dddddd;
		width:18px;
		height:18px;
		border-radius:18px;
		display:inline-block;
	}


	.password_view .pass_icon_active { 
		background-color:#666666;
	}



	.password_keyboard { 
		width:100%;
		height:auto;
		overflow:hidden;
		position:absolute;
		bottom:0px;
		left:0px;
		background-color:#aaaaaa;
	}

	.password_keyboard .key { 
		width:25%;
		height:48px;
		background-color:#fcfcfc;
		border:1px solid #eeeeee;
		display:inline-block;
		float:left;
		box-sizing:border-box;
		text-align:center;
		padding-top:13px;
		font-size:14px;
		font-weight:bold;
		color:#555555;
	}


	.password_keyboard .key_blank {
		background-image:url('/app/res/img/disabled-logo.png');
		background-size:32px 32px;
		background-repeat:no-repeat;
		background-position:50% 6px;
	}