@CHARSET "UTF-8";

html{
	overflow: hidden;
}
@media only screen and (max-width: 1024px) {

	body{
		min-width: 320px;
		padding: 0px;
		margin: 0px;
		font-family: "wf_SegoeUI","Segoe UI","Segoe","Segoe WP","Tahoma","Verdana","Arial","sans-serif";
		overflow-y: hidden;
		overflow-x: hidden;
	}

/************************Common************************************/
	.clr{
		clear: both;
	}
	.left{
		float: left;
	}
	.right{
		float: right;
	}

	#close_right_btn,
	#close_element_btn,
	#close_left_btn{
		height: 25px;
		width: 25px;
		cursor: pointer;
		float: right;
		margin-top:8px;
		margin-right: 6%;
		z-index: 3;
		background-image: url('./img/close.png');
		background-repeat: no-repeat;
	}

	.deco_h{
		width: 100%;
		height: 14px;
		background-image: url('./img/deco_h.png');
	}

/**********************TOP HEADER********************************/
	#header_area,
	#left_area,
	#right_area,
	#footer_area{
		position: absolute;
		filter: alpha(opacity=90);
		-moz-opacity:0.90;
		opacity:0.90;
		z-index: 2;
		background-color: #F6F9FE;
	}

	#header_area{
		width: 100%;
		height: 100px;
		border-bottom: 1px solid silver;
		background-color: #212e3c;
		color: white;
		font-size: 14px;
		min-width: 320px;
	}
	#pbar_area{
		position: absolute;
		filter: alpha(opacity=90);
		-moz-opacity:0.90;
		opacity:0.90;
		z-index: 2;
		background-color: #F6F9FE;
		display: none;
		width: 100%;
		height: 5px;
		display: block;
		background-color: #212e3c;
		border-bottom: 1px solid #C4C3C2;
	}
	#pbar{
		width: 0%;
		height: 5px;
		background-color: #55E1FC;
		position: absolute;
		top: 0px;
		left: 0px;
		z-index: 2;
	}

	#backbtn{
		float:left;
		width:15%;
		height:49px;
		background-image: url('./img/backtbn.png');
		background-repeat: no-repeat;
		background-position: center;
		background-size: auto 28px;
		cursor: pointer;
	}

	#parent_logo{
		float:left;
		width: 70%;
		height: 49px;
		background-image: url('./img/logo.png');
		background-repeat: no-repeat;
		background-position: center;
	}

	#logo{
		width: 45%;
		height: 49px;
		margin:0 auto;
		cursor: pointer;
	}

	#menu_btn{
		float:left;
		width:15%;
		height:49px;
		background-image: url('./img/menu.png');
		background-repeat: no-repeat;
		background-position: center;
		background-size: auto 28px;
		cursor: pointer;
	}

	#pbar_area{
		clear:both;
		width: 100%;
		background-color: #212e3c;
		border-bottom: 1px solid #C4C3C2;
	}
	.parent_headermenu{
		width: 100%;
		height: 49px;
		background-color: #212e3c;
		border-bottom: 1px solid #C2D0DF;
	}
	.parent_stationlist{
        float:left;
        width:25%;
        height:49px;
        padding-left:2%;
        line-height:49px;
	}

	#stationlist{
		cursor: pointer;
	}

	#stationlist font{
		float:left;
		font-size: 11px;
	}

	#stationlist span{
		float:left;
		width:10px;
		height:49px;
		background-image: url('./img/downarrow.png');
		background-repeat: no-repeat;
		background-position: center;
		background-size: 10px 10px;
		cursor: pointer;
	}

	#parent_elementlist{
		float:left;
		width:46%;
		height:49px;
		background-repeat: no-repeat;
		background-position: center;
		background-size: auto 30px;
	}
	#elementlist{
		width:46%;
		height:49px;
		cursor: pointer;
		margin:0 auto;
	}

	#elementlist span{
		float:right;
		width:30%;
		height:49px;
		background-image: url('./img/downarrow.png');
		background-repeat: no-repeat;
		background-position: left;
		background-size: 10px 10px;
		cursor: pointer;
	}

	#viewlist{
		float:left;
		width:26%;
		height:49px;
		line-height:49px;
		margin-right:1%;
		cursor: pointer;
	}

	#viewlist font{
		float:right;
		font-size: 11px;
	}

	#viewlist span{
		float:right;
		width:10px;
		height:49px;
		background-image: url('./img/downarrow.png');
		background-repeat: no-repeat;
		background-position: center;
		background-size: 10px 10px;
		cursor: pointer;
	}

	/********************map**********************/
	#content,#map-canvas{
		float: left;
		width: 100%;
		z-index: 1;
	}
	#content{
		overflow: hidden;
	}

	/****************TOP MENU**************************/

	#topmenu_area{
		position: absolute;
		top:50px;
		filter: alpha(opacity=90);
		-moz-opacity:0.90;
		opacity:0.99;
		z-index: 21;
		background-color: #F6F9FE;
		overflow-x:scroll;
		display: none;
	}

	.languages_box{
		width: 100%;
		height: 30px;
	}
	#languages_inner_right {
		float: right;
		margin-top: 3px;
		margin-right: 5px;
		width: auto;
		height: 22px;
		overflow: hidden;
		font-size: 15px;
	}
	#nf_jp{
		background-image: url('../../css/img/national_flag_jp.gif?q=1');
		background-repeat: no-repeat;
		height: 20px;
		width: 32px;
		cursor: pointer;
	}
	#nf_jp:AFTER{
		content: 'jp';
		margin-left: 10px;
	}
	#nf_en{
		background-image: url('../../css/img/national_flag_en.gif?q=1');
		background-repeat: no-repeat;
		height: 20px;
		width: 32px;
		cursor: pointer;
	}
	#nf_en:AFTER{
		content: 'en';
		margin-left: 7px;
	}

	#menu{
		padding-top: 5px;
		float: right;
		width: 100%;
		height: auto;;
		text-align: left;
		font-size: 12px;
		border-left: 1px solid silver;
		background-color: #212e3c;
		color: white;
	}

	#login_btns{
		margin-top: 8px;
	}
	#login_btns, #info_btns{
		width: 100%;
		height: 36px;
		margin-bottom: 8px;
	}
	#login_btns #username{
		width: 65%;
		height: 36px;
		line-height: 36px;
		float: left;
		cursor: default;
		margin-left: 5px;
		overflow: hidden;
		display: block;
		font-size:18px;
	}

	#login_btns #btn_login{
		background-image: url('./img/login.png');
		background-repeat: no-repeat;
		background-position: right;
		width: 110px;
		height: 18px;
		float: right;
		margin-top: 10px;
		background-size: contain;
	}
	#login_btns #btn_logout{
		background-image: url('./img/logout.png');
		background-repeat: no-repeat;
		background-position: right;
		float: right;
		width: 110px;
		height: 18px;
		float: right;
		margin-top: 10px;
		background-size: contain;
	}
	#info_btns #i_warning{
		background-image: url('../../css/img/i_warning.png');
		width: 18px;
		height: 18px;
		cursor: default;
		margin-left: -23px;
		margin-top: 1px;
		display: none;
		background-repeat: no-repeat;
	}
	#info_btns #btn_info{
		background-image: url('./img/ja/m_info.png');
		background-repeat: no-repeat;
		background-position: right;
		background-size: contain;
		width: 180px;
		height: 18px;
		cursor: pointer;
		display: table;
		float: right;
	}
	#header_area #menu #setting_btn{
		background-image: url('../../css/img/ja/m_setting.png');
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100% 100%;
		width: 100%;
		height: 55px;
		cursor: pointer;
		display: table;
		margin-top: 15px;
		margin-bottom: 5px;
	}

	#menu_setting{
		width: 100%;
		background-color: #30465e;
		color: white;
		font-size: 18px;
		line-height: 40px;
		padding-top: 25px;
	}
	#menu_setting div{
		margin-left: 65px;
	}
	#menu_setting #m_login_setting{
		margin-left: 65px;
	}
	#menu_setting #m_manual{
		margin-left: 65px;
	}
	#menu_setting label, #auto_load,#marker_type,#marker_view{
		cursor: pointer;
	}
	#auto_load,#marker_view,#marker_type{
		width: 18px;
		height: 18px;
	}


	/********************element menu*******************/
	#element_area{
		position:absolute;
		top:50px;
		filter: alpha(opacity=90);
		-moz-opacity:0.90;
		opacity:0.99;
		z-index: 3;
		background-color: #212e3c;
		display: none;
	}

	#element_list{
		width: 100%;
		height:100%;
	}
	#element_list_inner{
		float: left;
		width: 100%;
		height:100%;
		overflow: hidden;
		display: none;
	}
	#element_list_inner_right{
		float: left;
		margin-top: 10px;
		display: none;
	}

	#element_list .el{
		width: 25%;
		height: 60px;
		padding: 15px 0px;
		float: left;
		text-align: center;
		display: none;
	}
	#element_list .el input{
		cursor: pointer;
	}
	#element_list .el label div{
		width: 100%;
		background-repeat: no-repeat;
		background-position: center;
	}

	#el_at1{background-image: url('../../css/img/ja/el_at1.png'); height: 41px; width: 26px;}
	#el_rh1{background-image: url('../../css/img/ja/el_rh1.png'); height: 41px; width: 26px;}
	#el_prs_sea{background-image: url('../../css/img/ja/el_prs_sea.png'); height: 41px; width: 26px;}
	#el_wns-wnd{background-image: url('../../css/img/ja/el_wns-wnd.png'); height: 41px; width: 26px;}
	#el_sun{background-image: url('../../css/img/ja/el_sun.png'); height: 41px; width: 26px;}
	#el_sol{background-image: url('../../css/img/ja/el_sol.png'); height: 41px; width: 26px;}
	#el_wet{background-image: url('../../css/img/ja/el_wet.png'); height: 41px; width: 26px;}
	#el_raf{background-image: url('../../css/img/ja/el_raf.png'); height: 41px; width: 26px;}
	#el_raf_hour{background-image: url('../../css/img/ja/el_raf2.png'); height: 41px; width: 26px;}
	#el_dra{background-image: url('../../css/img/ja/el_dra.png'); height: 41px; width: 33px;}
	#el_ri1{background-image: url('../../css/img/ja/el_pct.png'); height: 41px; width: 44px;}
	#el_co2{background-image: url('../../css/img/ja/el_co2.png'); height: 41px; width: 26px;}
	#el_era{background-image: url('../../css/img/ja/el_era.png'); height: 41px; width: 45px;}
	#el_cra{background-image: url('../../css/img/ja/el_cra.png'); height: 41px; width: 44px;}
	#el_snd-snf{background-image: url('../../css/img/ja/el_snd-snf.png'); height: 41px; width: 33px;}
	#el_wlv-wlc{background-image: url('../../css/img/ja/el_wlv-wlc.png'); height: 41px; width: 41px;}
	#el_wbgt{background-image: url('../../css/img/ja/el_wbgt.png'); height: 41px; width: 46px;}
	#el_weather{background-image: url('../../css/img/ja/el_weather.png'); height: 41px; width: 35px;}
	#el_at1-wns{background-image: url('../../css/img/ja/el_at1-wns.png'); height: 41px; width: 41px;}
	#el_prs_sea-wns{background-image: url('../../css/img/ja/el_prs_sea-wns.png'); height: 41px; width: 41px;}
	#el_at1-rh1{background-image: url('../../css/img/ja/el_at1-rh1.png'); height: 41px; width: 49px;}
	#el_rad{background-image: url('../../css/img/ja/el_radiation.png'); height: 41px; width: 41px;}
	#el_cam{background-image: url('../../css/img/ja/el_cam.png'); height: 41px; width: 32px;}
	#el_swi{background-image: url('../../css/img/ja/el_swi.png'); height: 41px; width: 35px;}
	#el_ehd{background-image: url('../../css/img/ja/el_ehd.png'); height: 41px; width: 44px;}

	#el_at1_disabled{background-image: url('../../css/img/ja/el_at1_disabled.png'); height: 41px; width: 26px;}
	#el_rh1_disabled{background-image: url('../../css/img/ja/el_rh1_disabled.png'); height: 41px; width: 26px;}
	#el_prs_sea_disabled{background-image: url('../../css/img/ja/el_prs_sea_disabled.png'); height: 41px; width: 26px;}
	#el_sun_disabled{background-image: url('../../css/img/ja/el_sun_disabled.png'); height: 41px; width: 26px;}
	#el_sol_disabled{background-image: url('../../css/img/ja/el_sol_disabled.png'); height: 41px; width: 26px;}
	#el_wet_disabled{background-image: url('../../css/img/ja/el_wet_disabled.png'); height: 41px; width: 26px;}
	#el_wbgt_disabled{background-image: url('../../css/img/ja/el_wbgt_disabled.png'); height: 41px; width: 46px;}
	#el_snd-snf_disabled{background-image: url('../../css/img/ja/el_snd-snf_disabled.png'); height: 41px; width: 33px;}
	#el_wlv-wlc_disabled{background-image: url('../../css/img/ja/el_wlv-wlc_disabled.png'); height: 41px; width: 41px;}



	/****************表示形式選択**************************/
	#right_area{
		position: absolute;
		top:50px;
		filter: alpha(opacity=90);
		-moz-opacity:0.90;
		opacity:0.99;
		z-index: 3;
		background-color: #F6F9FE;
		display: none;
	}

	.view_hr{
		background-color: #add2ff;
		height: 1px;
		width: 100%;
		margin-top: 5px;
		margin-bottom: 7px;
	}
	#view_select_area{
		padding: 2%;
		width: 92%;
		margin-left: 4%;
		overflow-x: hidden;
		font-size: 13px;
		overflow-y: auto;
	}
	#view_select_area .title{
		margin-bottom: 0px;
		font-weight: bold;
		font-size: 15px;
		height: 20px;
	}

	#view_select_area .view_checked,
	#view_select_area .view_unchecked{
		height: 30px;
		padding-left: 35px;
		background-repeat: no-repeat;
		background-position: 0px 3px;
		display: table;
		cursor: pointer;
	}
	#view_select_area .view_checked img,
	#view_select_area .view_unchecked img{
		margin-top: 10px;
	}
	#view_select_area .view_checked{
		background-image: url(../../css/img/view_checked.png);
	}
	#view_select_area .view_unchecked{
		background-image: url(../../css/img/view_unchecked.png);
	}

	/************************観測点一覧****************************/
	#left_area{
		display: none;
		top:49px;
		z-index: 4;
	}

	#station_top{
		width:100%;
		height: 50px;
		background-color: #31435b;
		filter: alpha(opacity=90);
		-moz-opacity:0.9;
		opacity:0.9;
	}
	#station_top .left_search{
		width: 65%;
		margin-left: 5%;
		margin-top: 12px;
		height: 22px;
	}
	#station_top #search{
		background-color: #70838f;
		border: 0px none;
		color: white;
		width: 100%;
		height: 22px;
	}

	#station_top .left_btn_search{
		display: table;
		width: 10%;
		height: 24px;
		margin-top: 12px;
	}
	#station_top #btn_search{
		cursor: pointer;
		background-image: url(./img/search.png);
		width: 32px;
		height: 24px;
	}

	.left_close_left_btn{
		width: 15%;
		height: 24px;
		margin-top: 4px;
	}

	#station_area{
		padding: 0px;
		width: 100%;
		background-color: white;
	}
	#station_area #station_tab{
		width: 100%;
		cursor: pointer;
		display: table;
		border: 1px solid #add2ff;
		background-color: #C6C6C6;
	}
	#station_tab #tab_list,
	#station_tab #tab_tree{
		width: 50%;
		height: 43px;
		background-color: #EAEFF4;
		color:#3BA8FD;
		text-align: center;
		line-height: 43px;
		font-size: 12px;
		font-weight:bold;
		position: relative;
	}
    #station_tab #tab_list{
	    background-color: #EAEFF4;
        color:#3BA8FD;
	}
	#view_select_area #btn_info,
	#station_tab #tab_list_refresh{
		width: 87px;
		margin: 5px;
		height: 25px;
		float: right;
		line-height: 24px;
		border: 1px solid #767676;
		text-align: center;
		border-radius: 3px;
		background-color: #EFEFEF;
		font-size: 11px;
	}
	#view_select_area #btn_info{
		float: none;
	}
	.tablist_font{
        width: 100%;
        height: 20px;
	}
	#station_tab #tab_tree{
        background-color: white;
        color:#3BA8FD;
	}
	.tablist_arrow,
	.tabtree_arrow{
		float:left;
		width: 100%;
		height: 6px;
		position: absolute;
		left: 0;
		top: 34px;
		color:#3BA8FD;
	}
	.tablist_arrow:after,
	.tabtree_arrow:after  {
		content: "";
		border-left: 2px solid;
		border-top: 2px solid;
		transition: all 1s;
		width: 6px;
		height: 6px;
		display: inline-block;
		margin-left: 0.5rem;
		-webkit-transform-origin: 25% 25%;
		-webkit-transform: rotate(-135deg);
		transform-origin: 25% 25%;
		transform: rotateX(0deg) rotateZ(-135deg);
	}
	#station_list, #station_tree{
		overflow-x: scroll;
		overflow-y: scroll;
		width: 97%;
		margin-left:3%;
		font-size: 13px;
	}

	#station_list .station{
		line-height: 20px;
		width: 100%;
		cursor: pointer;
		white-space: nowrap;
	}
	#station_list .station:hover{
		background-color: silver;
	}

	#station_tree{
		display: none;
	}

	#btn_allcheckoff{
		font-size: 12px;
		width: 100%;
		height: 18px;
		margin-top:  0px;
		text-align: center;
		vertical-align: middle;
		cursor: pointer;
		color: white;
		background-color: #4169E1;
	}

	#river_station_area{
		width: 100%;
		background-color: white;
	}
	#river_station_area #river_station_tab{
		width: 100%;
		display: table;
		border-top: 1px solid #add2ff;
		border-bottom: 1px solid #add2ff;
	}
	#river_station_tab #river_tab_list{
		width: 100%;
		height: 43px;
		text-align: center;
		line-height: 43px;
		float: left;
		font-size: 12px;
		font-weight: bold;
		position: relative;
	}
	#river_station_tab #river_tab_tree{
		background-image: url(./img/ja/s_tree.png);
		width: 99px;
		height: 43px;
		float: left;
	}
	#river_station_list, #river_station_tree{
		overflow-x: scroll;
		overflow-y: scroll;
		width: 189px;
		padding: 5px;
		font-size: 12px;
	}

	#river_station_list .station{
		line-height: 20px;
		width: 175px;
		white-space: nowrap;
	}
	#river_station_list label{
		cursor: pointer;
	}
	#river_station_list .station:hover{
		background-color: silver;
	}

	#river_station_tree{
		display: none;
	}

	/**************************login_setting********************************/

		/*ログイン時地図設定*/
	#login_setting_area_2{
		margin: 0 auto;
		position: absolute;
		z-index: 5;
		font-size: 14px;
		display: none;
		overflow-x: auto;
	}

	#login_setting_area_2 #title{
		width: 100%;
		height: 15%;
		background-color: #47627F;
		background-image: url(./img/ja/login_setting_ttl.png);
		background-position: 50% 65%;
		background-repeat: no-repeat;
		border-bottom: 2px solid white;
	}
	#login_setting_area_2 #main{
		width: 100%;
		height: 82%;
		background-color: #47627F;
		text-align: center;
	}
	#login_setting_area_2 .selecter_radio{
		float:left;
		width: 50%;
		padding-top: 3%;
		padding-bottom: 3%;
		color: white;
	}
	/* 最終操作位置 */
	#login_setting_area_2 #rad_login_marker_last_location{
		float: left;
		width: 100%;
		margin-left: 20px;
		margin-top: 3px;
		width: 14px;
		height: 14px;
	}
	#login_setting_area_2 #lbl_login_marker_last_location{
		float: left;
		margin-left: 5px;
		text-align: left;
		width: 70%;
		font-size: 14px;
		font-family: "Arial";
	}
	/* 指定観測点 */
	#login_setting_area_2 #rad_login_marker_specified_obs{
		float: left;
		margin-left: 20px;
		margin-top: 3px;
		width: 14px;
		height: 14px;
	}
	#login_setting_area_2 #lbl_login_marker_specified_obs{
		float: left;
		margin-left: 5px;
		text-align: left;
		width: 70%;
		font-size: 14px;
		font-family: "Arial";
	}
	/* 観測点名リスト */
	#login_setting_area_2 #st_listbox{
		float: left;
		margin-left: 20px;
		width: 86%;
		height: 40%;
		border: 1px solid white;
		overflow-y: scroll;
		overflow-x: auto;
	}
	#login_setting_area_2 #st_listbox #st_table{
		width: 100%;
		height: 100%;
		text-align: left;
		color: black;
		background-color: white;
		font-size: 14px;
		font-family: "Arial";
	}

	#login_setting_area_2 #buttons{
		margin: 0 auto;
		width: 100%;
	}
	#login_setting_area_2 #btnSet{
		background-image: url(./img/ja/set_btn.png);
		background-position: 65% 50%;
		background-repeat: no-repeat;
		width: 50%;
		height: 36px;
		margin-top: 3%;
		display: table;
		cursor: pointer;
		float: left;
	}
	#login_setting_area_2 #btnCancel{
		background-image: url(./img/ja/cancel_btn.png);
		background-position: 35% 50%;
		background-repeat: no-repeat;
		width: 50%;
		height: 36px;
		margin-top: 3%;
		display: table;
		cursor: pointer;
		float: left;
	}
	.st_tbl_odd {
		background-color: #AFEEEE;
	}
	.st_tbl_even {
		background-color: #FFFFFF;
	}
	#login_setting_area_2 #st_listbox #st_table tr:hover{
		background-color: #6090EF;
	}

	/*********************#information_area************************/
	/*インフォメーション*/
	#notice_area{
		position: absolute;
		z-index: 3;
		background-image: url(./img/info_bk.png);
		font-size: 9px;
		color: white;
		display: none;
		filter: alpha(opacity=90);
		-moz-opacity:0.90;
		opacity:0.90;
	}
	.title_set{
		width: 100%;
		height: 40px;

	}
	#notice_list{
		overflow-y: scroll;
		width: 95%;
	}
	#notice_area #title{
		font-size: 13px;
		width: 58%;
		float: left;
		height: 40px;
		line-height: 40px;
	}
	#notice_area #setting{
		margin-right: 5%;
		float: right;
		padding-top: 10px;
	}
	#notice_area #setting input{
		width: 70px;
	}

	#notice_area .date{
		margin-left: 10px;
		float: left;
		color: #FFEA00;
		font-size: 13px;
		line-height: 25px;
		height: 25px;
	}

	#notice_area .time{
		margin-left: 10px;
		float: left;
		color: #DBD7C0;
		line-height: 25px;
		height: 25px;
	}
	#notice_area .new{
		margin-left: 10px;
		width: 35px;
		height: 18px;
		float: left;
		margin-top: 7px;
	}
	#notice_area .txt{
		margin-left: 10px;
		padding-bottom: 10px;
	}
	#notice_area .txt .subtitle{
		font-size: 12px;
		line-height: 25px;
		float: left;
		padding-bottom: 5px;
	}

	/*********************#information_area************************/
	/*インフォメーション*/
	#information_area{
		position: absolute;
		z-index: 3;
		background-image: url(./img/info_bk.png);
		font-size: 9px;
		color: white;
		display: none;
		filter: alpha(opacity=90);
		-moz-opacity:0.90;
		opacity:0.90;
	}
	.title_set{
		width: 100%;
		height: 40px;

	}
	#information_list{
		overflow-y: scroll;
		width: 95%;
	}
	#information_area #title{
		font-size: 13px;
		width: 58%;
		float: left;
		height: 40px;
		line-height: 40px;
	}
	#information_area #setting{
		margin-right: 5%;
		float: right;
		padding-top: 10px;
	}
	#information_area #setting input{
		width: 70px;
	}

	#information_area .date{
		margin-left: 10px;
		float: left;
		color: #FFEA00;
		font-size: 13px;
		line-height: 25px;
		height: 25px;
	}

	#information_area .time{
		margin-left: 10px;
		float: left;
		color: #DBD7C0;
		line-height: 25px;
		height: 25px;
	}
	#information_area .new{
		margin-left: 10px;
		width: 35px;
		height: 18px;
		float: left;
		margin-top: 7px;
	}
	#information_area .txt{
		margin-left: 10px;
		padding-bottom: 10px;
	}
	#information_area .txt .subtitle{
		font-size: 12px;
		line-height: 25px;
		float: left;
		padding-bottom: 5px;
	}


	/*********************#information_setting_area************************/

	#information_setting_area{
		margin: 0 auto;
		position: absolute;
		z-index: 5;
		font-size: 14px;
		width: 100%;
		background-color:white;
		display: none;
	}

	#information_setting_area #title{
		width: 100%;
		height: 100px;
		background-color: #47627F;
		background-image: url(./img/ja/info_ttl.png);
		background-position: 50% 50%;
		background-repeat: no-repeat;
	}
	#information_setting_area #main{
		margin: 0 auto;
		width: 100%;
		height:auto;
		text-align: center;
		overflow-x: scroll;
	}
	#information_setting_area #header{
		padding-top: 15px;
		width: 100%;
		height: 3%;
	}
	#information_setting_area #inp{
		margin: 0 auto;
		width: 80%;
		height: 310px;
		background-color: #E4F5FD;
		font-weight: bold;
		padding-top:10px;
		padding-left: 50px;
	}
	#information_setting_area #inp div{
		float: left;
		width: 100%;
		height: 30px;
        text-align: left;
	}
	#information_setting_area #inf_buttons{
	    float:left;
		width: 100%;
		height: 120px;
	}
	#information_setting_area #btnSet{
		background-image: url(./img/ja/set_btn.png);
		background-position: 65% 50%;
		background-repeat: no-repeat;
		width: 50%;
		height: 70px;
		display: table;
		cursor: pointer;
		float: left;
	}
	#information_setting_area #btnCancel{
		background-image: url(./img/ja/cancel_btn.png);
		background-position: 35% 50%;
		background-repeat: no-repeat;
		width: 50%;
		height: 70px;
		display: table;
		cursor: pointer;
		float: left;
	}



	/********************ログイン*************************/
	/*ログイン*/
	#login_area_back{
		width: 100%;
		height: 100%;
		position: absolute;
		z-index: 5;
		display: none;

	}
	#login_area{
		font-size: 14px;
		color: #29333C;
		height: auto;
	}
	#login_area #login_title{
		margin: 0 auto;
		width: 100%;
		height: 100px;
		background-color: #47627F;
		background-image: url(./img/login_ttl.png);
		background-position: 50% 50%;
		background-repeat: no-repeat;
	}
	#login_area #login_main{
		width: 100%;
		height: auto;
		background-color: white;
		text-align: center;
		overflow-x: scroll;
	}
	#login_area #inp .inp_list{
		width:100%;
		height:26px;
		margin-top: 25px;
	}
	#login_area #inp .inp_list .inp_img{
		width:30%;
		padding-top:5px;
	}

	#loginid{
		float: left;
	}

	#loginpass{
		float: left;
	}

	#login_area #inp{
		width: 100%;
		height: 165px;
		background-color: #E4F5FD;
		font-weight: bold;
	}
	#login_error{
		color: red;
		font-size: 12px;
	}
	#login_area #buttons{
		height: 50px;
		width: 100%;
	}
	#login_area #btnlogin{
		background-image: url(./img/ja/login_btn.png);
		background-position: 65% 50%;
		background-repeat: no-repeat;
		width: 50%;
		height: 36px;
		display: table;
		cursor: pointer;
		float: left;
	}
	#login_area #btnlogin.disabled{
		background-image: url(./img/ja/login_btn_disabled.png);
	}
	#login_area #btnCancel{
		background-image: url(./img/ja/passcancel_btn.png);
		background-position: 35% 50%;
		background-repeat: no-repeat;
		width: 50%;
		height: 36px;
		display: table;
		cursor: pointer;
		float: left;
	}
	#login_area #poteka_term{
		padding-top: 10px;
		display: none;
	}

	#login_area #notice_title{
		margin: 0 auto;
		background-image: url(./img/ja/login_lbl_notice.png);
		width: 58px;
		height: 13px;
		margin-top: 0px;
	}

	#login_area #notice{
		margin: 0 auto;
		width: 90%;
		height: 100px;
		overflow-y: scroll;
		text-align: left;
		border: 1px solid #DCDCDC;
		margin-top: 5px;
		font-size: 12px;
		color: red;
	}

	#login_area #privacy_title{
		margin: 0 auto;
		background-image: url(./img/ja/login_lbl_privacy.png);
		height: 13px;
		margin-top: 10px;
		background-position: center;
		background-repeat: no-repeat;
	}
	#login_area #privacy{
		margin: 0 auto;
		width: 90%;
		height: 200px;
		overflow-y: scroll;
		text-align: left;
		border: 1px solid #DCDCDC;
		margin-top: 5px;
		font-size: 12px;
	}

	#login_area #btnTroubleshooting{
		margin: 0 auto;
		background-image: url(./img/ja/login_troubleshooting.png);
		width: 126px;
		height: 18px;
		margin-top: 10px;
		margin-bottom: 10px;
		cursor: pointer;
	}

	/*******************FOOTER**********************/
	#footer_area{
		width: 100%;
		height: 74px;
		bottom:0px;
		border-top: 1px solid silver;
		min-width: 320px;
	}

	.close_btn,
	#close_up_btn
	{
		display: table;
		height: 25px;
		width: 25px;
		cursor: pointer;
		float: right;
		margin-top:10px;
		margin-right: 6%;
		z-index: 3;
	}

	.close_btn{background-image: url(../../css/img/close.png);}
	#close_up_btn{background-image: url(../../css/img/close_up.png);margin-top:65px;}

	/*フッター*/
	#time_area{
		float: left;
		border-right: 1px #c2d0df solid;
		height: 49px;
		width: calc(10% - 1px);
	}
	#time_area #clock{
		width:100%;
		height:100%;
		background-image: url(../../css/img/clock.png);
		background-repeat: no-repeat;
		background-position: center;
		cursor: pointer;
	}

	#undefined{
		height:0px;
		width:0px;
		border:0px;
	}

	#control_area{
		float: left;
		width: calc(80% - 1px);
		border-right: 1px #c2d0df solid;
		height: 49px;
	}

	#control_area_inner{
		width:96%;
		height: 49px;
		margin-left: 2%;
		margin-right: 2%;
		overflow: hidden;
	}

	#control_area_right{
		float: left;
		width:10%;
		height:49px;
		display:-ms-flexbox;
		display:flex;
		-ms-flex-pack:center;
		justify-content:center;
		-ms-flex-align:center;
		align-items:center;
		overflow: hidden;
	}
	#ctrl_switch{
		background-image: url('../../css/img/ctrl_switch.png');
		background-repeat: no-repeat;
		height: 26px;
		width: 17px;
/*		margin-left: 25%;
		margin-top: 35%;
		margin:17% 38%; */
		cursor: pointer;
		float: left;
	}
	/*データ表記*/
	#data_notation{
		margin: 0 auto;
		position: absolute;
		z-index: 5;
		font-size: 14px;
		width: 100%;
		display: none;
	}
	#data_notation #title{
		margin: 0 auto;
		width: 100vw;
		height: 8.4vw;
		background-color: #66CDAA;
		background-image: url(../../css/img/ja/data_notation_ttl.png);
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: contain;
	}
	#data_notation #title .close_btn{
		width: 4.5vw;
		height: 4.5vw;
		margin-top: 2vw;
		margin-right: 2vw;
		background-size: contain;
		background-repeat: no-repeat;
	}
	#data_notation #main{
		margin: 0 auto;
		width: 100%;
		background-color: #66CDAA;
		text-align: center;
	}
	#data_notation #header{
		margin: 0 auto;
		background-image: url(../../css/img/ja/data_notation.png);
		background-position: 50% 50%;
		background-repeat: no-repeat;
		width: 100vw;
		height: 31.5vw;
		background-size: contain;
	}

	.option_area a,
	.option_area a:hover {
		text-decoration: none;
		white-space: nowrap;
		width: auto;
		padding-right: 5px;
		text-align: center;
		color: white;
	}


	#btn-48ho,
	#btn-24ho,
	#btn-12ho,
	#btn-6ho,
	#btn-6ho_d,
	#btn-1ho,
	#btn-1ho_d,
	#btn-10mi,
	#btn-1mi,
	#btn-1mi_d,
	#btn1mi,
	#btn1mi_d,
	#btn10mi,
	#btn1ho,
	#btn1ho_d,
	#btn6ho,
	#btn6ho_d,
	#btn12ho,
	#btn24ho,
	#btn48ho{
		width: 12.5%;
		height: 17px;
		display: block;
		cursor: pointer;
		margin-top: 18px;
		float: left;
		background-repeat: repeat-y;
	}
	#btn-48ho,
	#btn-24ho,
	#btn-12ho,
	#btn12ho,
	#btn24ho,
	#btn48ho{
		height: 24px;
		background-size: contain;
		background-position: center;
		margin-left: 5px;
		background-repeat: no-repeat;
	}

	#btn-48ho{background-image: url(./img/-48ho.png);}
	#btn-24ho{background-image: url(./img/-24ho.png);}
	#btn-12ho{background-image: url(./img/-12ho.png);}
	#btn-6ho{background-image: url(./img/-6ho.png);}
	#btn-6ho_d{background-image: url(./img/-6ho_d.png);}
	#btn-1ho{background-image: url(./img/-1ho.png);}
	#btn-1ho_d{background-image: url(./img/-1ho_d.png);}
	#btn-10mi{background-image: url(./img/-10mi.png);}
	#btn-1mi{background-image: url(./img/-1mi.png);}
	#btn-1mi_d{background-image: url(./img/-1mi_d.png);}
	#btn1mi{background-image: url(./img/+1mi.png);}
	#btn1mi_d{background-image: url(./img/+1mi_d.png);}
	#btn10mi{background-image: url(./img/+10mi.png);}
	#btn1ho{background-image: url(./img/+1ho.png);}
	#btn1ho_d{background-image: url(./img/+1ho_d.png);}
	#btn6ho{background-image: url(./img/+6ho.png);}
	#btn6ho_d{background-image: url(./img/+6ho_d.png);}
	#btn12ho{background-image: url(./img/+12ho.png);}
	#btn24ho{background-image: url(./img/+24ho.png);}
	#btn48ho{background-image: url(./img/+48ho.png);}

	#btn-10da,
	#btn-7da,
	#btn-1da,
	#btn1da,
	#btn7da,
	#btn10da{
		width: 12.5%;
		height: 24px;
		display: block;
		cursor: pointer;
		background-size: contain;
		background-position: center;
		margin-left: 5px;
		background-repeat: no-repeat;
		margin-top: 10px;
		float: left;
	}
	#btn-10da{background-image: url(./img/-10da.png);}
	#btn-7da{background-image: url(./img/-7da.png);}
	#btn-1da{background-image: url(./img/-1da.png);}
	#btn1da{background-image: url(./img/+1da.png);}
	#btn7da{background-image: url(./img/+7da.png);}
	#btn10da{background-image: url(./img/+10da.png);}

	#btn-6mo,
	#btn-3mo,
	#btn-1mo,
	#btn1mo,
	#btn3mo,
	#btn6mo{
		width: 12.5%;
		height: 27px;
		display: block;
		cursor: pointer;
		background-size: contain;
		background-position: center;
		margin-left: 5px;
		background-repeat: no-repeat;
		margin-top: 10px;
		float: left;
		background-color: #F6F9FE;
	}
	#btn-6mo{background-image: url(./img/-6mo.png);}
	#btn-3mo{background-image: url(./img/-3mo.png);}
	#btn-1mo{background-image: url(./img/-1mo.png);}
	#btn1mo{background-image: url(./img/+1mo.png);}
	#btn3mo{background-image: url(./img/+3mo.png);}
	#btn6mo{background-image: url(./img/+6mo.png);}

	#btn-3ye,
	#btn-1ye,
	#btn1ye,
	#btn3ye{
		width: 12.5%;
		height: 27px;
		display: block;
		cursor: pointer;
		background-size: contain;
		background-position: center;
		margin-left: 5px;
		background-repeat: no-repeat;
		margin-top: 10px;
		float: left;
		background-color: #F6F9FE;
	}
	#btn-3ye{background-image: url(./img/-3ye.png);}
	#btn-1ye{background-image: url(./img/-1ye.png);}
	#btn1ye{background-image: url(./img/+1ye.png);}
	#btn3ye{background-image: url(./img/+3ye.png);}

	#copy{
		border-top: 1px #c2d0df solid;
		width: 100%;
		height: 25px;
		background-image: url(./img/ja/copy.png);
		background-position: right;
		background-repeat: no-repeat;
		background-size: contain;
		margin-left:5%;
		float: right;
	}
	#copy #date{
		height: 25px;
		line-height: 23px;
		color: #293643;
		margin-right: 5px;
		padding-left: 5px;
		float: left;
		font-size: 13px;
	}
	#copy #time{
		height: 25px;
		line-height: 23px;
		/*color: #A6A6A6;*/
		color: #293643;
		font-size: 13px;
	}

	.slider_box{
		width: 70%;
	}

	#slider{
		margin: 5% 10%;
		width: 70%;
		border-color: #ADD2FF;
		font-size: 90%;
	}
	#slider_begin{
		font-size: 9px;
		color: #00b8de;
		float: left;
	}
	#slider_end{
		font-size: 9px;
		color: #00b8de;
		float: right;
	}
	#speed_area{
		float: left;
		width: 10%;
		margin-top: 19px;
	}
	#speed{
		width: 77%;
		border: 1px solid silver;
		height: 18px;
		font-size:11px;
		margin-left: 0px;
		text-align: center;
	}
	#speed_btn{
		float: left;
		margin-top: 19px;
		margin-left: 0px;
		border: 1px solid silver;
		border-left: 0px none;
		height: 20px;
		width: 10px;
		padding-left: 3px;
	}

	#spin_up,
	#spin_down{
		font-size: 5px; padding: 0px; margin: 0px; cursor: pointer; line-height: 10px; display: block;
	}
	#spin_up:HOVER, #spin_down:HOVER{
		color: gray;
	}

	#play{
		background-image: url(./img/play.png);
		width: 22px;
		height: 22px;
		float: left;
		margin-top: 19px;
		margin-left: 6px;
		display: block;
		cursor: pointer;
	}
	/**********************datetime*********************/
	.ui-datepicker {
	    width: auto;
	    padding: .2em .2em 0;
	    display: none;
	    margin-top: -49px;
	}
	#title_elements{
		position: absolute;
		margin-top: 17px;
		font-size: 11px;
		right: 46%;
		width: 50px;
		text-align: right;
	}
}