/**************/
/* RESPONSIVE */
/**************/


/* pc desktop */
@media screen and (min-width: 1025px) 
{
	.head-sys {position:absolute; top:5px; right:200px;}
	.head-sys-ver::after {content:'-m'; color:blueviolet;}

	.home-logon {width:auto; height:560px; display:flex; flex-direction:row-reverse;}	
	.home-logon-left {width:calc(100% - 600px);}

	.home-menu div.main {float:left; width:100%; padding:0px;}
	.home-menu div.top {float:left; width:100%; clear:both; padding-left:0px; padding-right:20px;}
	.home-menu div.left {float:left; width:33%; padding-left:0px; padding-right:20px;}
	.home-menu div.center {float:left; width:33%; clear:none; padding-left:0px; padding-right:20px;}
	.home-menu div.right {float:left; width:34%; clear:none; padding-left:0px; padding-right:20px;}
	.home-menu div.bottom {float:left; width:100%; clear:both; padding-left:20px; padding-right:20px;}

	.DXML-Navi {min-width:180px !important;}
	.DXML-Edit {width:79% !important;}

  div.wide-50 {width:50% !important;}
  div.wide-60 {width:60% !important;}
  div.wide-70 {width:70% !important;}
  div.wide-80 {width:80% !important;}
  div.wide-90 {width:90% !important;}
  div.wide-auto {width:auto !important;}
	div.flex-auto {display:inline-flex;}
}

/* phone (landscape) | tablet (portrait) */
@media screen and (min-width: 768px) and (max-width: 1024px) 
{
	.__head-sys {padding-top:0px; margin-right:10px;}
	.head-sys {position:absolute; top:5px; right:200px;}
	.head-sys-ver::after {content:'-t'; color:blueviolet;}

	.head-title b {font-size:30px !important;}
	.head-title i {font-size:22px !important;}

	.head-title-big {display:block;}
	.head-title-big.logged {display:none;}

	.head-title-low {display:none;}
	.head-title-low.logged {display:block;}

	.head-main {grid-template-columns: auto 0px 200px;}

	.home-logon {width:auto; height:560px; display:block;}
	.home-logon-left {width:100%; margin:0px;}
	.home-logon-right {width:100%; margin:0px;}
	.home-logon-right .TSPanel-Data {width:100%; float:left;}
	.home-logon-data {width:100%; padding:20px 0px 20px 0px !important;}
	.__home-logon-data {background-image:url('../logo.png'); background-position:99% 90%; __background-size:contain; background-size:30%; background-repeat:no-repeat;}
	
	.home-menu .TSPanel-Title {font-size:16px !important;}
	.home-menu .ESLink.command {font-size:14px !important;}

	.home-menu div.main {float:left; width:100%; padding:0px;}
	.home-menu div.top {float:left; width:100%; clear:both; padding-left:0px; padding-right:20px;}
	.home-menu div.left {float:left; width:50%; padding-left:0px; padding-right:20px;}
	.home-menu div.center {float:left; width:50%; clear:none; padding-left:0px; padding-right:20px;}
	.home-menu div.right {float:left; width:100%; clear:none; padding-left:0px; padding-right:20px;}
	.home-menu div.bottom {float:left; width:100%; clear:both; padding-left:0px; padding-right:20px;}

	.ESDataField.xl {width:100% !important;}
	.ESDataField.xl label {width:100% !important; text-align:left;}
	.ESDataField.xl .view {width:100% !important;}
	.ESDataField.xl .data {width:100% !important;}
	.ESDataField.xl .data label {width:auto !important; clear:none;}
	.ESDataField.xl .data input {width:100% !important;}
	.ESDataField.xl .data select {width:100% !important;}
	.ESDataField.xl .data textarea {width:100% !important;}

	.DXML-Admin {top:65px;}
	.DXML-Navi {min-width:180px !important;}
	.DXML-Navi.data {min-height:0px !important;}
	.DXML-Edit {width:96% !important;}
	.DXML-Curr.menu .pnl-body .back-card {display:none;}

  div.wide-50 {width:50% !important;}
  div.wide-60 {width:60% !important;}
  div.wide-70 {width:70% !important;}
  div.wide-80 {width:80% !important;}
  div.wide-90 {width:90% !important;}
  div.wide-auto {width:auto !important;}
	div.flex-auto {display:inline-flex;}
}

/* phone (portrait) */
@media screen and (min-width: 0px) and (max-width: 767px) 
{	
	.debug-info .head-debug {position:static; __top:75px; __right:10px;}

	.head-admin {display:none;}

	.head-top {height:auto;}
	.head-sys {padding-top:0px; margin-right:10px; position:absolute; top:5px; right:10px;}
	.head-sys-ver::after {content:'-p'; color:blueviolet;}

	.head {__max-height:150px;}

	.head-title b {font-size:24px !important;}
	.head-title i {font-size:18px !important;}

	.head-title-big {display:block;}
	.head-title-big.logged {display:none;}

	.head-title-low {display:none;}
	.head-title-low.logged {display:block; font-size:30px !important;}
		
	.head-main {display:block;}
	.head-center {__display:none;}
	.head-right {display:none;}

	.head-data {width:100%; display:block; padding:10px 10px 10px 10px;}
	.head-user {width:auto;}
	.head-pass {padding-top:10px;}

	.head-button {height:28px !important; width:28px !important;}
  .head-button.cmd-captcha {height:24px !important; width:auto !important; float:left !important;}
  .head-button.cmd-temporary {height:24px !important; width:auto !important; float:left !important;}

	.head-button-menu button {height:30px !important; width:30px !important;}

	.home {padding-left:10px; padding-top:10px;}
	.home .ESInfoSummary {margin:0px;}

	.home-logon {margin-left:0px; margin-right:0px; width:auto; height:560px; display:block;}
	.home-logon-left {width:100%; margin:0px; display:none;}
	.home-logon-right {width:100%; margin:0px;}
	.home-logon-right .TSPanel-Data {width:100%; float:left;}
	.home-logon-data {width:100%; padding:20px 0px 20px 20px !important;}
	.home-logon-data {background-image:none;}
	.home-logon-data .ESDataField-Edit {height:22px; font-size:14px;}
		
	.head-logon-input {width:100%;}
	.head-logon-input .ESDataField input {font-size:13pt !important;}
	.head-logon-input .ESDataField.user {width:80% !important;}
	.head-logon-input .ESDataField.pass {width:80% !important;}
	.head-logon-input .ESLink {float:right;}

	.head-data .ESDataField.head-prof {width:100% !important;}
	.head-data .ESDataField.head-prof select {font-size:13pt !important;}
	.head-data .ESDataField.head-comp .view {padding-left:0px; padding-top:5px;}
	
	.home-logon-menu {width:100%;}

	.gray-blur I {font-size:16px !important;}
	.gray-blur B {font-size:12px !important;}

	.ESPanel.exp-menu.navi {width:100% !important; margin-bottom:0px !important;}
	.ESPanel.exp-menu.navi .pnl-body {}

	.home-menu {}
	.home-menu .ESPanel .title {font-size:16px !important;}
	.home-menu .ESLink.command {font-size:15px !important;}

	.home-menu div.main {float:left; width:100%; padding:0px;}
	.home-menu div.main H2 {font-size:16px;}

	.home-menu div.top {float:left; width:100%; clear:both; padding-left:2px !important; padding-right:2px !important;}
	.home-menu div.left {float:left; width:100%; padding-left:2px !important; padding-right:2px !important;}
	.home-menu div.center {float:left; width:100%; clear:none; padding-left:2px !important; padding-right:2px !important;}
	.home-menu div.right {float:left; width:100%; clear:none; padding-left:2px !important; padding-right:2px !important;}
	.home-menu div.bottom {float:left; width:100%; clear:both; padding-left:2px !important; padding-right:2px !important;}

	.home-menu .pnl-body a.ESLink.icon-menu {margin-left:5px !important;}

	.home-menu .news-panel {float:left; padding:0px; width:100%; min-width:300px;}
	.home-menu .news-head IMG {max-width:250px !important;}

	.ESDataField label {clear:left;}
	.__ESDataField .data input, .__ESDataField .data select, .__ESDataField .data textarea {font-size:3.2vw !important;}

	.ESDataField .__check {width: 20px !important;}
	.ESDataField .__check input {width: 20px !important;}

	.DXML-Admin {top:60px; right:10px;}
	.DXML-Head .menu .head {height:auto;}
	.DXML-Head .toolbar .icon-text label {display:none;}

	.DXML-Work {min-width:180px !important; width:100% !important;}
	.DXML-Work.data {min-height:0px !important;}
	.DXML-Work.data div {float:left !important;}
	.DXML-Work.data .ESLink-Command {width:auto !important;}
	
	.DXML-Head {width:100% !important; padding:10px 2px 10px 2px;}
	.DXML-Main {width:100% !important; padding:10px 2px 10px 2px;}
  .DXML-Main section {display:block;}
  .DXML-Main section .column {padding-right:0px;}

	.DXML-Curr .menu .pnl-body .back-card {display:none;}

	.ESDataField.xs {width:100% !important;}
	.ESDataField.xs LABEL {width:100% !important; text-align:left;}
	.ESDataField.xs .view {width:100% !important;}
	.ESDataField.xs .data {width:100% !important;}
	.ESDataField.xs .data LABEL {width:auto !important; clear:none;}
	.ESDataField.xs .data INPUT, .ESDataField.xs .data SELECT, .ESDataField.xs .data TEXTAREA {width:100% !important;}
	.ESDataField.xs .images {float:right; position:relative; top:-36px;}
	.ESDataField.xs .ESDataField-FindBox INPUT {width:90% !important;}
	.ESDataField.xs .ESDataField-FileBox .mask {width:90% !important;}
	.ESDataField.xs .ESDataField-FileBox .TSFileInfo-ImageLink IMG {float:left; position:relative; top:0px !important;}
	.ESDataField.xs .ESDataField-FileBox .TSFileInfo-ImageClear IMG {float:left; position:relative; top:0px !important;}
	.ESDataField.xs .ESDataField-PathBox INPUT {width:90% !important;}
	.ESDataField.xs .ESDataField-FindBox TEXTAREA,INPUT {width:90% !important;}
	.ESDataField.xs .ESDataField-View {width:100% !important;}
	.ESDataField.xs .ESDataField-View SPAN {width:100% !important;}

	.ESDataField.xm {width:100% !important;}
	.ESDataField.xm LABEL {width:100% !important; text-align:left;}
	.ESDataField.xm .view {width:100% !important;}
	.ESDataField.xm .data {width:100% !important;}
	.ESDataField.xm .data LABEL {width:auto !important; clear:none;}
	.ESDataField.xm .data LABEL.mask {width:100% !important;}
	.ESDataField.xm .data TEXTAREA, .ESDataField.xm .data INPUT, .ESDataField.xm .data SELECT {width:100% !important;}
	.ESDataField.xm .images {float:right; position:relative; top:-20px;}
	.ESDataField.xm .ESDataField-FindBox INPUT {width:90% !important;}
	.ESDataField.xm .ESDataField-FileBox .mask {width:90% !important;}
	.ESDataField.xm .ESDataField-FileBox .TSFileInfo-ImageLink IMG {float:left; position:relative; top:0px !important;}
	.ESDataField.xm .ESDataField-FileBox .TSFileInfo-ImageClear IMG {float:left; position:relative; top:0px !important;}
	.ESDataField.xm .ESDataField-PathBox INPUT {width:90% !important;}
	.ESDataField.xm .ESDataField-FindBox TEXTAREA {width:90% !important;}
	.ESDataField.xm .ESDataField-View {width:100% !important;}
	.ESDataField.xm .ESDataField-View SPAN {width:100% !important;}

	.ESDataField.xl {width:100% !important;}
	.ESDataField.xl LABEL {width:100% !important; text-align:left;}
	.ESDataField.xl .view {width:100% !important;}
	.ESDataField.xl .view SPAN {width:auto !important;}
	.ESDataField.xl .data {width:100% !important;}
	.ESDataField.xl .data LABEL {width:auto !important; clear:none;}
	.ESDataField.xm .data LABEL.mask {width:100% !important;}
	.ESDataField.xl .data INPUT {width:100% !important;}
	.ESDataField.xl .data SELECT {width:100% !important;}
	.ESDataField.xl .data TEXTAREA {width:100% !important;}
	.ESDataField.xl .images {float:right; position:relative; top:-20px;}
	.ESDataField.xl .ESDataField-FileBox .mask {width:90% !important;}
	.ESDataField.xl .ESDataField-FileBox .mask {width:90% !important;}
	.ESDataField.xl .ESDataField-FileBox .TSFileInfo-ImageLink IMG {float:left; position:relative; top:0px !important;}
	.ESDataField.xl .ESDataField-FileBox .TSFileInfo-ImageClear IMG {float:left; position:relative; top:0px !important;}
	.ESDataField.xl .ESDataField-PathBox INPUT {width:90% !important;}
	.ESDataField.xl .ESDataField-FindBox TEXTAREA {width:90% !important;}
	.ESDataField.xl .ESDataField-FindBox INPUT {width: 90% !important;}
	.ESDataField.xl .ESDataField-View {width:100% !important;}
	.ESDataField.xl .ESDataField-View SPAN {width:100% !important;}

	.bsm-service-top {display:list-item !important; width:100%;}

  div.wide-50 {width:100% !important;}
  div.wide-60 {width:100% !important;}
  div.wide-70 {width:100% !important;}
  div.wide-80 {width:100% !important;}
  div.wide-90 {width:100% !important;}
  div.wide-auto {width:100% !important;}
	div.flex-auto {display:flow;}

	.phone-hidden {display:none !important;}

	.ESLink.tab.svg-text label {display:none !important;}
}

/* print */
@media print
{
	.DXML-Navi {display:none !important;}
	.DXML-Edit {width:99% !important;}

	.ESLink.command {display:none !important;}

	.no-print {display:none !important;}
}