﻿/*************************************************************
* 768px以下用（タブレット縦用）
**************************************************************/
@media screen and (max-width:768px){
	.header-title{
		font-size: 1.2em;
	}
}
/*************************************************************
* 375px以下用（スマートフォン用）
**************************************************************/
@media screen and (max-width:375px){
	body{
		-webkit-text-size-adjust: 100%;
		font-size: 1.0em;
	}
	nav#gnav{display:none}
		.left_col, .right_col,footer .left_col, footer .right_col {
		float: left;
		width: 100%;
		margin:0!important
	}
	.left_col ul.list{
		margin-bottom:0!important
	}
	.right_col ul.list{
		margin-top:-1px;
		margin-bottom:1.5em
	}
	.right_col h3, .right_col h4{
		margin-top:1.1em!important
	}
	#page_content,#page_content2,#sidebar,#sidebar2,#page_info,#page_info2{
		margin: auto 0px;
		border-radius: 0px;
	}
	.leftimg,.rightimg {
		float: none;
		padding:0;
		text-align:center
	}
	img.rightimg{
		display:block;
		margin:auto
	}

	article {
		margin-left: 0px;
	}
	.filter {
		padding-left: 5px;
	}
	footer {
		font-size: 0.7em;
	}
	.header-logo{
		width: 60px;
	}
	.header-logo img{
		width: 60px;
	}
	.header-title{
		float: right;
		font-size: 0.5em;
		position: absolute;
		bottom: 40px;
		margin: 0 0 0 72px;
	}
	.header-syamei{
		width: 100px;
		margin: 10 10 0 72px;
	}
	.header-syamei img{
		width: 100px;
	}
	.edit_title {
		margin-left : 0px;
	}
	.graph {
		float: right;
		height: 181px;
		width: 330px;
		background: #FFFFFF;
		border-left: 1px solid #808080;
		border-bottom: 1px solid #808080;
		margin-top : 18px;
		margin-bottom : 0px;
		margin-left : 0px;
		margin-right : 0px;
	}
	.bar {
		float: left;
		text-align: center;
		position: relative;
		margin-left: 1px;
		width: 10px;
		background-image: linear-gradient(to bottom, #B2FEFA, #0ED2F7);
		border: 1px solid #0ED2F7;
	}
	.gondola_name {
		margin-top : 0px;
		margin-bottom : 10px;
		margin-left : 0px;
		margin-right : 0px;
	}
	.history_month{
		margin-left: 0px;
		float:left;
		width: 330px;
	}
	.history_m {
		width: 330px;
		font-weight: bold;
		color: #153d73;
		float: left;
		background: #FFFFFF;
	}
	.history_np {
		width: 330px;
		float: left;
		text-align: left;
		color: #153d73;
		background: #fff;
	}
	.safetydev_month {
		margin-left: 0px;
		background: #FFFFFF;
		width: 330px;
	}
	.safetydev_m {
		width: 330px;
		font-weight: bold;
		margin-bottom: 10px;
		color: #153d73;
		float: left;
		background: #fff;
	}
	.safetydev_np {
		width: 330px;
		text-align: left;
		color: #153d73;
		background: #fff;
	}
	.label {
		width: 58px;
		height: 24px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	#disp_gmap {
		height:	370px;
		margin-left : 5px;
		margin-right: 5px;
  	}
	#page_content {
		width: 100%;
	}
	.history_safetydev{
		width: 300px;
	}
	.pinexplan_area {
		display: inline;
	}
	.gondolalist_table_area {
		padding-left: 5px;
		width: 350px;
	}
	.gondolalist_table {
		display: block;
		overflow-x: scroll;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
	}
	.edit_table_area{
		height: auto;
		overflow-y: hidden;
	}
	.edit_table_area{
		height: auto;
		overflow-y: hidden;
	}
	#page_content3 {
		margin-left: 5px;
		padding-left: 5px;
		min-height: 850px;
	}
	.history {
		margin-left: 0px;
	}
	.history_np {
		text-align: left;
		padding-left: 10px;
		padding-right: 0px;
	}
	.gondola_name {
		margin-left : 10px;
	}
	#page_content4 {
		margin-left: 5px;
		padding-left: 0px;
	}
	.dataTables_length {
		padding-left: 5px;
	}
	.basic_info_area {
		display: inline;
	}
	.basic_info_l_side {
		width: 100%;
		float: none;
		margin-left: 10px;
	}
	.basic_info_r_side {
		width: 100%;
		float: none;
		margin-left: 10px;
	}
	.env_info_r_side {
		width: 100%;
		float: none;
		margin-left: 10px;
	}
	.gondola_savetydev_frame {
		margin-left: 0px;
		margin-bottom: 10px;
		padding: 1 1 1 1;
		width: 341px;
		height: auto;
		display: flex;
		border-radius: 5px;
	}
	.frame_green {
		border:1px solid lime;
	}
	.frame_bule {
		border:1px solid aqua;
	}
	.frame_orange {
		border:1px solid orange;
	}
	.frame_red {
		border:1px solid red;
	}
	.safetydev_table{
		width: 340px;
		font-size: 0.5em;
	}
	.batteryinfo{
		margin-left: 0px;
		margin-bottom: 10px;
		padding: 1 1 1 1;
		font-size: 0.5em;
	}
	.lampimg{
		width:30px;
		height:auto;
	}
	.safetydev_td_name1 {
		width: 20%;
	}
	.safetydev_td_name4 {
		width: 15%;
	}
	.safetydev_td_img {
		width: 10%;
	}
	#overlayWindow {
		width: 90%;
		height: 90%;
		margin: 10px auto;
		border: 2px solid #d7dce0;
		background-color: #ffffff;
		padding: 8px;
	}
	.gondolalist_title {
		margin-left: 0px;
	}
	#page_content3 {
		margin-top: 0px;
		padding-bottom: 10px;
	  }
	.gondolalist_table, .basicinfo, .history, .history_safetydev {
		font-size: 0.8em;	
	}
	.history_table_area {
		padding-left: 5px;
		width: 100%;
		height: auto;
	}
	.opehis_th1 {
		width: 100px;
	}
	.wrapper {
		width:98%;
	}
	.layerImage, .layerTransparent{
		height: auto;
	}
	.dataTables_length {
		text-align: left;
	}
	.colorbarimg {
		width: 25px;
                height: auto;
	}
	.env_info_area {
		display: inline;
	}
}

/*************************************************************
* 1024px 以下（タブレット横用）
**************************************************************/
@media screen and (max-width: 1024px){
	img.bg {
		left: 50%;
		margin-left: -512px;
	}
	.safetydev_td_name1 {
		width: 25%;
	}
	.safetydev_td_name4 {
		width: 15%;
	}
	.contactor_str:before  {
		content: "ｺﾝﾀｸﾀ異常";
	}
	.pendant_str:before  {
		content: "ﾍﾟﾝﾀﾞﾝﾄ異常";
	}
	.bisolock_str:before  {
		content: "ﾋﾞｿﾛｯｸ";
	}
	.ropeend_str:before  {
		content: "ﾛｰﾌﾟｴﾝﾄﾞ";
	}
	.denryuusen_str:before  {
		content: "電流ｾﾝｻ異常";
	}
	.batterypac_str:before  {
		content: "ﾊﾞｯﾃﾘｰﾊﾟｯｸ異常";
	}
	.winderprotect_str:before  {
		content: "ﾜｲﾝﾀﾞｰ保護";
	}
	.winderdisconn_str:before  {
		content: "ﾜｲﾝﾀﾞｰ未接続";
	}
}
