@charset "UTF-8";
* {
	font-size:100%;
	line-height:1.6;
	margin:0px;
	padding:0px;
	list-style:none;
	outline: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	text-align: center;
	width: 100%;
	margin:0px auto;
	color: #666;
	/*font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
	font-family:  "M PLUS 1p",-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 1rem;
}

img {
	border:none;
}
h1{
    width: 100%;
    text-align: left;
    color:#666;
    font-weight: 500;
}
h2{
    width: 100%;
    text-align: left;
    color: #666;
    font-weight: 500;
}
/*ページ全体のリンク指定*/
a {
	outline: none;
	opacity: 1;
	-webkit-transition: opacity 0.2s ease-in-out;
	transition: opacity 0.2s ease-in-out; 
}
a:hover {
	opacity: 0.5;
	
}
a{/*リンクされた文字*/
    font-style:normal;
}
a:link {/*未訪問のリンク*/
    font-style:normal;
}
a:visited {/*訪問後のリンク*/
    font-style:normal;
}
a:hover {/*マウスをのせたとき*/
    font-style:normal;
}

hr {
  border:none;
  border-top:dashed 1px #b3dbea;
  height:1px;
  color:#000000;
  margin: 5px 0;
}

input {
    vertical-align: top;
    margin: 5px;
}

label{
	padding: 1px;
    margin: 0px;
    vertical-align: middle;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: nowrap;
}

label:hover{
	color:#ff6633;
	vertical-align:middle ;
}

input.text,
input.password,
input.email{
	ime-mode: auto;
    height: 1.6em;
    padding: 15px ;
    border: solid 0.5px #666;
    vertical-align: middle;
    border-radius: 1em;
    width: 100%;
    margin: 0px auto;
}
input.text:hover,
input.password:hover,
input.email:hover{
	background:#e4f2ff;
    border: solid 0.5px #333;
}
input.month{
	ime-mode:auto;
	height: 1.6em;
	background:#eeffff;
	padding: 15px 5px ;
	border:#cccccc groove;
	vertical-align:middle ;
	margin: 0px auto;
}
input.file {
   height: 2.5em;
   padding: 5px 5px ;
   vertical-align:middle ;
   width: 80%;
}

input.image {
   margin:5px;
}

input.button {
    height: 2em;
    padding: 4px 5px;
    border: solid 0.5px #989898;
    vertical-align: middle;
    border-radius: 1em;
    width: 100%;
    margin: 16px auto 0;
    background: #989898;
    color: #FFF;
}
input.button:disabled {
	color:#B2B2B2;
	background: #FFF;
	border: solid 0.5px #B2B2B2;
}
input.button:hover {
    opacity: 0.6;
}
input.button_up {
    height: 2em;
    background:#eeeeee;
    padding: 0px 20px;
    margin: 20px 10px;
}
input.button_up:hover {
    opacity: 0.6;
}
input:disabled {
	background: #ccc;
}
select {
   height: 2em;
   background:#eeffff;
   border:#cccccc groove;
   vertical-align:middle ;
}

textarea {
   background:#eeffff;
   padding: 0px 5px ;
   border:#cccccc groove;
   width: 80%;
   height: 150px;
}
@media screen and (max-width: 768px) {
    input.text,
    input.password,
    input.email,
    textarea{
        width:100%;
        margin:3px auto;
    }
}

#retirement,
#teinen{
	background: #FFF;
	width:80px;
}
input#retirement:disabled,
input#teinen:disabled  {
	background: #ccc;
	
}
.subtext{
	padding:5px;
}
.clear { clear:both; }  
.clear hr { display:none; } 

.w30px {width:30px; margin: 0px auto;}
.w60px {width:60px; margin: 0px auto;}
.w90px {width:90px; margin: 0px auto;}
.w150px {width:150px; margin: 0px auto;}
.w200px {width:200px; margin: 0px auto;}
.w300px {width:300px; margin: 0px auto;}
.w330px {width:330px; margin: 0px auto;}

.w10percent {width:10%; margin: 0px auto;}
.w20percent {width:20%; margin: 0px auto;}
.w30percent {width:30%; margin: 0px auto;}
.w40percent {width:40%; margin: 0px auto;}
.w50percent {width:50%; margin: 0px auto;}
.w60percent {width:60%; margin: 0px auto;}
.w70percent {width:70%; margin: 0px auto;}
.w80percent {width:80%; margin: 0px auto;}
.w90percent {width:90%; margin: 0px auto;}
.w100percent {width:100%; margin: 0px auto;}

.bg_red{background: #ff0000;}
.bg_blue{background: #00ffff;}
.bg_lightblue{background: #aaffff;}
.bg_green{background: #55ff55;}
.bg_yellow{background: #FFFF00;}
.bg_orange{background: #fcbc5c;}
.bg_daidai{background: #ff9900;}
.bg_pink{background: #ff99ff;}
.bg_mura{background: #9999ff;}
.bg_gunjyo{background: #ee9999;}

.font_red{color: #ff0000;}
.font_blue{color: #0000ff;}
.font_lightblue{color: #aaffff;}
.font_green{color: #55ff55;}
.font_yellow{color: #FFFF00;}
.font_orange{color: #fcbc5c;}
.font_daidai{color: #ff9900;}
.font_pink{color: #ff99ff;}
.font_mura{color: #9999ff;}
.font_gunjyo{color: #ee9999;}

.padding_5{
	padding:5px;
}
.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    z-index: 1000000;
}

.scroll_x_100{
	width:100%;
	height:auto;
	overflow-x: auto;
	white-space: nowrap;
	overflow-scrolling: touch;
	-webkit-overflow-scrolling: touch;
}

.scroll_x_100::-webkit-scrollbar{/* Chrome */
    display:none;
}
.scroll_y_100{
	width:100%;
	height:auto;
	overflow-y: scroll;
	overflow-x: unset;
	-ms-overflow-style:none;/* IE */
	overflow-y: -moz-scrollbars-none;/* firefox */
	display: inline-block;
	_display: inline;
	vertical-align: middle;
}

.scroll_y_100::-webkit-scrollbar{/* Chrome */
    display:none;
}
.centerdiv{
    width: fit-content;
    height: auto;
    margin: auto;
    display: block;
}
.next_msg{
	width:100%;
	color:#1500ff;
}
.errmsg{
    display: block;
    padding-left:5px;
    width: 100%;
    color: #f44336;
    text-align: right;
}
.err_area,
.entryleft_end{
    width: 100%;
    max-width: 320px;
    margin: 10px auto;
    display: block;
}
.err_area h2,
.entryleft_end h2{
    font-size: 1.5em;
    background: #c9dde0;
}

/*ヘッダー*/
#header{
	width: 100%;
    padding: 15px 0;
    margin: 30px auto 0;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    flex-wrap: wrap;
}
@media screen and (max-width: 767px){
	#header {
	    padding: 5px 0;
	    margin: 0 auto;
	}
}

.header_inner{
	width: 98%;
    max-width: 1024px;
    margin: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    flex-wrap: wrap;
}
.header_left{
	width:120px;
	border-bottom: 1px solid #989898;
}
.header_left .logo{
	width: 100%;
    margin: auto;
    padding: 5px;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
.header_left .logo img{
	width:100%;
	margin-bottom: 3px;
}
.header_right{
	width:calc(100% - 120px);
	position: relative;
    padding: 5px;
    margin: 0px;
    vertical-align: middle;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    flex-wrap: wrap;
    border-bottom: 1px solid #989898;
}
.header_right .main_sub_title {
    font-size: 0.9em;
    color: #989898;
}
.header_sub{
	padding-left:1em;
}

.header_title{
	position: relative;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
.header_title_left{
	display: inline-block;
	padding-right:2em;
	border-right:1px #999 solid;
}
.header_title_left .main_title,
.header_title_left .main_sub_title{
	text-align: left;
}
.header_title_right{
	display: inline-block;
	padding-left:1em;
}
.header_title_right .main_title,
.header_title_right .main_sub_title{
	text-align: right;
}
#pankuzu{
	display: inline-block;
}
.pankuzu{
	font-size:0.9em;
}
.pankuzuin{
	display: inline-block;
}
.pankuzuin a{
	color:#666;
	width:100%;
}
.pankuzuin a span{
	white-space: nowrap;
}
@media screen and (max-width: 767px) {
    .header_left{
        width:20%;
    }
    .header_right{
        width:80%;
        -webkit-justify-content: flex-end;
    	justify-content: flex-end;
    }
    .header_right .header_sub{
    	order:2;
    	width: 100%;
    	text-align: right;
	}
	.header_right .header_title{
    	order:1;
    	width: 100%;
	}
	.header_right .header_title .header_title_area{
    	width:calc(100% - 71px);
    	text-align: right;
	}
	.header_right .header_title .header_title_area .main_title{
    	font-size: 0.8em;
	}
	.pankuzu{
		font-size: 0.6em;
	}
}
/*コンテンツ*/
.main_title,
.cont_title,
.foot_title{
	font-size:1.5em;
	color:#666666;
}
.main_sub_title,
.cont_sub_title,
.foot_sub_title{
	font-size:0.9em;
	color:#666666;
}

#wrap{
	width:100%;
	height: auto;
}

section{
    width:100%;
}

#con{
	position: relative;
	width: 100%;
    height: 100vh;
}
.con_inner{
	position: absolute;
	top: calc(50% - 70px);
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
#con #section_1{
	width:100%;
	max-width:600px;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-align-items: stretch;
    align-items: stretch;
    flex-wrap: wrap;
}
.logo_head{
	width:100%;
	height: 100%;
	text-align: left;
}
.logo_head img{
	width: 110px;
    height: auto;
}

.form_area{
    max-width:450px;
    border-left:1px solid #B2B2B2;
    padding-left: 2em;
    margin-left: 3em;
}
@media screen and (max-width: 768px) {
	.header_right .main_sub_title {
	    font-size: 0.5em;
	}
	.form_area{
	    max-width:100%;
	    padding-left: 1em;
	    margin-left:1em;
	}
	.con_inner{
		width: 90%;
	    margin: auto;
	    display: block;
	    top: 0;
	    left: 0;
	    position: static;
	    transform: translate(0, 0);
	    -webkit-transform: translate(0, 0);
	}
}
.form_area #form{
	margin:30px 0;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: stretch;
    align-items: stretch;
    flex-wrap: wrap;
}
.input_title{
	width:7em;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-self: center;
    align-self: center;
    flex-wrap: wrap;
}
.input_title p{
    margin:0;
    width: 7em;
    text-align: left;
}
.input_title span{
	font-size:0.7em;
	margin:0;
	color:#B2B2B2;
}
.input_area{
    width: calc(100% - 7em);
    margin: 10px 0;
}

.login_area{
    width: 100%;
    max-width: 400px;
    margin: 10px auto;
    border: #333 1px solid;
    padding: 10px;
}
.top_msg{
    width:100%;
    margin:0 auto;
    padding: 10px;
    text-align: left;
    font-weight: 600;
}
/* 事業所選択 */
#office{
	display:block;
	width: 98%;
    height:auto;
    max-width: 1024px;
    margin: auto;
    padding: 0 0 40px;
    border-bottom: 1px solid #989898;
}
#office .office_inner{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
#office #section_1{
	width:70%;
	position: relative;
}
.map_img{
	text-align: left;
	height: 100%;
}
.map_img img{
	width: 100%;
    height: 100%;
    max-width: 500px;
}
#office #section_1 .area_data_link{
	position: absolute;
    right: 5%;
    bottom: 30px;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 60%;
    text-align: left;
}
#office #section_1 .area_data_link:before{
	content: "";
    width: 0;
    height: 0;
    border-left: 10px solid #2ca6e0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    margin-top: 12px;
    margin-right: 12px;
}
#office .office_inner #section_1 .area_select{
	height:auto;;
	transform: translateY(0);
    transition: transform .2s;
    visibility: visible;
    display:block;
    color:#666;
}
.area_data_link .area_data_left{
	width:calc(40% - 24px);
	border-right:1px solid #989898;
	text-align: left;
}
.area_data_link .area_data_left .area_left_main,
.area_data_link .area_data_right .area_right_main{
	font-size: 1em;
}
.area_data_link .area_data_right .area_right_main{
	margin-left:10px;
}
.area_data_link .area_data_left .area_left_sub{
	font-size: 0.9em;
	color:#989898;
}
.area_data_link .area_data_right{
	width:60%;
}
#office #section_2{
	width: 30%;
    height: 330px;
    overflow-y: scroll;
}
#office .area_list li{
    width:100%;
    color:#989898;
    text-align: left;
}
#office .area_list li.area_select{
    color:#666;
    font-weight: 600;
}
#office .area_list li a{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    width:100%;
    padding: 5px 0;
}
#office .area_list .area_title{
	font-size: 1em;
    width: 100%;
    text-align: left;
}
#office .area_list .area_title:hover{
	color:#333;
}
#office .area_list .area_sub{
	font-size:1em;
	border-left:1px solid #9898;
	width:40%;
	line-height: 1;
	padding-left: 15px;
    text-align: left;
}
@media screen and (max-width: 767px){
	#office #section_1,
	#office #section_2{
		width:100%;
		padding:0 5px;
	}
	#office #section_1{
		order:2;
	}
	#office #section_2{
		order:1;
	}
	#office #section_1 .area_data_link {
	    width: 100%;
	    right: auto;
	    bottom: -34px;
	    -webkit-justify-content: flex-end;
	    justify-content: flex-end;
	}
	.area_data_link .area_data_left{
		width:calc(40% - 24px);
	}
	.area_data_link .area_data_left .area_left_main,
	.area_data_link .area_data_right .area_right_main{
		font-size: 1em;
	}
}
/* フロアタブ */
.floor_tab_area ul{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: stretch;
    justify-content: stretch;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: nowrap;
}
.floor_tab_area li{
	width: 100%;
	padding:10px 0 0;
	font-size: 2em;
    color: #989898;
	border-top:0;
	border-left:0;
	border-bottom:1px solid #989898;
	border-right:0;
	cursor: pointer;
	border-collapse: collapse;
}
.floor_tab_area li hr{
	width: 100%;
	padding: 0;
    margin: -1px 0;
	border:0px;
}
.floor_tab_area li:hover{
	color: #323333;
	padding:0;
	margin: 0 -0.5px;
	border-top:1px solid #989898;
	border-bottom:1px solid #989898;
	position: relative;
}
.floor_tab_area li:hover:before{
	content: "";
    position: absolute;
    background: #989898;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
}
.floor_tab_area li:hover:after{
	content: "";
    position: absolute;
    background: #989898;
    top: 0;
    right:0;
    width: 1px;
    height: 100%;
}
.floor_tab_area li:hover hr{
	width: 100%;
	padding:0;
	margin:0;
	border:4px solid #B3B3B3;
}
.floor_tab_area li:active hr{
	width: 100%;
	padding:0;
	margin:0;
	border:4px solid #C4B898;
}
.floor_tab_area li.now_floor{
	color: #323333;
	padding:0;
	border-top:1px solid #989898;
	border-bottom:1px solid #FFFFFF;
	position: relative;
}
.floor_tab_area li.now_floor:before{
	content: "";
    position: absolute;
    background: #989898;
    top: 0;
    left: 0;
    width: 1px;
    height: calc(100% + 1px);
}
.floor_tab_area li.now_floor:after{
	content: "";
    position: absolute;
    background: #989898;
    top: 0;
    right:0;
    width: 1px;
    height: calc(100% + 1px);
}
.floor_tab_area li.now_floor hr{
	width: 100%;
	padding:0;
	margin:0;
	border:4px solid #585757;
	background: #585757;
}
@media screen and (max-width: 767px){
	.floor_tab_area li{
		font-size: 1.2em;
	}
}
/* フロアページ */
#premises{
	display:block;
	width: 98%;
    height:auto;
    max-width: 1024px;
    margin: auto;
    padding: 0;
}
#premises #section_1{
	width:100%;
	position: relative;
}
#premises #section_2{
	width:100%;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    
}
#premises #section_2 .premises_inner{
	width: 4%;
    margin: 0;
    display: inline-block;
    position: absolute;
    text-align: left;
    
}
#premises #section_2 .premises_inner a{
	position: relative;
	opacity: 1;
	display: block;
}
#premises #section_2 .premises_inner a:hover{
	opacity: 1;
}
#premises #section_2 .premises_inner img{
	width:100%;
	height:auto;
	visibility: hidden;
	vertical-align: top;
}
#premises #section_2 .premises_inner img:hover{
	visibility: visible;
}
#premises #section_2 .premises_inner .builmark{
	position: absolute;
    font-size: 10px;
    color: #FFF;
    padding: 5px 0px;
    border-radius: 50%;
    z-index: 3;
    text-align: center;
    width: 26px;
    height: 26px;
}
#premises #section_2 .premises_inner .builmark:hover{
	filter: brightness(1.5);
}

.premises_inner .builmark:hover + .builimg{
	visibility: visible !important;
}
#premises .premises_map {
    width:60%;
    margin-right: 40px;
    position: relative;
}
#premises .premises_map img{
	width:100%;
	height:auto;
}
@media screen and (max-width: 767px){
	#premises .premises_map {
	    width:100%;
	    margin-right: 0px;
	}

}
/*
#floor .floor_map_outer{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    width:100%;
    height:100%;
}
#floor .floor_map_inner{
	height:100%;
}
#floor .floor_map_inner a{
	height:100%;
	display:block;
	position: relative;
}
.floor_map .floor_inner{
	margin: 50px auto;
	display: none;
}
.floor_map .now_floor{
	display:block;
}
.floor_map_entrance{
	width:100%;
}
#floor #section_2 .floor_map img{
	width: 60%;
    height: auto;
    margin-right: 5%;
}
.floor_map .floorarea_b{
	display:block;
	position: absolute;
    border-radius: 20px;
    padding: 3px 25px;
    color: #FFFFFF;
    font-weight: 600;
    width: 90%;
    max-width: 130px;
    top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}
@media screen and (max-width: 767px){
	#floor #section_2 .floor_map{
		width:90%;
	}
}
@media screen and (max-width: 440px){
	.floor_map .floorarea_b{
		font-size:0.8em;
		padding: 3px 10px;
	}
}
*/
/* フロアエリア */
#floorarea{
	display:block;
	width: 98%;
    height:auto;
    max-width: 1024px;
    margin: auto;
    padding: 0;
}
#floorarea .office_inner{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
#floorarea #section_1{
	width:100%;
	position: relative;
}
#floorarea #section_2{
	width:100%;
	position: relative;
	border-left:1px solid #989898;
	border-bottom:1px solid #989898;
	border-right:1px solid #989898;
}

.floorarea_inner{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
#act_inner{
	
}
.area_inner .area_left{
    width:40%;
}
#floorarea_inner #act_inner .area_left .area_left_inner{
	width:70%;
	margin:auto;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
.area_foot{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    width:100%;
}
.area_foot .area_foot_left{
	position: relative;
}
.area_foot .area_foot_left::before{
	content:"";
    position: absolute;
    left: -13px;
    top: 7px;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid #2B6BAC;
    border-left: 2px solid #2B6BAC;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.area_foot .area_foot_right{
	position: relative;
}
.area_foot .area_foot_right::after{
    content:"";
    position: absolute;
    right: -13px;
    top: 7px;
    width: 10px;
    height: 10px;
    border-top: 2px solid #2B6BAC;
    border-right: 2px solid #2B6BAC;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#floorarea_inner #act_inner .area_right{
	width:60%;
	margin:20px 0;
	position: relative;
	min-height:300px;
}
#floorarea_inner #act_inner .area_right img{
	width:100%;
}
#floorarea_inner #act_inner .area_name{
	width: 100%;
    height: 300px;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: left;
    justify-content: left;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
    padding: 20px 0;
}

#floorarea_inner #act_inner .area_name span{
    border-radius: 20px;
    padding: 3px 25px;
    color: #FFFFFF;
    font-size:1.5em;
    display: block;
    width: 70%;
}
#floorarea_inner #act_inner .area_stats{
	font-size: 1.5em;
    width: 100%;
    margin: 10px 0 0 30px;
    text-align: left;
}
#floorarea_inner #act_inner .floor_inner{
	display:none;
	margin: auto;
}
#floorarea_inner #act_inner .now_floor{
	display:block;
}
#floorarea_inner #act_inner .now_floorarea{
	display:block;
}
#floorarea_inner #act_inner .area_right_inner{
	position: relative;
	margin: 30px;
}
#floorarea_inner #act_inner .area_right_box{
	padding: 5px 0 55px;
	display:none;
}
.area_right .load_box {
	position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    width: 50px;
    display: block;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
#floorarea_inner #act_inner .area_right_box_inner{
	width: 49%;
    margin: auto 30% auto 21%;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-evenly;
    justify-content: space-evenly;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: center;
    align-content: center;
    flex-wrap: wrap;
}
#floorarea_inner #act_inner .area_right_box_container{
	width: calc(50% - 4px);
    margin: 2px;
    border: 1px solid #B3B3B3;
    background: #F6F8F8;
    -webkit-transition: background 0.2s ease-in-out;
    transition: background 0.2s ease-in-out;
}
#floorarea_inner #act_inner .area_right_box_container:hover{
	background: #d6e7ff;
	-webkit-transition: background 0.2s ease-in-out;
    transition: background 0.2s ease-in-out;
}
#floorarea_inner #act_inner .area_right_box_container a{
	display:block;
	padding: 10px 7px 20px;
	position: relative;
	width: 100%;
}
#floorarea_inner #act_inner .area_right_box_container .container_title{
	text-align: right;
    font-size: 0.5em;
    font-weight: 600;
    color: #221714;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 80%;
}
#floorarea_inner #act_inner .area_right_box_container .container_value{
	text-align: left;
	width:100%;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: center;
    align-content: center;
    flex-wrap: wrap;
    margin: 10px 0;
    padding-left: 5px;
}
#floorarea_inner #act_inner .area_right_box_container .container_value .container_maru{
	display: inline-block;
}
.container_maru .maru{
	border: 4px solid #333;
    display: block;
    width: 1.8em;
    height: 1.8em;
    border-radius: 20px;
    margin: 0 5px 0 0;
}
#floorarea_inner #act_inner .area_right_box_container .container_value .container_num{
	text-align: left;
    font-size:1.8em;
    color: #221714;
    font-weight: 600;
}
#floorarea_inner #act_inner .area_right_box_container .container_value .container_num .small{
	font-size:0.5em;
	font-weight: 500;
	color: #989898;
	padding-left: 3px;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub{
	text-align: left;
	width:100%;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: center;
    align-content: center;
    flex-wrap: wrap;
    height: 30px;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub > div{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: center;
    align-content: center;
    flex-wrap: wrap;
    width:80%;
    text-align: left;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub > div img{
	width: calc(30% - 10px);
    margin: 0 5px;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub .container_sub_left img{
	width: calc(30% - 5px);
    margin: 0 5px 0 0;
    max-width: 20px;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub .container_sub_center img{
	width: calc(30% - 5px);
    margin: 0 5px 0 0;
    max-width: 20px;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub .container_sub_right img{
	width: calc(33% - 5px);
    margin: 0 5px 0 0;
    max-width: 23px;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub > div div{
	width: 67%;
	font-size: 10px;
	line-height: 0.6;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub > div .small{
	font-size: 10px;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub .container_sub_text .bold{
	font-weight: 600;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub .container_sub_left{
	width: calc(33.33% - 6px);
    margin-right: 6px;
    border-right: 1px solid #989898;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub .container_sub_center{
	width: calc(33.33% - 6px);
    margin-right: 6px;
    border-right: 1px solid #989898;
}
#floorarea_inner #act_inner .area_right_box_container .container_sub .container_sub_right{
	width: calc(33.33% - 6px);
    margin-right: 6px;
}
.container_maru .maru.maru_green{
	border: 4px solid #87B828;
}
.container_maru .maru.maru_yellow{
	border: 4px solid #F3D823;
}
.container_maru .maru.maru_orange{
	border: 4px solid #E89112;
}
.container_maru .maru.maru_red{
	border: 4px solid #D61518;
}
@media screen and (max-width: 767px){
	#floorarea_inner #act_inner .area_name {
	    height: auto;
	    -webkit-justify-content: center;
	    justify-content: center;
	    padding: 15px 3px 0;
	}
	#floorarea_inner #act_inner .area_name span {
	    padding: 3px 9px;
	    font-size: 1em;
	    display: block;
	    width: 45%;
	    margin: 5px auto;
	}
	#floorarea_inner #act_inner .area_stats {
	    font-size: 1em;
	    width: 45%;
	    margin: 5px auto;
	    text-align: center;
	}
	#floorarea_inner #act_inner .area_left .area_left_inner {
	    width: 100%;
	    margin: auto;
	}
	
	#floorarea_inner #act_inner .area_right {
	    width: 100%;
	    margin: 5px auto;
	}
	#floorarea_inner #act_inner .area_right_inner {
	    margin: 0 auto;
	    width: 90%;
	}
	#floorarea_inner #act_inner .area_right_box_inner{
		width:100%;
		margin: auto;
	}
	#floorarea_inner #act_inner .area_right_box_container {
	    /*width: 100%;*/
	}
	#floorarea_inner #act_inner .area_right_box_container .container_value .container_num {
	    font-size: 1.3em;
	}
	.container_maru .maru {
	    width: 1.3em;
	    height: 1.3em;
	}
	.area_inner .area_left,
	.area_inner .area_right {
	    width: 100%;
	}
	.area_inner .area_name {
	    width: 100%;
	    height: auto;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-justify-content: left;
	    justify-content: center;
	    -webkit-align-items: flex-start;
	    align-items: flex-start;
	    -webkit-align-content: flex-start;
	    align-content: flex-start;
	    flex-wrap: wrap;
	    padding: 20px 0;
	}
	.area_stats {
	    margin: 10px auto;
	    text-align: center;
	}
	.area_inner .area_foot {
	    -webkit-justify-content: center;
	    justify-content: center;
	}
	.area_inner .area_right {
	    width: 100%;
	    margin: 20px auto;
	}
	.area_right_inner {
	    margin: 20px auto;
	}
	.area_right_box_container {
	    width: calc(100% - 4px);
	}
	.area_right_box_container .container_value {
	    margin: 10px 0;
	}
	.area_right_box_container .container_sub > div div {
	    font-size: 1em;
	}
}

@media screen and (max-width: 414px) {
	#floorarea_inner #act_inner .area_right_box_container {
	    /*width: 100%;*/
	}
}
/* グラフエリア */
#graph{
	display:block;
	width: 98%;
    height:auto;
    max-width: 1024px;
    margin: auto;
    padding: 0;
}
#graph .office_inner{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
#graph #section_1{
	width:100%;
	position: relative;
}
#graph #section_2{
	width:100%;
	position: relative;
	border-left:1px solid #989898;
	border-bottom:1px solid #989898;
	border-right:1px solid #989898;
}
.grapharea_inner .flexbox{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
}
.graph_inner #act_inner{
	
}
.graph_inner #act_inner .floor_graph_inner{
	display:none;
	margin: auto;
}
.graph_inner #act_inner .floor_inner{
	display:none;
	margin: auto;
}
.graph_inner #act_inner .now_floor{
	display:block;
}
.graph_inner #act_inner .area_left{
    width:20%;
}
.graph_inner #act_inner .area_right{
	width:72%;
	padding: 20px 10px;
}
.graph_inner #act_inner .area_left .area_left_inner{
	width:95%;
	height: 40vw;
    max-height: 450px;
    min-height: 390px;
	margin: 30px auto 20px;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: space-between;
    align-content: space-between;
    flex-wrap: wrap;
}
.area_th,
.area_hr{
	width:100%;
}
.graph_inner #act_inner .area_name{
	width: 90%;
	text-align: left;
}
.graph_inner #act_inner .area_title{
	font-size: 1.5em;
	font-weight:600;
    width: 100%;
    margin: 0 auto;
    text-align: left;
}
.graph_inner #act_inner .area_stats{
	font-size: 1.2em;
	font-weight:600;
    width: 100%;
    margin: 15px auto 0;
    text-align: left;
}
.graph_inner #act_inner .area_stats_sub{
	font-size: 0.5em;
    width: 100%;
    margin: 0 auto 10px;
    text-align: left;
}
.graph_box{
	position: relative;
	min-height: 200px;
}
.graph_chart{
	display:none;
}
.graph_chart .load_box {
	position: absolute;
    content: "";
    top: 30%;
    left: 50%;
    width: 50px;
    min-height:200px;
    display: block;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
.load_box img{
	width:100%;
	height:auto;
}
.area_stats_temp,
.area_stats_rh,
.area_stats_ppm{
	text-align: left;
}
.area_stats_temp span,
.area_stats_rh span,
.area_stats_ppm span{
	text-align: left;
	display: inline-block;
	font-size:0.5em;
	font-weight:600;
	vertical-align: middle;
}
.stats_hr{
	width:30%;
}
.area_stats_temp hr,
.area_stats_rh hr,
.area_stats_ppm hr{
	width:80%;
}
.area_stats_temp hr{
	border:2px solid #30A0D2;
}
.area_stats_rh hr{
	border:2px solid #86BC43;
}
.area_stats_ppm hr{
	border:2px solid #EB76A1;
}
.area_stats_ppm .stats_hr_c1 hr{border:2px solid #5B9595;}
.area_stats_ppm .stats_hr_c2 hr{border:2px solid #A0C29C;}
.area_stats_ppm .stats_hr_c3 hr{border:2px solid #9CBB46;}
.area_stats_ppm .stats_hr_c4 hr{border:2px solid #DAECDA;}

.graph_inner #act_inner .area_foot{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    margin: 25px 0 0;
    padding: 10px 0 0 12px;
    border-top: 1px solid #989898;
}
.grapharea_inner{
	
}
.area_slick {
    overflow: hidden;
}
.grapharea_inner.now_floor{
	display:block;
}
.graph_foot{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    font-size:0.8em;
}
.hourday{
	width:60%;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}
.graph_time,
.graph_day,
.graph_floor{
	border: 1px solid #323333;
    border-radius: 20px;
    padding: 5px 10px;
    margin: 10px;
    cursor: pointer;
}
.graph_time.activ,
.graph_day.activ,
.graph_floor.activ{
	color: #FFF;
    background: #585757;
    pointer-events: none;
}
.graph_time:hover,
.graph_day:hover,
.graph_floor:hover{
	border: 1px solid #989898;
    border-radius: 20px;
    padding: 5px 10px;
    margin: 10px;
    color: #FFF;
    background: #989898;
}
.graph_b_title{
	font-weight:600;
}
@media screen and (max-width: 767px){
	.graph_inner #act_inner .area_left {
	    width: 100%;
	}
	.graph_inner #act_inner .area_right {
	    width: 90%;
	    padding: 20px 10px;
	}
	.graph_inner #act_inner .area_left .area_left_inner {
	    width: 100%;
	    height: auto;
	    max-height: none;
	    min-height: auto;
	    margin: 0 auto;
    }
    .area_stats_temp, .area_stats_rh, .area_stats_ppm {
	    width: 100%;
	}
	.hourday {
	    width: 100%;
	    -webkit-justify-content: center;
	    justify-content: center;
	}
	.graph_foot {
	    -webkit-justify-content: center;
	    justify-content: center;
	}
	.area_th,
	.area_hr{
		width: 50%;
	}
	.graph_inner #act_inner .area_foot {
	    margin: 0 10px;;
	}
	.graph_time, .graph_day, .graph_floor {
	    width: 100%;
	}
}
/* パーツ */
#nice-tooltip-instance {
	position:absolute;
	z-index:9999;
	padding:10px 20px;
	border:1px solid #b3c9ce;
	border-radius:4px;
	color:#333;
	background:#fff;
	max-width:250px;
	box-shadow:3px 3px 3px rgba(0,0,0,.3);
}
#load {
	display:none;
	width:40px;
	line-height: 2;
}
#load img{
	margin:5px auto 0;
	width:30px;
}
.lazyload, .lazyloading {
	opacity: 0;
	visibility: visible
} 
.lazyloaded {
	opacity: 1;
	visibility: visible
	transition: opacity 1s;
}
/*フッター*/
#footer{
	width:100%;
	padding: 15px 5px;
	margin: auto;
}
.footer_inner{
	width: 98%;
    max-width: 1024px;
    display:block;
    margin:auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    
}
.foot_title_area{
	width:40%;
	text-align: left;
	padding-top: 20px;
}
.foot_sub_area{
	width:60%;
	text-align: right;
	-webkit-align-self: flex-end;
	align-self: flex-end;
}
.footer_inner .main_title{
	text-align: right;
}
.foot_sub_area .ber_area{
	display: block;
    margin: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-align-items: end;
    align-items: end;
    flex-wrap: wrap;
    position: relative;
}
.foot_sub_area .ber_area .floorarea_bar{
	display: inline-block;
	width: calc(54% - 46px);
}
.foot_sub_area .ber_area .info{
	display: inline-block;
    padding: 3px 16px;
    border: 1px solid #323333;
    border-radius: 5px;
    color: #323333;
    font-weight: 600;
    font-size: 20px;
    margin-left:5px;
    cursor: pointer;
}
.foot_sub_area .ber_area .info:hover{
	background:#bbb;
}
.foot_sub_area .ber_area .info.hover{
	background:#bbb;
}
.tooltip_outer{
	visibility: hidden;
	display:block;
	position: absolute;
    right: 0;
    bottom: 110%;
    width:100%;
    z-index: 1;
}

.foot_sub_area .ber_area .tooltip{
	border: 1px solid #323333;
    border-radius: 5px;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    width:calc(100% - 2px);
    margin-left:2px;
    padding: 15px;
    background:#FFF;
}
.foot_sub_area .ber_area .tooltip_left{
	width:25%;
	height:100%;
	text-align:left;
	margin: 10px 0;
}
.foot_sub_area .ber_area .tooltip_right{
	width: 75%;
    text-align: left;
    padding-left: 14px;
    margin: 10px 0;
    border-left: 1px solid #989898;
    font-size: 11px;
}
@media screen and (max-width: 767px) {
	.foot_title_area,
	.foot_sub_area{
		width:100%;
		text-align: left;
	}
	.foot_title_area{
		order:2;
	}
	.foot_sub_area{
		order:1;
	}
}
/*その他*/
.swiper-button-prev,
.swiper-button-next {
	width: 35px;
	height: 35px;
	background-size: 35px 35px;
	transform: translateY(-50%);
	margin-top: 0;
	opacity: 0.7;
}

/* 次ページボタンのスタイル */
.swiper-button-next {
	background-image: url('../img/a_right.png');
	right: 3px;
}

/* 前ページボタンのスタイル */
.swiper-button-prev {
	background-image: url('../img/a_left.png');
	left: 3px;
}
.swiper-button-prev:after,
.swiper-button-next:after {
	display: none;
}
.display_none{
    height:0;
    transform: translateY(-100%);
    transition: transform .2s;
    visibility: hidden;
    display:none;
}
.display_block{
	height:auto;;
	transform: translateY(0);
    transition: transform .2s;
    visibility: visible;
    display:block;
}
.pc {
  display: block; 
}
.sm {
  display: none; 
}

@media screen and (max-width: 768px) {
  .pc {
    display: none; 
  }

  .sm {
    display: block; 
  } 
}

/* グラフ関連 */
.highcharts-series-label {
    display: none;
}