@import url(https://fonts.googleapis.com/css?family=Noto+Sans+JP|Noto+Sans+TC);

html * {
	box-sizing: border-box;
}
body {
  color: #333333;
  padding: 0px;
  margin: 0px;
}
/* レスポンシブ対応　START */
#Head_menu{display: none;}
/* スマホ用ログイン項目非表示 */
#login_page{display: none;}
/* スマホ用サイドメニュー非表示 */
#sidemenu_sp{display: none;}
/* スマホ用チャットコメント入力欄非表示 */
#send_sp{display: none;}

/* ログイン画面フレキシブルボックス */
.l-top-flex-nav {
  flex: 2 1 100px; -webkit-flex : 2 1 100px;
}
.l-top-flex-main {
  flex: 0 0 800px; -webkit-flex : 0 0 800px;
}
.l-top-flex-aside {
  flex: 1 1 100px; -webkit-flex : 1 1 100px;
}

/* レイアウト共通CSS */
/* フレキシブルボックス */
.l-flexBox {
  display: flex; 
  display: -webkit-flexbox;
  display: -ms-flexbox;
}

/* フレキシブルボックス sub */
.l-top-flex-sub-main {
  display: flex; 
  display: -webkit-flexbox;
  display: -ms-flexbox;
}

/* フレキシブルボックス */
/* イベント画面 */
.l-flex-nav {
  flex: 0 0 300px; -webkit-flex : 0 0 300px;
}
.l-flex-main {
  flex: 0 0 500px; -webkit-flex : 0 0 500px;
}
.l-flex-aside {
  flex: 1 1 200px; -webkit-flex : 1 1 200px;
}

/* リンク */
.m-link {
  text-align: left;
  margin: 20px 0 20px 0;
}

/* ボタン PC */
.m-btn {
  display:inline-block;
} 
.m-btn a {
  font-size: 16px;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  background-color:#DDDDDD;
  padding: 3px 3px;
  border: 1px solid #0E3192;
  text-align: center;
  height: 45px;
} 

.m-btn input {
  font-size: 16px;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  background-color:#DDDDDD;
  padding: 5px 5px;
  border: 1px solid #0E3192;
  text-align: center;
  outline: none;
} 

.m-btn a:hover {
  color: black;
  background-color:#C0C0C0;
  cursor: pointer;
} 

.m-btn input:hover {
  color: black;
  background-color:#C0C0C0;
  cursor: pointer;
} 

.m-submit-btn {
  display:inline-block;
} 
.m-submit-btn a {
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  color: ghostwhite;
  border-radius: 5px;
  background-color:#0E3192;
  padding: 10px 20px;
  border: 1px solid #058BA9;
  text-align: center;
} 

.m-submit-btn input {
  font-weight: bold;
  text-decoration: none;
  color: ghostwhite;
  border-radius: 5px;
  background-color:#0E3192;
  padding: 10px 20px;
  border: 1px solid #058BA9;
  text-align: center;
  outline: none;
} 

.m-submit-btn a:hover {
  color: ghostwhite;
  background-color:#06fbff;
  cursor: pointer;
} 

.m-submit-btn input:hover {
  color: ghostwhite;
  background-color:#06fbff;
  cursor: pointer;
} 

/* ファイル選択ボタン */
.filelabel{
  display: inline-block;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  background-color:#DDDDDD;
  padding: 5px 5px;
  margin-top:3px;
  margin-bottom:3px;
  border: 1px solid #0E3192;
  text-align: center;
  outline: none;
}

.filelabel:hover{
  background-color:#C0C0C0;
}

.fileinput{
  display: none;
}

/* サイドメニュー用ボタン */
.m-side-btn {
  display:inline-block;
  margin: 2px;
} 

.m-side-btn input {
  font-weight: bold;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  border: 1px solid black;
  text-align: center;
  background-color: white;
  height: 40px;
  width: 250px;
  white-space:nowrap;
  outline: none;
} 
.m-side-btn input[type="submit"]:hover {
  /* マウスが載ったとき */
  background-image: linear-gradient(0deg, #68d3db, #e5f4fc);
  border: 1px solid #2c628b;
}

.m-side-btn a {
  font-weight: bold;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  padding: 5px 15px 5px 15px;
  border: 1px solid black;
  text-align: center;
} 

.m-side-btn a:hover {
  color: black;
  background-color:white;
  cursor: pointer;
} 

/* サイドメニュー用ボタン グループへ参加用*/
.m-side-btn-g {
  display:inline-block;
  margin: 2px;
} 

.m-side-btn-g input {
  font-weight: bold;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  border: 1px solid black;
  text-align: center;
  background-color: #AFF798;
  height: 40px;
  width: 250px;
  white-space:nowrap;
  outline: none;
} 
.m-side-btn-g input[type="submit"]:hover {
  /* マウスが載ったとき */
  background-image: linear-gradient(0deg, #68d3db, #e5f4fc);
  border: 1px solid #2c628b;
}

.m-side-btn-g a {
  font-weight: bold;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  padding: 5px 15px 5px 15px;
  border: 1px solid black;
  text-align: center;
} 

.m-side-btn-g a:hover {
  color: black;
  background-color:white;
  cursor: pointer;
} 

/* QRコード表示用 */
.qr-code-margin {
  margin-top: 10px;
} 
.qr-code-img {
  max-width: 100%;
  height: auto;
} 
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ページ */
#page {
  width: 100%;
  margin: 0 auto;
}

.pageHead {
  height: 80px;
  background-color: #0E3192;
}

/* リンク */
a {
  color: #999966;
}
a:hover {
  color: #339999;
}
/* パンくずリスト */
.topicPath {
  font-size: 12px;
}
/* ページの先頭へ戻る */
.pagetop {
  font-size: 12px;
  text-align: right;
  margin-top: 30px;
}
.pagetop a {
  background-image: url("../images/ico_pagetop.png");
  background-repeat: no-repeat;
  background-position: 0 50%;
  padding-left: 10px;
}
/* ページフッター */
#pageFoot {
  border-top: solid 1px #cccccc;
  margin-top: 15px;
}
#pageFoot #copyright small {
  font-size: 12px;
  line-height: 1.5;
}

/* H1 マージン */
.m-h1-margin {
  margin-bottom: 0px;
  padding-top: 5px;
} 
.m-h1-guidance {
  margin: 5px 0px 0px 0px; 
  font-size: 0.9em;
} 

/* H2 マージン */
.m-h2-margin {
  margin: 5px 0px 0px 10px;
  font-size: 1em;
  font-weight: 100;
} 

/* H2 マージン */
.m-h2-margin2 {
  margin-bottom: 0px;
  text-align: left;
  font-size: 14px;
} 
/* H2 マージン */
.m-h2-margin3 {
  margin-top: 0px;
  margin-bottom: 2px;
  text-align: left;
  font-size: 16px;
} 

/* H3 マージン */
.m-h3-margin {
  margin: 10px 0px 0px 10px;
  font-size: 1em;
  font-weight: 100;
} 

/* テキスト マージン */
.m-txt-margin {
  margin-bottom: 0px;
} 
/* テキスト フォント */
.m-txt-font {
  font-size: 0.8em;
  margin-top: 0px;
} 
/* ボタン メニュー用 */
.m-menu-btn {
  display:inline-block;
} 
.m-menu-btn a {
  font-size: 18px;
  text-decoration: none;
  color: black;
  border-radius: 3px;
  background-color:#FFFFFF;
  padding: 3px 3px;
  border: solid 1px #222;
  text-align: center;
  height: 45px;
} 

.m-menu-btn input {
  font-size: 18px;
  text-decoration: none;
  color: black;
  border-radius: 5px;
  background-color:#FFFFFF;
  padding: 5px 5px;
  border: 1px solid #222;
  text-align: center;
  outline: none;
} 

.m-menu-btn a:hover {
  color: black;
  background-color:#FFFFFF;
  cursor: pointer;
} 

.m-menu-btn input:hover {
  color: black;
  background-color:#FFFFFF;
  cursor: pointer;
} 

/* ログイン画面の装飾 */
/* 新規アカウント追加 */
.accountBodyAdd {
  flex: 0 0 400px; -webkit-flex : 0 0 400px;
}

/* ログイン */
.accountBodyLogin {
  flex: 0 0 400px; -webkit-flex : 0 0 400px;
}

/* 新規アカウント追加 */
.accountBodyAdd {
  flex: 0 0 400px; -webkit-flex : 0 0 400px;
}

/* ログイン */
.accountBodyLogin {
  flex: 0 0 400px; -webkit-flex : 0 0 400px;
}

/* ボタン */
#pageBodyMain .btn {
  text-align: center;
  padding-bottom: 20px;
  margin: 30px 0;
  border-bottom: 1px dotted #cccccc;
}

#pageBodyMain .btn a {
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  color: #FFFFFF;
  background-color: #058BA9;
  padding: 10px 20px;
  border-radius: 5px;
  background-image: linear-gradient(to bottom, #92CDDB, #058BA9);
  border: 1px solid #058BA9;
  box-shadow: 1px 1px #9DDDED inset;
  text-shadow: 0px -1px 0 #333333;
  display: inline-block;
  }
#pageBodyMain .btn a:hover {
  opacity: 0.7;
}

button {
  margin: 10px 0;
  width: 100px;
  height: 50px;
  font-size: 1.2em;
  color: #66B7CC;
  border-radius: 30px;
  background-color: #FFF;
  border: solid 2px #66B7CC;
  transition: .4s;
}

button:hover {
  background: #66B7CC;
  color: #FFF;
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* PC 固有 START */
/* 検索条件用の項目　テキストボックス　セレクトボックスで使用する。 */
.m-searchbox {
  display: inline-flex;
  padding-top: 5px;

}
.m--searchbox {
  margin: 0; 
}
/*イベント検索　非表示*/
.events_search_display{
  display: none;
}

.m--searchbox-btn {
  margin: 5px 0 0 0;
}
.m--searchbox-padding {
  padding: 0 5px 0px 0px
}

/* 検索条件用の項目　テキストボックスのラベル   */
.m--searchbox-label {
  margin: 0; 
}

/* 検索条件用の項目　テキストボックスのラベル位置調整   */
.nowrap-label {
  white-space:nowrap;
}

.nowrap-label.label2 {
  padding:2px 0 0 10px;
}

/* 検索条件用の項目　テキストボックスのラベル位置調整  スマホでも使用 */
.nowrap-label.label1 {
  padding-top:8px;
  padding-right:8px;
}
.nowrap-label.label3 {
  padding-top:8px;
  padding-right:8px;
}
.nowrap-label.label4 {
  padding-top:3px;
  padding-right:8px;
}

/* テキストボックス */
.m-textbox {
  width: 320px;
  margin-left: 5px;
  padding: 5px;
  border-width: 1px;
  border-radius: 5px;
  outline: none;
  height:30px;
} 
/* テキストボックス 　グループ管理系のテキストボックスで使用　*/
.m-textbox-multi {
  width: 320px;
  padding: 7px;
  border-radius: 5px;
  outline: none;
} 

.m-textbox-search {
  width: 450px;
} 

/* テキストエリア 　問い合わせフォームで使用　*/
.m-textarea-multi {
  width: 95%;
  padding: 7px;
  border-radius: 5px;
  outline: none;
  -moz-box-shadow: inset 0 0 6px rgba(0,0,0,0.2);
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
  box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.2);
} 

/* リストボックス */
.m-listbox {
  margin: 0px;
  border-radius: 5px;
  height:30px;
} 

.box_frame {
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  outline: none;
}

.box_frame select {
  width: 100%;
  padding-right: 1em;
  cursor: pointer;
  text-indent: 0.01px;
  text-overflow: ellipsis;
  border: none;
  outline: none;
  background-image: none;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
}


.box_frame select::-ms-expand {
    display: none;
}

/* セレクトボックス PCとスマホで共通で使用 */
.box_frame.frame01 {
	position: relative;
	border: 1px solid #707070;
	border-radius: 5px;
  box-sizing: border-box;
  height: 36px;
}

.box_frame.frame01::before {
	position: absolute;
	top: .2em;
	right: -.2em;
	width: 35px;
  height: 35px;
	content: '';
	pointer-events: none;
  background: url(../img/arrow@2x.png)0 0 no-repeat;
	background-size: 27px;
}

.box_frame.frame01 select {
	padding: 8px 38px 8px 8px;
	color: #666666;
  height: 36px;
}

.pageEventSearch{margin:0px;}
    

.m-small-btn {
  display:inline-block;
} 
.m-small-btn a {
  text-decoration: none;
  color: ghostwhite;
  border-radius: 5px;
  background-color:#0E3192;
  padding: 0px 5px;
  text-align: center;
  border: 1px solid #058BA9;
  white-space: nowrap;  
} 

.m-small-btn input {
  text-decoration: none;
  color: ghostwhite;
  border-radius: 5px;
  background-color:#0E3192;
  padding: 0px 5px;
  text-align: center;
  border: 1px solid #058BA9;
} 

.m-small-btn a:hover {
  color: ghostwhite;
  background-color:#06fbff;
  cursor: pointer;
} 

/* プロフィール画面　テーブルの幅 */
.profile {
  width: auto;
} 

/* チャットのメッセージ幅 */
.bms_message_text {
  width: 400px;
} 

/* PC 固有 END ここまで */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* PC パスワード　表示／非表示切り替え */
#checkPassword {
  display: none;
}
.hideText, .showText {
  border: none;
  outline: none;
  width: 250px;
}
.togglePassword {
  border: 2px solid;
  margin: 0px;
  padding: 10px;
  border-radius: 5px;
  width: 320px;
  text-align: left; 
}
.showText {
  display: none;
}
.hideText {
  display: inline;
}
.fa-eye:before {
  display: inline;
  margin-left: 5px; 
}
.fa-eye-slash:before {
  display: none;
}
#checkPassword:checked + .togglePassword > .fa-eye:before {
  display: none;
}
#checkPassword:checked + .togglePassword > .fa-eye-slash:before {
  display: inline-block;
}
#checkPassword:checked + .togglePassword > .hideText {
  display: none;
}
#checkPassword:checked + .togglePassword > .showText {
  display: inline-block;
}


/* 参照画面のタブ制御 */
#reference .tab-index ul {
	display: table;
	text-align: center;
	padding-left: 5px;
}
#reference .tab-index li {
	display: table-cell;
	width: 100px;
	height: 30px;
	line-height: 30px;
	border-bottom: 1px solid #fff;
	background-color: #f4f4f4;
  border-radius: 10px 10px 0 0;
}
#reference .tab-index a {
	display: block;
	width: 100%;
  color: #333333;
  text-decoration: none;
}
#reference .tab-index li:not(:last-child) {
	border-right: 1px solid #fff;
}
#reference .tab-index .active {
	background-color: #0E3192;
	color: white;
}
#reference .tab-index .active a {
	background-color: #0E3192;
	display: block;
	width: 100%;
  color: #fff;
  text-decoration: none;
  border-radius: 10px 10px 0 0;
}

#reference .tab-contents {
	display: none;
}
#reference .tab-contents.active {
	display: block;
}
#reference .list-tab {
	margin-bottom:5px;
}

/*flexboxの制御*/
.flexbox-container {
	display: flex;
	padding: 0 0 0px 0;
	background: #ffffff;
  flex-wrap: wrap;
}
.flexbox-column_left {
	flex: 0 0 auto;
	margin: 0px 0px 0 5px;
	padding: 0px 0px 0px 10px;
}
.flexbox-column {
	margin: 0px 0px 0 0px;
	padding: 0px 0 0px 10px;
}
.flexbox-top {
	margin: 5px 0px 0 0;
}
.flexbox-top2 {
	margin: 27px 0px 0 0;
}
.flexbox-top3 {
	margin: 43px 0px 0 0;
}

/*画像サイズ指定の制御*/
.images_size{
  margin: 5px 0 0 0;
  width:300px;
}
.list_images_size{
  margin: 0px 0 0 0;
  width:150px;
  text-align: center;
  vertical-align:middle;
  padding: 0px;  
}
.field_images_size{ /*画像サイズ指定の制御 現場*/
  margin: 5px 0 0 0;
  width:200px;
}

/*ツールチップの制御*/
.tooltip{
    position: relative;
    cursor: pointer;
    display: inline-block;
}
.tooltip p{
    margin:0;
    padding:0;
}
.tooltip_description {
    display: none;
    position: absolute;
    font-size: 12px;
    line-height: 1.6em;
    color: #FF0000;
    border-radius: 5px;
    background: #fff;
    width: 140px;
    margin-top: 45px;
}
.tooltip:hover .tooltip_description{
    display: inline-block;
    top: -70px;
    left: -30px;
}

/* 図式　取得方法を囲む*/
.drow_border {
  border:1px solid #333333;
}
.drow_border-search {
  border:1px solid #c0c0c0;
}

/* 適用　備考　の文字数を制限して表示*/
.character_limit {
  width:500px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow:ellipsis;
}

/* 検索一覧 */
.search-list {
  padding-top: 10px;
}
.search-list tr:hover {
/* 	background: #fffacc; 一覧でマウスをのっけたときに色を変えるやつ */
}