@charset "utf-8";



/* ヘッダ */
#header{
	padding-top: 0.5em;
	padding-bottom: 0.5em;
/*	margin-bottom: 1em; */
}

/* メインコンテンツ部分 */
#content{
	min-height: 36em;
}


#breadcrumb{
	margin: 0.5em 0;
}

/*
.menu > li > a{
	border-bottom: 3px solid #E6E6E6;
}
.menu > li > a:hover{
	border-bottom: 3px solid #054F8B;
}
*/


/* フッタ */
#footer{
	margin-top: 5em;
	padding-top: 1em;
	background: #1165AB;
	border-top: 40px solid #024883;

}
#footerLinkBox{
	color: #FFF;
}


#footerCopyrightBox{
	border-top: 1px solid #347CB7;
	padding: 1em 0 1em;
	text-align: center;
	font-size: small;
	color: #FFF;
}




/* メインビジュアル */
#mainVisualBox{
	background: url('img/bg_member_top_main.jpg') center center ;
}
#mainVisual{
	max-height: 210px;
	max-width: 1000px;
	margin: 0 auto;
	}


h2{
	font-size: 2em;
}

h3{
	font-size: 1.6em;
}

h4{
	font-size: 1.4em;
}

h5{
	font-size: 1.2em;
}


h1 small, h2 small, h3 small, h4 small, h5 small, h6 small{
	color: #777;

}

/* ヘッダーメニュー */
div#naviBox{
	color: #FFF;
  background-image: -moz-linear-gradient( 90deg, rgb(0,70,127) 0%, rgb(19,106,176) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(0,70,127) 0%, rgb(19,106,176) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(0,70,127) 0%, rgb(19,106,176) 100%);
}
div#naviBox ul li {
	display: inline-block;
	border-left: 1px solid #033e6f;
}
div#naviBox ul li:last-child {
	border-right: 1px solid #033e6f;

}

div#naviBox ul li a{
	padding: 1em 1em;
	display: block;
	color :#FFF;]
}












/* マイページ ------------------------------------------- */

/* 会報 */
#newsletterBox h5.bookTitle{
	font-weight: bold;
	color: #034C87;
	margin-bottom: 1.5em;
}

#newsletterBox h6.bookHeading{
	margin: 0.1em 0 0.1em;
	color: #555;
	font-weight: bold;
}
/* 会報バックナンバー */
div.backnumberBox{
	margin: 4em 0.5em 1em;
	text-align: right;

}


/* 会報 */
div#newsletterBox{
	margin-top: 2em;
	padding: 0.7em;
	background: #f2f5f7;
	border-radius: 0.6em;

}




/* 新規申請フォーム・内容変更依頼フォーム等 */
p.formInfo{
	background: #FAFAFA;
	padding: 1em 1em;
	margin: 2rem 0;
}
p.formInfo em{
	font-weight: bold;
	font-style: normal;
}

p.formInfoCaution{
	margin: 2rem 0;
	color: #900;
}

table.tableRequestForm{
  margin: 2rem 0 ;
}
table.tableRequestForm tr th{
  border: 1px solid #e0e0e0;
  background: #f5f5f5;
  font-size: small;
  padding: 1.5rem 1rem;
  text-align: left;
  width: 18em;
}
table.tableRequestForm tr td{
  border: 1px solid #e0e0e0;
  background: #FFF;
}

table.tableRequestForm input{
  margin: 0.5em;
  width: 95%;
}
table.tableRequestForm div.checkbox input{
  margin: 0.5em;
  width: auto;
}


span.lbl_required{
  display: inline-block;
  font-size: x-small;
  font-weight: normal;
  margin: 0 0.3em;

  background: #F00;
  color: #FFF;
  letter-spacing: 0.02em;
  line-height: 1;
  padding: 0.3em 0.8em;
}


span.str_required{
  display: inline-block;
  font-size: medium;
  font-weight: normal;
  color: #F00;
}






/* 会報 2018-02～ */

/* 会報 */
div#newsletterBox2{
	margin-top: 1em;
	margin-bottom: 2em;
	padding: 0.6em 0.4em;
	background: #f2f5f7;
	border-radius: 0.6em;
	font-size: small;
}
#newsletterBox2 h5.bookTitle{
	font-size: large;
	font-weight: bold;
	color: #034C87;
	margin-bottom: 1.5em;
}

#newsletterBox2 h6.bookHeading{
	margin: 0.1em 0 0.1em;
	color: #555;
	font-weight: bold;
}
/* 会報バックナンバー */
div.backnumberBox{
	margin: 4em 0.5em 1em;
	text-align: right;

}










/* トップページ通常のお知らせ */
ul.homeInfo{
	list-style: none;
}
ul.homeInfo li{
	padding: 0.6em 0.5em;
}
ul.homeInfo li:nth-child(2n){
	background: #F7F7F7;
}

span.infoDate{
	color: #0c5b9c;
	display: inline-block;
	margin-right: 1em;
	font-size: small;
}

span.infoTitle{
	color: #666;
	display: inline-block;
	font-size: small;
}








/* 右部 メニューパネル(画像ボタン) */
ul.homeMenuPanel{
	list-style: none;
}

ul.homeMenuPanel li{
	margin: 0.5em 0;
	text-align: center;
}



/* ユーザパネル */
div.userPanel{
	background: #f9f9f9;
	border-left: 2px solid #ddd;
	border-bottom: 1px solid #ddd;
	margin: 4px 1px;
	padding: 0.3em 0.6em;
	position: relative;
}

.userPanelName{
	white-space: nowrap;
}



div.userAddPanel:hover{
	background-color: #FEE;
}

.userPanelCompanyname{
	white-space: nowrap;
	font-size: small;
}

/* 委員会パネル */
div.committeePanel{
	background: #f9f9f9;
	border-left: 2px solid #ddd;
	border-bottom: 1px solid #ddd;
	margin: 4px 1px;
	padding: 0.3em 1.6em 0.3em 0.6em;
	position: relative;
	min-height: 3em;
}

.committeePanelName{
	font-size: small;
	white-space: normal;
}

div.committeeAddPanel:hover{
	background-color: #FEE;
}


/* 所属解除ボタン */
.removeButton{
	position: absolute;
	top: 0.2em;
	right: 0.2em;
 	opacity: 0.4;
}
.removeButton:hover{
 	opacity: 1;
}

/* 管理者変更ボタン */
.levelButton{
	position: absolute;
	bottom : 0.2em;
	right: 0.2em;

}





/* 操作方法 */
div.operateInfoBox{
	margin: 4em 0.5em 2em;
	padding: 1em 0.5em;
	border: 1px solid #EEE;
	border-radius: 0.6em;
}








/* フォーム関係 */

.error-message{
		color: #F00;
		font-size: small;
}

/* フォームの補足説明 */
p.formNote{
	font-size: small;
}

p.formNotice{
	font-size: small;
	color: #F00;
}

/* プレースホルダ placeholeder */
input::-webkit-input-placeholder {
    color: #bbb;
    font-weight: normal;
}
input:-ms-input-placeholder {
    color: #bbb;
    font-weight: normal;
}
input::-moz-placeholder {
    color: #bbb;
    font-weight: normal;
}


/* 更新・登録ボタンが入る箱 */
div.submit{
	margin: 4.5em 1.5em 1.5em;
	text-align: center;
}


div.mailSendSelectBox{
	background: #FAFAFA;
	margin: 2em 0 2em;
	padding: 1em;
}


#searchPaging{
	margin-top: 1em;
	margin-bottom: 1em;

}





/* flashMessage フラッシュメッセージ関連 */
#flashMessage{
	border-radius: 0.4em;
	padding: 0.8em;
	margin: 1em;
}

.message{
	background: #ecffbb;
}

.message.error{
	background: #ffecbb;

}






/* フォーム送信前確認ダイアログ */
div.confirmDialog table th{
	font-size: small;
}
/* イベントの詳細 */
#confirmEventContent{
	font-size: small;
	max-height: 12em;
	overflow-x: hidden;
	overflow-y: scroll;
}









/* 確認ダイアログ */
h5.dialogTitle{
	font-weight: bold;
}



/* ページネーターが入る箱 */
div.paginatorBox{
	background: #FAFAFA;
	margin: 1em 0;
	padding: 0.8em 0.8em;
	border: 1px solid #DDD;
}






/* ユーザ一覧 -------------------------------------------------- */

h4.userGroupHeader{
	margin-top: 1.2em;
	margin-bottom: 1em;

}

table.userList td{
	vertical-align: top;

}

/* 所属委員会リスト */
td.userListCommitteeList{
	font-size: small;
}

/* メールアドレス */
td.userListEmail{
	font-size: small;
}

div.userListLoginId{
	font-size: small;
}
div.userListLoginPassword{
	font-size: small;

}

/* 一覧内 会社名 */
div.userListCompanyname{
	font-size: small;
	overflow: hidden;
	white-space: nowrap;
	word-wrap: break-word;
}
/* 一覧内 氏名 */
div.userListName{
	overflow: hidden;
	white-space: nowrap;
	word-wrap: break-word;
}f

/* 一覧内 ローマ字氏名 */
div.userListNamerome{
	font-size: small;
	}








/* イベント・スケジュール一覧 -------------------------------------------------- */
td.eventListCommitteeName{
	width: 15em;
	}


td.eventListEventName{
	max-width: 40em;
}

/* 一覧内 イベント詳細説明 */
div.eventListDescription{
	font-size: small;
}

/* 一覧内 イベント名 */
div.eventListEventName{
	font-weight: bold;

}
td.eventDatePlace{
	font-size: small;
	width: 12em;
	text-align:center;
}




/* 詳細・備考 */
td.eventContent{
	font-size: small;
}



/* 出欠パネル */
div.attendancePanel{
	margin-top: 0.4em;
	margin-bottom: 0.4em;
	padding: 0.4em 0.3em;
	background: #FAFAFA;
	border: 1px solid #EEE;
}

div.eventAttendance{
	font-size: small;
}

div.attendanceCommentBox{
	font-size: small;
}
span.attendanceComment{
	font-weight: normal;
}
span.has-tip.attendanceComment{
	font-size: small;
	font-weight: normal;
}

span.attendanceCommentLeader{
	color: #888;
}




/* 資料・議事録-------------------------------------------------- */

/* 登録日 */
td.documentListDate{
	font-size: small;
	width: 9em;
	text-align:center;
}

td.documentListTitle{
	width: 22em;
}

/* 公開期間 */
td.documentListDateRange{
		font-size: small;

	width: 12em;
	text-align:center;
}

div.documentFileSize{
	font-size: medium;
	color: #555;
}



/* メール -------------------------------------------------- */

/* 登録日 */
td.mailListDate{
	font-size: small;
	width: 12em;
	text-align:center;
}







td.listAction{
	text-align: center;

}




/* トピックスページ 右側　ロゴマニュアルバナー[22/02/16] ADDED -------------------------------------------------- */
.bannerBox {
    margin: 0 0 20px;
}

.bannerBox .bnr_logo_manual {
    position: relative;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    height: 80px;
    font-size: 1.15em;
    font-weight: bold;
    /* color: #3eaedf; */
    color: #024883;
    border: 1px solid #024883;
}

.bannerBox .bnr_logo_manual:before,
.bannerBox .bnr_logo_manual:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    width: 0;
    height: 100%;
    z-index: 2;
    background: #024883;
    opacity: 0;
    transition: all .5s ease .1s;
}

.bannerBox .bnr_logo_manual:after {
    background: rgba(0, 85, 162, .25);
    transition-delay: 0s;
    z-index: 1;
}

.bannerBox .bnr_logo_manual .inner {
    position: relative;
    padding: 0 20px 0 50px;
    text-align: center;
    width: 100%;
    transition: all .5s ease;
    z-index: 3;
}

.bannerBox .bnr_logo_manual .inner:before {
    content: "";
    display: block;
    width: 60px;
    height: 60px;
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    transition: background-image .35s ease-out .15s;

    /* background: url(../img/ico_logo_manual.svg) no-repeat 0 0; */
    background: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path fill='%23024883' d='M59.07,42.57c-.89-3.1-1.79-6.2-2.68-9.3l-.87-3L53.1,32.67q1.18,4.62,2.35,9.25c.39,1.52-.62,2.87-2.29,2.35a26.63,26.63,0,0,0-8.69-2.08,23,23,0,0,0-9.9,1.8c-.35.15-2.68,1.83-2.78.64l-.15-8.37q-.16-8.64-.32-17.28c0-.33.79-.5,1-.56a20.3,20.3,0,0,1,4-1.06,24.24,24.24,0,0,1,9.92.57,7,7,0,0,1,2.91,1.26l1.55-1.55a8.14,8.14,0,0,0-1.67-1,25.42,25.42,0,0,0-9.32-1.81,27.71,27.71,0,0,0-9.56,1.48c-.6.2-1.57-.34-2.17-.5s-1.44-.36-2.17-.49a29.45,29.45,0,0,0-4.87-.49,30.81,30.81,0,0,0-9.28,1.45c-.66.24-.19.07-.05,0-1.85.71-3.89,1.86-4.48,3.9-.15.51-.29,1-.44,1.52C6,24.31,5.2,26.89,4.46,29.47q-1.51,5.3-3,10.58C.83,42.1-.34,44.74.1,46.9c.53,2.67,3.14,3.9,5.67,3.39a20.85,20.85,0,0,0,2.55-.9,33,33,0,0,1,4.34-1.24,23.41,23.41,0,0,1,10.65.55c.78.2,3.7.71,3.78,1.58s1,.59,1.6.59h1.75a5.49,5.49,0,0,0,1.94,0c.51-.22.12-.78.6-1a17.86,17.86,0,0,1,2-.73A31.22,31.22,0,0,1,39.86,48a22.56,22.56,0,0,1,10.25.93c2,.62,3.9,1.77,6,1.39,2.93-.52,4.13-3.52,3.36-6.19C59.38,43.61,59.22,43.09,59.07,42.57ZM28.31,25.83Q28.13,35.12,28,44.4c0,.42-.12.68-.59.66A21.82,21.82,0,0,0,19,42.35a23.24,23.24,0,0,0-9.93,1,12.09,12.09,0,0,1-3.2,1,1.71,1.71,0,0,1-1.65-2.22C5,39.23,5.73,36.3,6.48,33.37Q7.78,28.2,9.1,23l.66-2.57c.53-2.11,3.5-2.5,5.28-2.87a22.86,22.86,0,0,1,10,.09c.57.14,3.43.58,3.42,1.4Q28.37,22.45,28.31,25.83ZM38.08,39l8.69-1.85L64,19.91l-6.85-6.86L39.92,30.28ZM60.69,19.91,45.92,34.68,44.4,33.15,59.17,18.38Zm-3.54-3.55,1.52,1.53L43.9,32.66l-1.53-1.53ZM42,31.78,45.28,35l-3,.66-.89-.89Z'/></svg>") no-repeat 0 0;
    background-size: 60px auto;
}

.bannerBox .bnr_logo_manual .inner:after {
    content: "";
    display: block;
    position: absolute;
    right: 22px;
    top: 50%;
    width: 7px;
    height: 7px;
    border-top: 2px solid #024883;
    border-right: 2px solid #024883;
    transform: translateY(-50%) rotate(45deg);
    transition: all .35s ease-out .15s;
}

.bannerBox .bnr_logo_manual .em {
    /* color: #024883; */
    transition: all .35s ease .15s;
}


.bannerBox .bnr_logo_manual:hover .inner {
    color: #fff;
}

.bannerBox .bnr_logo_manual:hover .em {
    color: #fff;
}

.bannerBox .bnr_logo_manual:hover .inner:before {
	opacity: .9;
    background: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path fill='%23ffffff' d='M59.07,42.57c-.89-3.1-1.79-6.2-2.68-9.3l-.87-3L53.1,32.67q1.18,4.62,2.35,9.25c.39,1.52-.62,2.87-2.29,2.35a26.63,26.63,0,0,0-8.69-2.08,23,23,0,0,0-9.9,1.8c-.35.15-2.68,1.83-2.78.64l-.15-8.37q-.16-8.64-.32-17.28c0-.33.79-.5,1-.56a20.3,20.3,0,0,1,4-1.06,24.24,24.24,0,0,1,9.92.57,7,7,0,0,1,2.91,1.26l1.55-1.55a8.14,8.14,0,0,0-1.67-1,25.42,25.42,0,0,0-9.32-1.81,27.71,27.71,0,0,0-9.56,1.48c-.6.2-1.57-.34-2.17-.5s-1.44-.36-2.17-.49a29.45,29.45,0,0,0-4.87-.49,30.81,30.81,0,0,0-9.28,1.45c-.66.24-.19.07-.05,0-1.85.71-3.89,1.86-4.48,3.9-.15.51-.29,1-.44,1.52C6,24.31,5.2,26.89,4.46,29.47q-1.51,5.3-3,10.58C.83,42.1-.34,44.74.1,46.9c.53,2.67,3.14,3.9,5.67,3.39a20.85,20.85,0,0,0,2.55-.9,33,33,0,0,1,4.34-1.24,23.41,23.41,0,0,1,10.65.55c.78.2,3.7.71,3.78,1.58s1,.59,1.6.59h1.75a5.49,5.49,0,0,0,1.94,0c.51-.22.12-.78.6-1a17.86,17.86,0,0,1,2-.73A31.22,31.22,0,0,1,39.86,48a22.56,22.56,0,0,1,10.25.93c2,.62,3.9,1.77,6,1.39,2.93-.52,4.13-3.52,3.36-6.19C59.38,43.61,59.22,43.09,59.07,42.57ZM28.31,25.83Q28.13,35.12,28,44.4c0,.42-.12.68-.59.66A21.82,21.82,0,0,0,19,42.35a23.24,23.24,0,0,0-9.93,1,12.09,12.09,0,0,1-3.2,1,1.71,1.71,0,0,1-1.65-2.22C5,39.23,5.73,36.3,6.48,33.37Q7.78,28.2,9.1,23l.66-2.57c.53-2.11,3.5-2.5,5.28-2.87a22.86,22.86,0,0,1,10,.09c.57.14,3.43.58,3.42,1.4Q28.37,22.45,28.31,25.83ZM38.08,39l8.69-1.85L64,19.91l-6.85-6.86L39.92,30.28ZM60.69,19.91,45.92,34.68,44.4,33.15,59.17,18.38Zm-3.54-3.55,1.52,1.53L43.9,32.66l-1.53-1.53ZM42,31.78,45.28,35l-3,.66-.89-.89Z'/></svg>") no-repeat 0 0;

}

.bannerBox .bnr_logo_manual:hover .inner:after {
    border-color: #fff;
}

.bannerBox .bnr_logo_manual:hover:before,
.bannerBox .bnr_logo_manual:hover:after {
    width: 100%;
    opacity: 1;
    right: auto;
    left: 0;
}



/* 汎用class */
.easyroll:hover{
	opacity: 0.8;
}


.clickable{
	cursor: pointer;
}





button.radius, .button.radius {
    border-radius: 0.3em; }
  button.round, .button.round {
    border-radius: 50%; }





/* マージン用 */
.top5 { margin-top:5px !important; }
.top7 { margin-top:7px !important; }
.top10 { margin-top:10px !important; }
.top15 { margin-top:15px !important; }
.top17 { margin-top:17px !important; }
.top20 { margin-top:20px !important; }
.top30 { margin-top:30px !important; }
.top40 { margin-top:40px !important; }
.top50 { margin-top:50px !important; }

.bottom5 { margin-bottom:5px !important; }
.bottom7 { margin-bottom:7px !important; }
.bottom10 { margin-bottom:10px !important; }
.bottom15 { margin-bottom:15px !important; }
.bottom17 { margin-bottom:17px !important; }
.bottom20 { margin-bottom:20px !important; }
.bottom30 { margin-bottom:30px !important; }
.bottom50 { margin-bottom:50px !important; }






/* 以下デバッグ用 ---------------------------------------------------------------- */

/* ログイン中のユーザ情報 */
#loggedUserInfo{
	text-align: left;
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 0;
	background: #DDD;
	width: 40%;
	line-height: 1;
	opacity: 0.9;
	font-size: 12px;
	color: #009;
	height: 10%;
	overflow: scroll;
}

/* 開発デバッグ用 モード表示 */
div#modeDisplayBox{
	text-align: center;
	position: fixed;
	top: 0;
	left: 55%;
	z-index: 0;
	background: #EAA;
	width: 25%;
	opacity: 0.6;
	font-size: 21px;
	color: #F00;
}