@charset "utf-8";

html {
	height:100%;
}
body {
	font-family: "Segoe UI","SF Pro","Hiragino Sans","Meiryo UI" ;
	font-size:14px;
	margin: 0;
	padding: 0;
	color:#1A2127;
	height:100%;
	min-height:100vh;
	min-width: 960px;
	overflow-y: scroll;
}

textarea{
	overflow-y:scroll;
}

ul, ol, dl { 
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	padding: 0;
	margin: 0;
	word-break:break-all;
	word-wrap:break-word;
}
img {
	border: none;
}
hr { /* margin,padding は使用箇所ごとに設定 */
	border-width: 1px 0px 0px 0px;
	border-style: solid;
	border-color: #D9DEE6;
}

 /* 登録エラー */
.error-message { /* 上部のエラーメッセージ */
	font-size: 14px;
	color: #D1511A;
	background: url(../img/i_error.png?v=1)  no-repeat left top 2px;
	padding-left:24px;
	margin-top:35px;
}

.error { /* 該当するフォームをDIVで囲む */
	color: #D1511A;
	margin:0;
	padding:0;
}
.error-text { /* 個別のエラーメッセージ */
	color: #D1511A;
	font-size: 12px;
	line-height: 150%;
	margin-top: 4px;
}

/* テキストボックス、テキストエリア＿共通レイアウト */
input[type="text"]:hover, textarea:hover {
    /* マウスオン */
    border: 1px solid #798A9A;
    transition: 0.4s;
}

input[type="text"]:focus, textarea:focus {
    /* フォーカス */
    border: 1px solid #2D55AD;
}

/* 文字サイズ　個別指定 */
.text-12 {
	font-size:12px;
	font-weight:normal;
}

/* 太文字 */
.text-bold {
	font-weight:bold;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* 赤い文字 */
.text-red {
	color: #D1511A;
}


/* グレー文字（使用不可の色） */
.text-gray {
	color: #BCC5D0;
}


/* 必須アイコン */
.i-hissu {
	background: #D1511A;
	border-radius: 4px;
	font-weight: bold;
	font-size: 10px;
	color:#ffffff;
	padding:1px 4px;
	margin-left:8px;
}

/* newアイコン */
.i-new {
	background: #D1511A;
	border-radius: 4px;
	font-weight: bold;
	font-size: 12px;
	color:#ffffff;
	padding:2px 4px;
	margin-right:8px;
}

/* 各種文字アイコン　※白背景・グレー文字（変更・一致・複数候補など） */
.i-moji { 
	color: #798A9A;
	font-size: 11px;
	height: 9px;
	padding: 1px 7px;
	border:#BCC5D0 solid 1px;
	border-radius: 4px;
    vertical-align: 1px;
	font-weight: normal;
}

/* 一覧のソートボタン配置 */
.btn-sort {
	display:inline-block;
	width:6px;
	margin-left:3px;
	line-height:5px;
	vertical-align:-1px;
}

/* ＋追加 */
.add-line {
	color:#2D55AD;
	cursor:pointer;
	margin-right:30px;
}

/*  ----------リンクのスタイル ---------- */
a:link {
	color: #2D55AD;
	text-decoration: none;
}
a:visited {
	color: #2D55AD;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	text-decoration: underline;
	transition: 0.4s ;
}

/* 削除 */
.delete-link a:link {
	color: #D1511A;
	font-size:12px;
	text-decoration: none;
}
.delete-link a:visited {
	color: #D1511A;
	text-decoration: none;
}
.delete-link a:hover, a:active, a:focus {
	text-decoration: underline;
	transition: 0.4s ;
}

/* ---------- レイアウト基本 ---------- */


.container{ /* 全体枠 縦のレイアウト用　header固定、main可変 */
	display: flex;
	display: -webkit-flex;
	flex-direction: column;
	min-height: 100vh;
	height: 100vh;
	height: 100%; /* for IE11 */
}

header {
	position: fixed;
	height: 56px;
	width: 100%;
	text-align: left;
	background-color: #ffffff;
	border-bottom:#D9DEE6 solid 1px;
	z-index:2;
}
.navigation {
    text-align: left;
    display: flex; /* ナビゲーションの配置用 */
	display: -webkit-flex;
	width:100%;
	max-width:1920px;
	min-width:960px;
}
main { /*メニューとコンテンツ全体*/
    flex: 1;
    display: flex; /* サイドメニュー、メインコンテンツ配置用 */
	display: -webkit-flex;
}
.sidebar { /*メニュー　main枠内でflexレイアウト左固定*/
	position: fixed;
	margin-top:57px;
    width: 239px;
    text-align: left;
    background-color: #F6F8FB;
	padding-top:20px;
	border-right: #D9DEE6 solid 1px;
	height:100%;
	z-index:2;
	overflow:auto;
}
.main-inner { /*コンテンツ　main枠内でflexレイアウト右側 */
    flex: 1;
    background-color: #ffffff;
	margin-top:57px;
	margin-left:240px;
	max-width:1680px;
	min-width:720px;
}

.main-single { /* サイドメニューなしのレイアウト用　お知らせなど */
    background-color: #ffffff;
	margin-top:57px;
	margin-left:120px;
	margin-right:120px;
	max-width:1680px;
	min-width:720px;
}



/* ---------- login ログイン画面 ---------- */


.login-idpw {
	padding:40px;
	position: absolute;
	width: 340px;
	height: 360px;
	left: calc(50% - 420px/2);
	top: calc(50% - 412px/2);
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
}

.login-idpw .title-img {
	text-align:center;
	margin:0;
}
.login-idpw p {
	font-size: 12px;
	line-height:16px;
	font-weight: bold;
	margin-bottom:8px;
	width:340px;
}

.login-idpw .idpw-forget {
	font-size:12px;
	padding-left:16px;
}

.bg-black { /* ポップアップ表示の背景全体を覆う */
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background: #1A2127;
	mix-blend-mode: normal;
	opacity: 0.5;
}

.login-company {
	padding: 32px 24px;
	position: absolute;
	width: 592px;
	height: auto;
	left: calc(50% - 640px/2);
	top: calc(50% - 233px/2 - 0.5px);
	background: #FFFFFF;
	border-radius: 8px;
}
.login-company h1 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:8px;
}


.login-2step {
	padding: 32px 24px;
	position: absolute;
	width: 402px;
	height: 180px;
	left: calc(50% - 450px/2);
	top: calc(50% - 244px/2 - 0.5px);
	background: #FFFFFF;
	border-radius: 8px;
}
.login-2step h1 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:8px;
}
.login-2step p {
	font-size: 14px;
	margin-bottom:20px;
}
.login-2step-box {
	height:80px;
}


.login-err {
	color: #D1511A;
	text-align:left;
	height:46px;
	margin-top:8px;
}


/* ---------- navigation ナビゲーション ---------- */

.nav-title { /* タイトル画像　ヘッダーflexレイアウト左固定 */
	margin-left:24px;
	margin-top:10px;
	width:215px;
}
.navi-menu { /* 上部メニュー　ヘッダーflexレイアウト中央 */
	flex: 1;
	font-size: 0; /* inline-block の空白対応 */
}
.nav-icon { /* アイコンメニュー　ヘッダーflexレイアウト右固定+ */
	width:200px;
	padding-top:12px;
	margin-right:24px;
	text-align:right;
}
.nav-icon input[type="image"]  { /* アイコン画像の設定 */
	margin-left:16px;
}

.nav-icon button { /* ユーザーアイコン表示 */
	height:28px;
	width:28px;
	line-height:26px;
	margin-left:16px;
	vertical-align:11px;
	cursor:pointer;
}

.nav-message { /* メッセージバナー　2022/4/19追加 */
	margin-top:18px;
	font-size:18px;
	font-weight:bold;
	color:#2D55AD;
}
.i-pr { /* PRアイコン　2022/4/19追加 */
	color: #C64610;
	font-size: 11px;
	height: 9px;
	padding: 0 5px;
	border:#C64610 solid 1px;
	border-radius: 4px;
    vertical-align: 2px;
	font-weight: normal;
}

.nav-message2 { /* メッセージバナー背景あり　2022/4/20追加 */
	margin-top:16px;
	margin-left:-7px;
	font-size:18px;
	font-weight:bold;
	color: #0033CC;
	background:#ffff66;
	padding:2px 7px;
	height:25px;
}
.i-pr2 { /* PRアイコン色変更　2022/4/20追加 */
	color: #ff0000;
	font-size: 11px;
	height: 9px;
	padding: 0 5px;
	border:#ff0000 solid 1px;
	border-radius: 4px;
    vertical-align: 2px;
	font-weight: normal;
}

/* 上部メニュー
以下のクラスの組み合わせ
nav = すべてにつく（共通の指定）
nav-off = オフの状態につく
nav-hover = マウスホバーに反応する
 */
.nav {
	display: inline-block;
	margin-bottom:0;
	margin-left:25px;
	margin-right:25px;
	margin-top:26px;
	font-size:16px;
	font-weight: bold;
	text-align:;
	color:#2D55AD;
}
.nav-off { /*オフ*/
	border:none;
	color:#798A9A;
	cursor:pointer;
}
.nav-off.nav-hover:hover{ /*オフのホバー*/
	color:#2D55AD;
	cursor:pointer;
	transition: 0.4s ;
}

/* ---------- sidebar サイドメニュー ---------- */
.sidebar p {
	font-size:14px;
	margin-bottom:15px;
	margin-left:35px;
	margin-top:15px;
	color:#798A9A;
}

.sidebar hr {
	margin:23px 24px;
}

/* メニュー
以下のクラスの組み合わせ
menu = タブすべてにつく（共通の指定）
menu-off = オフの状態につく
menu-hover = マウスホバーに反応する
 */
.menu {
	display: block;
	font-size: 14px;
	vertical-align:middle;
	margin-left:20px;
	margin-right:20px;
	margin-bottom:10px;
	padding:7.5px 16px;
	background-color:#D9DEE6;
	border-radius: 4px;
	color:#1A2127;
	font-weight: bold;
}
.menu-off { /*オフ*/
	background-color: transparent;
	font-weight: normal;
	cursor:pointer;
}
.menu-off.menu-hover:hover{ /*オフのホバー*/
	background-color:#D9DEE6;
	border-radius: 4px;
	color:#1A2127;
	font-weight: bold;
	transition: 0.4s ;
}

/* メニューの件数表示 */
.count { /* 件数表示のみ */
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	padding:3px 8px;
	margin-top:-3px;
	float:right;
}
.count.mark { /* 丸付き数字・白文字 */
	color:#ffffff;
	background-color: #D1511A;
	border-radius: 30px;
}



/* ---------- main-inner メインコンテンツ ---------- */

.contents {
	padding-bottom:24px;
	padding-left:24px;
	padding-right:24px;
	padding-top:26px;
}

.contents h1 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:16px;
}

.contents h2 {
	font-weight: bold;
	font-size: 18px;
}

.contents h3 {
	font-weight: bold;
	font-size: 16px;
}

.contents h4 {
	font-weight: bold;
	font-size: 14px;
}

.contents p {
	font-size: 14px;
	line-height: 18px;
	margin-top:20px;
}

 /* タイトルの戻るボタン画像（＜） */

.btn-back {
	margin-right:5px;
	vertical-align: -10px;
	cursor:pointer;
}

/* ---------- search 検索条件 ---------- */
.search { /*検索条件全体枠*/
	margin-bottom:8px;
	white-space: nowrap;
}
.search-inner { /* 各条件を横に並べるための枠 */
	display: flex;
	display: -webkit-flex;
	margin-bottom:24px;
	font-size: 0; /* inline-block の空白対応 */
}
.s-area { /* 横並びのための共通設定 */
	display: flex;
	display: -webkit-flex;
	font-size: 14px;
}
.s-btn { /* 検索ボタン配置 */
	margin-right:24px;
}
.s-joken { /* 条件テキスト配置 */
	flex:1;
	padding-top:5px;
	font-size: 14px;
	line-height: 30px;
}
.s-meisai { /* 明細取得・設定ボタン配置 */
	text-align:right;
	white-space: nowrap;
}


/* 検索結果　個別設定　※配置や色、サイズ変更に対応できるように個別で指定 */
.search-inner2 { /* 件数などを横に並べるための枠 */
	display: flex;
	display: -webkit-flex;
	height:27px;
	font-size: 0; /* inline-block の空白対応 */
}
.s-zenken {/* 検索結果　全件数 */
	margin-right:24px;
}
.s-nyukin-all {/* 検索結果　入金額合計 */
	margin-right:24px;
}
.s-csvdownload {/* 検索結果　CSVダウンロード */
	margin-right:24px;
}
.s-nyukin-check {/* 検索結果　チェックした入金額 */
	margin-right:24px;
}
.s-nyukin-check-kesikomi {/* 検索結果　チェックした入金額の処理（消込・CSV) */
	margin-right:12px;
	color: #BCC5D0;
}
.s-nyukin-check-kesikomi a {
	color: #BCC5D0;
	text-decoration: none;
}

/* ----------フィルタボタン　サイズ固定（請求書詳細で使用） ---------- */
/* すべて・金額一致・金額不一致
以下のクラスの組み合わせ
filter = すべてにつく（共通の指定）
filter-off = オフの状態につく
filter-hover = マウスホバーに反応する
 */
.filter-area { 
	border: 1px solid #D9DEE6;
	border-radius: 4px;
	font-size: 0; /* inline-block の空白対応 */
	height:35px;
	width:264px;
}
.filter-area2 { /*  ボタン2つの場合 */
	border: 1px solid #D9DEE6;
	border-radius: 4px;
	font-size: 0; /* inline-block の空白対応 */
	height:35px;
	width:176px;
	margin-left:44px;
}
.filter {
	display: inline-block;
	width: 88px;
	height:35px;
	background-color:#2D55AD;
	margin:0;
	padding:7px 0;
	font-weight: bold;
	font-size: 14px;
	text-align:center;
	color:#ffffff;
}
.filter-off { /*オフ*/
	background-color:#F6F8FB;
	color:#798A9A;
	font-weight: bold;
	cursor:pointer;
}
.filter-off.filter-hover:hover{ /*オフのホバー*/
	background-color:#2D55AD;
	color:#ffffff;
	font-weight: bold;
	cursor:pointer;
	transition: 0.4s ;
}
.filter.left { /* 左端の角丸 */
	border-top-left-radius:4px;
	border-bottom-left-radius:4px;
	border-right: 1px solid #D9DEE6;
}
.filter.right { /* 右端の角丸 */
	border-top-right-radius:4px;
	border-bottom-right-radius:4px;
	border-left: 1px solid #D9DEE6;
}
.filter.right2 { /* 右端の角丸 ボタン2つの場合 */
	border-top-right-radius:4px;
	border-bottom-right-radius:4px;
	
}


/* ----------フィルタボタン2　サイズは文字数に合わせて可変（入金一覧で使用） ---------- */
/* すべて・金額一致・金額不一致
以下のクラスの組み合わせ
filter2 = すべてにつく（共通の指定）
filter2-off = オフの状態につく
filter2-hover = マウスホバーに反応する
 */
.filter2-area { 
	border: 1px solid #D9DEE6;
	border-radius: 4px;
	font-size: 0; /* inline-block の空白対応 */
	height:35px;
}
.filter2 {
	display: inline-block;
	height:35px;
	min-width: 88px;
	background-color:#2D55AD;
	margin:0;
	padding:7px 17px;
	font-weight: bold;
	font-size: 14px;
	text-align:center;
	color:#ffffff;
	border-right: 1px solid #D9DEE6;
}
.filter2-off { /*オフ*/
	background-color:#F6F8FB;
	color:#798A9A;
	font-weight: bold;
	cursor:pointer;
	border-right: 1px solid #D9DEE6;
}
.filter2-off.filter2-hover:hover{ /*オフのホバー*/
	background-color:#2D55AD;
	color:#ffffff;
	font-weight: bold;
	cursor:pointer;
	transition: 0.4s ;
}
.filter2.left { /* 左端の角丸 */
	border-top-left-radius:4px;
	border-bottom-left-radius:4px;
	border-right: 1px solid #D9DEE6;
}
.filter2.right { /* 右端の角丸 */
	border-top-right-radius:4px;
	border-bottom-right-radius:4px;
}


.filter2:hover { /* オン状態のマウスオン */
	cursor: pointer;
	background-color: #1F3E84;
	transition: 0.4s ;
}


/* ---------- 検索条件の固定（IE未対応） ---------- */

.search-sticky {
	position: sticky; 
	position: -webkit-sticky;
	top:57px;
	background:#ffffff;
	padding-top:18px;
	z-index:1;
}

/* ---------- page 検索結果のページ切替 ---------- */
.search-page { 
	display: flex;
	display: -webkit-flex;
	margin-top:30px;
}
.search-page-select { /*1ページの表示件数選択*/
	margin-top:10px;
	font-size: 12px;
}
.search-page-next { /*表示ページ番号の入力 */
	flex:1;
	text-align:right;
}
.search-page input[type="text"] { /*表示ページ番号の入力欄*/
	width:40px;
	height:32px;
	text-align:center;
	margin-right:8px;
	padding:0;
	background: #FFFFFF;
	border: 1px solid #BCC5D0;
	border-radius: 4px;
}
.search-page-in { /*表示ページ番号の入力欄の外枠 */
	display:inline-block;
}
.bt-next {
	margin-left:30px;
}
.bt-prev {
	margin-right:30px;
}


/* ---------- Search cond　検索条件（ポップアップ） ---------- */

.search-pop { /* 検索条件ポップアップ　外枠 */
	display:none;
	width: 640px;
	background: #FFFFFF;
	border: 1px solid #D9DEE6;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
}
.search-cond { /* ポップアップのフォーム入力枠 */
	padding-top:8px;
	padding-left:24px;
	padding-bottom:30px;
}
.search-cond p {
	font-size: 12px;
	line-height:16px;
	font-weight: bold;
	margin-bottom:8px;
	margin-top:24px;
}
.search-cond-footer { /* 検索条件フッター */
	border-top: #D9DEE6 solid 1px;
	padding: 24px;
}

/* ---------- data-foam データ登録全般 ---------- */

.data-foam { /* フォーム全体枠 */
	padding-top:0px;
	padding-bottom:40px;
}
.data-foam p { /* フォーム見出し文字 */
	font-size: 12px;
	line-height:16px;
	font-weight: bold;
	margin-bottom:8px;
	margin-top:24px;
}
.link-text { /* 「設定変更」など小さな文字リンク */
	font-size: 12px;
	line-height:16px;
	font-weight: normal;
	margin-bottom:8px;
	margin-top:24px;
	text-align:right;
}
.data-foam-footer { /* フッター */
	background: #FFFFFF;
	border-top: 1px solid #D9DEE6;
	padding:20px 24px;
	margin-top:24px;
	margin-left:-24px;
	margin-right:-24px;
	box-shadow: 0px -4px 20px rgba(26, 33, 39, 0.04);
	position: fixed;
    bottom: 0;
	width:100%;
	max-width:1970px;
	min-width:1010px;
}

/* ---------- 入金詳細 ---------- */

.nyukin-status { /* 入金ステータス */
	margin-bottom:26px;
}

.nyukin-box { /* 角丸の枠 */
	width: 1078px;
	min-height: 192px;
	border: 1px solid #BCC5D0;
	box-sizing: border-box;
	border-radius: 4px;
	padding: 32px 24px 16px;
	margin-bottom:20px;
}

.nyukin-midasi { /* 入金情報　見出し */
	font-size: 14px;
	color: #4F6071;
	min-height:35px;
}
.nyukin-text { /* 入金情報　データ */
	font-size: 14px;
	color: #1A2127;
	min-height:35px;
}

.kesikomi-0 { /* 消し込み対象0　メッセージ表示 */
	font-weight: bold;
	font-size: 20px;
	text-align:center;
	color:#798A9A;
	margin-top:24px;
}

.kesikomi-data { /* グレーの角丸枠 */
	padding: 16px 24px;
	margin: 24px 0px;
	background: #F6F8FB;
	border-radius: 4px;
}


 /*  */
.kesikomi-keisan {
	border: 1px solid #D9DEE6;
	border-radius: 8px;
	padding:0 16px 8px;
}
.kesikomi-midasi {
	color:#4F6071;
}
.kesikomi-bold {
	font-weight:bold;
	color:#1A2127;
}

/* ---------- 口座 ---------- */

.koza-box { /* 角丸の枠 */
	width: 1078px;
	min-height: 192px;
	border: 1px solid #BCC5D0;
	box-sizing: border-box;
	border-radius: 4px;
	padding: 32px 24px 16px;
	margin-bottom:26px;
}


.koza-midasi { /* 口座情報　見出し */
	font-size: 14px;
	color: #4F6071;
	min-height:35px;
}
.koza-text { /* 口座情報　データ */
	font-size: 14px;
	font-weight:bold;
	color: #1A2127;
	min-height:35px;
}

/* 自動口座登録　対象の口座選択ポップアップ */
.koza-jido {
	display:block;
	position: fixed;
	width: 400px;
	height: auto;
	top:200px;
	left: calc(50% - 640px/2);
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:24px 26px;
	z-index:99;
}
.koza-jido h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding:0;
}
.koza-jido h2 {
	font-weight: normal;
	font-size: 16px;
	line-height: 32px;
	padding:0;
}
.koza-jido select {
	padding:8px;
	background: #FFFFFF;
	border: 1px solid #BCC5D0;
	border-radius: 4px;
	width:400px;
}

/* ---------- 仕訳 ---------- */

.siwake-box { /* 角丸の枠 */
	width: 1078px;
	min-height: 192px;
	border: 1px solid #BCC5D0;
	box-sizing: border-box;
	border-radius: 4px;
	padding: 32px 24px 16px;
	margin-bottom:40px;
}

.siwake-shosai { /* グレーの角丸枠 詳細条件 */
	padding-bottom:24px;
	padding-top:1px;
	padding-left:24px;
	padding-right:24px;
	margin-bottom:24px;
	margin-top:16px;
	width:754px;
	background: #F6F8FB;
	border-radius: 4px;
}

.siwake-info { /* ※のコメント */
	font-size: 12px;
	color: #4F6071;
	margin-left:16px;
}

.siwake-joken { /* 下の条件表示 */
	display:inline-block;
	margin-right:8px;
	vertical-align: middle;
}
.siwake-joken-text { /* 条件の文字省略 */
	display:inline-block;
	vertical-align:-4px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	width:130px;
}

 /* 出力条件（ポップアップ） */
.siwake-joken-edit {
	width: 870px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.siwake-joken-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:0;
}
.siwake-joken-edit h2 {
	font-weight: bold;
	font-size: 18px;
	line-height: 32px;
	padding-top:0;
	padding-bottom:8px;
}

.siwake-joken-waku1 { /* 伝票区切り枠 */
	padding-bottom:24px;
	padding-top:1px;
	padding-left:24px;
	padding-right:24px;
	margin-bottom:24px;
	margin-top:24px;
	background: #ffffff;
	border: 1px solid #D9DEE6;
	border-radius: 4px;
}
.siwake-joken-waku2 { /* グレーの角丸枠 */
	padding-bottom:24px;
	padding-top:1px;
	padding-left:24px;
	padding-right:24px;
	margin-top:16px;
	background: #F6F8FB;
	border-radius: 4px;
	width:754px;
}



/* ---------- 仕訳パターン詳細 ---------- */
.siwake-p-waku1 { /* 伝票区切り枠 */
	padding-bottom:24px;
	padding-top:1px;
	padding-left:24px;
	padding-right:24px;
	margin-bottom:24px;
	margin-top:24px;
	background: #ffffff;
	border: 1px solid #D9DEE6;
	border-radius: 4px;
	width:754px;
}
.siwake-p-waku2 { /* グレーの角丸枠　区切り枠内 */
	padding-bottom:24px;
	padding-top:1px;
	padding-left:24px;
	padding-right:24px;
	margin-top:16px;
	background: #F6F8FB;
	border-radius: 4px;
	width:682px;
}

.siwake-p-waku3 { /* グレーの角丸枠　余白下 */
	padding-bottom:24px;
	padding-top:1px;
	padding-left:24px;
	padding-right:24px;
	margin-bottom:16px;
	background: #F6F8FB;
	border-radius: 4px;
	width:682px;
}
.siwake-csv {
	width: 802px;
	height: 328px;
	overflow:auto;
	border: 1px solid #D9DEE6;
	box-sizing: border-box;
	border-radius: 4px;
	margin:16px 0;
	padding:5px;
}

.siwake-line { /* 仕分けタイトル */
	margin-top:40px;
	padding-top:30px;
	border-top: 3px dashed #D9DEE6;
}

 /* 仕訳　ヘッダー情報編集画面（ポップアップ） */
.siwake-h-edit {
	width: 670px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px;
}
.siwake-h-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
}


/* ---------- 消込処理 ---------- */

.kesikomi-box { /* 角丸の枠 */
	width: 1078px;
	border: 1px solid #BCC5D0;
	box-sizing: border-box;
	border-radius: 4px;
	padding: 32px 24px 16px;
}
.kesikomi-tuika { /* 追加条件 グレーの枠 */
	padding:18px 24px;
	margin-bottom:24px;
	margin-top:-10px;
	margin-left:26px;
	background: #F6F8FB;
	border-radius: 4px;
}
.kesikomi-joken-text {
	margin-left:30px;
	margin-top:8px;
	margin-bottom:24px;
	font-size:12px;
}
.kesikomi-joken-text14 {
	font-size:14px;
	margin-top:8px;
	margin-left:-8px;
}


.kesikomi-midasi { /* 消込処理　見出し */
	font-size: 14px;
	color: #4F6071;
	min-height:35px;
}
.kesikomi-text { /* 消込処理　データ */
	font-size: 14px;
	font-weight:bold;
	color: #1A2127;
	min-height:35px;
}

 /* 変更画面（ポップアップ） */
.kesikomi-edit {
	width: 650px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.kesikomi-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:24px;
}



/* ---------- アイコンとユーザー名の表示　各種一覧、口座登録や所属で使用 ---------- */
.user-member {
	font-weight:bold;
	font-size: 14px;
	margin-right:20px;
}
.user-member input[type="image"]  { /* 削除ボタン */
	margin-left:5px;
	vertical-align: -3px;
}
.user-member .i-user {
	margin:3px 0;
}


 /* ユーザーロック中 */
.user-rock {
	font-weight: normal;
	font-size: 14px;
	line-height:24px;
	margin-right:20px;
	color:#D1511A;
	background:url(../img/i_rock.png?v=1) no-repeat ;
	padding-left:30px;
}

 /* ユーザー仮登録 */
.user-kari {
	font-weight: normal;
	font-size: 14px;
	line-height:24px;
	color:#58A69C;
}



/* ------------------ 請求書一覧 ------------------ */

/* ポップアップ（確認して申請・確認して承認・確認して発行） */
.invo-pop {
	width: 920px;
	height: auto;
	background: #ffffff;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius:8px;
	padding:0;
}
.invo-pop-title {
	padding-bottom:14px;
	padding-left: 24px;
	padding-right:44px;
	padding-top:18px;
}
.invo-pop-page {
	font-size: 16px;
}
.invo-pop-page img {
	vertical-align:middle;
	margin:0 16px;
	cursor:pointer;
}

.invo-pop-btn {
	display: flex;
	display: -webkit-flex;
	align-items: center;
	margin-bottom:24px;
}
.invo-pop-btn-r {
	margin-left:auto;
}


.invo-pop-main {
	background:#E5E8EC;
	border-radius:0 0 8px 8px;
	height: auto;
	padding:25px;
}
.invo-pop-preview {
	display:inline-block;
	vertical-align:top;
	width:640px;
	height:900px;
	margin-right:20px;
}
.invo-pop-preview iframe {
    width:100%;
    height:100%;
}

.invo-pop-memo {
	display:inline-block;
	vertical-align:top;
	width: 202px;
	min-height: 275px;
	background: #F6F8FB;
	border: 1px solid #F6F8FB;
	border-radius: 4px;
	box-sizing: border-box;
	padding:16px;
}

.invo-pop-memo-title {
	font-weight: bold;
	font-size: 14px;
	margin-bottom:35px;
}
.invo-pop-memo-text {
	font-size: 12px;
	line-height: 18px;
	max-height:700px;
	overflow:auto;
}

 /* 承認の確認（ポップアップ） */
.invo-pop-atten {
	width: 592px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.invo-pop-atten h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:8px;
}
.invo-pop-atten-text {
	font-size: 14px;
	line-height: 18px;
	min-height:40px;
	margin-bottom:10px;
}

.invo-pop-atten-text ul {
	margin-left:20px;
}

.invo-pop-atten-list {
	height:300px;
	overflow:auto;
	border-bottom: 1px solid #D9DEE6;
	border-top: 1px solid #D9DEE6;
}


/* ------------------ 請求書詳細 ------------------ */

/* 請求書タブ */
.invoice-header { /* タブ全体枠 */
	display: flex;
	display: -webkit-flex;
	background: #FFFFFF;
	border-top: 1px solid #D9DEE6;
	border-right: 1px solid #D9DEE6;
	border-left: 1px solid #D9DEE6;
	border-radius: 4px 4px 0px 0px;
	width:770px;
	height:67px;
	padding:0 16px;
}
/* 上部メニュー
以下のクラスの組み合わせ
inv-tab = すべてにつく（共通の指定）
inv-tab-off = オフの状態につく
inv-tab-hover = マウスホバーに反応する
 */
.inv-tab {
	padding:24px 24px 20px;
	font-weight: bold;
	font-size: 14px;
	border-bottom: #2D55AD 4px solid;
	margin-right:2px; /* タブ選択時の隙間設定追加 */
}
.inv-tab-off { /*オフ*/
	padding:24px;
	color: #798A9A;
	cursor:pointer;
	border:none;
}
.inv-tab-off.inv-tab-hover:hover{ /*オフのホバー*/
	padding:24px 24px 20px;
	border-bottom: #2D55AD 4px solid;
	color:#1A2127;
	cursor:pointer;
}

/* 上部　右側メニュー */
.inv-menu {
	flex:1;
	font-weight: bold;
	font-size: 14px;
	text-align:right;
	padding-top:20px;
}
.inv-menu a {
	color:#1A2127;
	text-decoration:none;
}
.inv-menu input[type="image"]  { /* …ボタン */
	vertical-align: -5px;
}


/* 請求書メイン　グレー背景 */
.invoice-main {
	background: #D9DEE6;
	border: 1px solid #D9DEE6;
	border-radius: 0px 0px 4px 4px;
	width:674px;
	height:964px;
	padding:64px;
}
.invoice-main iframe {
    width:100%;
    height:100%;
}

.invoice-no-reserve { /* 次回発行予定なし */
	margin:-48px;
	padding:24px;
	background:#ffffff;
	height:1012px;
}

.invoice-rireki { /* 白背景（履歴などのリスト表示用） */
	background: #ffffff;
	border: 1px solid #D9DEE6;
	border-radius: 0px 0px 4px 4px;
	width:802px;
	height:1092px;
	overflow:auto;
}

.invoice-mail-top { /* メール　メニュー部分 */
	width:534px;
	background: #ffffff;
	padding-bottom:17px;
	padding-top:24px;
	padding-left:268px;
	border: 1px solid #D9DEE6;
}
.invoice-mail { /* メール　発行文面・督促文面 */
	background: #D9DEE6;
	border: 1px solid #D9DEE6;
	border-radius: 0px 0px 4px 4px;
	width:802px;
	height:960px;
}
.invoice-mail-rireki { /* メール　送信履歴 */
	background: #ffffff;
	border-bottom: 1px solid #D9DEE6;
	border-left: 1px solid #D9DEE6;
	border-right: 1px solid #D9DEE6;
	border-radius: 0px 0px 4px 4px;
	width:802px;
	height:960px;
	overflow:auto;
}

.invoice-mail-text { /* メール　本文 */
	margin:16px;
	padding:24px;
	background:#ffffff;
	height:880px;
	overflow:auto;
}
.mail-title { /* メール　タイトル */
	font-size:18px;
	margin-bottom:24px;
}
.mail-address { /* 送信先表示　全体枠 */
	display: flex;
	display: -webkit-flex;
	margin-bottom:8px;
}
.mail-to {  /* TO・CC・BCC */
	font-size: 14px;
	color: #798A9A;
	width:40px;
	white-space: nowrap;
}
.mail-add {  /* メールアドレス */
	font-size: 14px;
	flex:1;
}
.mail-add-info {  /* アラートアイコン */
	vertical-align:-2px;
}

.mail-text { /* メール　本文 */
	font-size:14px;
	margin-top:0;
	margin-bottom:0;
	line-height: 18px;
	word-break:break-all;
	word-wrap:break-word;
}

.mail-okikae { /* 置き換えテキスト（斜体） */
	font-style: italic;
	color: #f08300;
	padding-right:5px;
}

.mail-footer { /* メール　固定の文面 */
	font-size:14px;
	line-height: 18px;
	margin-top:32px;
	width:578px;
}


/* 社内メモ */
.invoice-memo {
	background: #FFFFFF;
	border: 1px solid #D9DEE6;
	border-radius: 4px;
	width:250px;
	height:275px;
	margin-bottom:8px;
}
.invoice-memo-title {
	font-weight:bold;
	padding:16px;
	border-bottom: 1px solid #D9DEE6;
}
.invoice-memo-text {
	padding:16px;
	font-size:12px;
	height:190px;
	width:217px;
	padding:16px;
	overflow:auto;
}


/* 処理状況・基本情報 */
.invoice-info {
	background: #FFFFFF;
	border: 1px solid #D9DEE6;
	width:250px;
	height:599px;
	margin-top:26px;
}

/* 処理状況・基本情報　切替メニュー *//* 上部メニュー
以下のクラスの組み合わせ
info-tab = すべてにつく（共通の指定）
info-tab-off = オフの状態につく
info-tab-hover = マウスホバーに反応する
 */
.info-tab {
	display:inline-block;
	padding-bottom:12px;
	padding-top:16px;
	font-weight: bold;
	font-size: 14px;
	text-align:center;
	border-bottom: #2D55AD 4px solid;
	width:124px;
}
.info-tab-off { /*オフ*/
	padding-bottom:15px;
	color: #798A9A;
	cursor:pointer;
	border:none;
	border-bottom: #D9DEE6 1px solid;
}
.info-tab-off.info-tab-hover:hover{ /*オフのホバー*/
	padding-bottom:12px;
	border-bottom: #2D55AD 4px solid;
	color:#1A2127;
	cursor:pointer;
}

.info-tab.info-tab-right { margin-left:1px; }
.info-tab.info-tab-left { margin-right:1px; }

.info-box-all { /* スクロール用全体枠 */
	height:550px;
	overflow:auto;	
}
.info-box-step { /* 処理状況：ステップ表示 */
	margin-bottom: 15px;
	margin-top:0;
	padding:18px 16px 0;
	font-size: 14px;
	font-weight:bold;
}
.info-box-step-text { /* 処理状況：テキスト */
	margin-bottom: 14px;
	margin-top:0;
	padding:0 16px;
	font-size: 14px;
	line-height: 150%;
}
.info-box-step-text .date { /* 日付 */
	color: #798A9A;
}
.info-box-midasi { /* 詳細情報：見出し */
	margin-bottom: 7px;
	margin-top:0;
	padding:18px 16px 0;
	font-size: 14px;
	font-weight:bold;
}
.info-box-text { /* 詳細情報：テキスト */
	margin-bottom: 0;
	margin-top:0;
	padding:0 16px;
	font-size: 14px;
	line-height: 150%;
}
.info-box-comment { /* コメント角丸枠 */
	background: #F6F8FB;
	border-radius: 4px;
	padding:8px;
	margin:0 16px;
}

.count-gray { /* 件数表示 */
	color: #4F6071;
	background-color: #ffffff;
	border: 1px solid #D9DEE6;
	border-radius: 30px;
	font-weight: bold;
	font-size: 12px;
	text-align: center;
	padding:3px 7px;
	margin-top:-3px;
	margin-left:8px;
}


/* ---------- 請求書 承認申請などのポップアップ ---------- */

.invoice-pop {
	width: 592px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.invoice-pop h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:32px;
}

.invoice-pop-mail {
	width: 920px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.invoice-pop-mail h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:32px;
}





/* ---------- 請求書編集　区切り枠 ---------- */

.invoice-box {
	border: 1px solid #D9DEE6;
	padding: 8px 24px 32px;
	width: 1030px;
	margin-top:24px;
}
.invoice-title {
	font-weight: bold;
	font-size: 32px;
	margin-left:467px;
}

.invoice-box p { /* フォーム見出し文字 */
	font-size: 12px;
	line-height:16px;
	font-weight: bold;
	margin-bottom:8px;
	margin-top:24px;
}

.invoice-keiro { /* 承認・発行経路 */
	width: 454px;
	background: #E5E8EC;
	padding:24px;
	margin-top:24px;
}

/* ---------- 請求書編集　取引先登録 ---------- */

.invoice-client { /*取引先全体枠 */
	position: relative;
}

.invoice-client-del { /*取引先削除ボタン */
	position: absolute;
	right:140px;
	top:12px;
}

.invoice-client-del2 { /*取引先　担当者削除ボタン */
	position: absolute;
	right:40px;
	top:12px;
}

/* ---------- 請求書編集　請求担当者登録 ---------- */

.invoice-tanto { /*請求担当者全体枠 */
	position: relative;
}

.invoice-tanto-del { /*請求担当者削除ボタン */
	position: absolute;
	right:0;
	top:12px;
}

/* ---------- 請求書編集　振込先口座登録 ---------- */

.invoice-furikomi { /*振込先全体枠 */
	position: relative;
	width:490px;
}

.invoice-furikomi-del { /*振込先削除ボタン */
	position: absolute;
	right:0px;
	top:12px;
}

.invoice-furikomi-del2 { /*振込先入力欄を削除 */
	position: absolute;
	right:-50px;
	top:12px;
	cursor:pointer;
}
/* ---------- 請求書編集　プロジェクト登録 ---------- */

.invoice-project { /*プロジェクト全体枠 */
	position: relative;
}

.invoice-project-del { /*請求担当者削除ボタン */
	position: absolute;
	right:0;
	top:12px;
}


/* ---------- 請求書 明細 ---------- */
.invoice-list {
	display: flex;
	display: -webkit-flex;
}
.invoice-list-midasi {
	background: #F6F8FB;
	margin-left:-1px;
	padding:10px;
	text-align:center;
	font-size:12px;
	font-weight:bold;
	border: 1px solid #D9DEE6;
}
.invoice-list-midasi.midasi01 { width:110px; border-radius: 4px 0 0 0; }
.invoice-list-midasi.midasi02 { width:170px; }
.invoice-list-midasi.midasi03 { width:56px; }
.invoice-list-midasi.midasi04 { width:56px; }
.invoice-list-midasi.midasi05 { width:110px; }
.invoice-list-midasi.midasi06 { width:135px; }
.invoice-list-midasi.midasi07 { width:125px; }
.invoice-list-midasi.midasi08 { width:100px; border-radius: 0 4px 0 0; }

.invoice-list-data {
	background: #ffffff;
	margin-left:-1px;
	padding:10px ;
	text-align: left;
	font-size:14px;
	font-weight: normal;
	border-bottom: 1px solid #D9DEE6;
	border-left: 1px solid #D9DEE6;
	border-right: 1px solid #D9DEE6;
}
.invoice-list-data.data01 { width:110px; }
.invoice-list-data.data02 { width:170px; }
.invoice-list-data.data03 { width:56px; }
.invoice-list-data.data04 { width:56px; }
.invoice-list-data.data05 { width:110px; }
.invoice-list-data.data06 { width:135px; }
.invoice-list-data.data07 { width:125px; }
.invoice-list-data.data08 { width:100px; }

.invoice-list-data select {
	margin-top:7px;
	margin-bottom:8px;
}
.invoice-list-data .zeiritu {
	margin-top:12px;
	text-align:left;
}
	
 /* 明細　合計欄 */
.invoice-list-total {
	padding:10px;
	border-bottom: 1px solid #D9DEE6;
	border-left: 1px solid #D9DEE6;
	border-right: 1px solid #D9DEE6;
	margin-left:-1px;
	text-align:center;
}
.invoice-list-total.total01 { width:135px; padding-top:13px; }
.invoice-list-total.total01.t-bottom1 { border-top: 1px solid #D9DEE6; }
.invoice-list-total.total02 { width:125px; }
.invoice-list-total.total02.t-bottom2 { border-top: 1px solid #D9DEE6; }
.invoice-list-total.total03 { width:100px; padding-top:13px; text-align:left; }
.invoice-list-total.total03.t-bottom3 { border-top: 1px solid #D9DEE6; }

.invoice-list-total input[type="text"]:disabled { background-color:transparent; border:none; }
	
.invoice-list-tuika { /* +明細を追加リンク枠 */
	margin-right: auto;
	margin-top:16px;
}

 /* 合計金額見出し */
.bg_midasi { background: #F6F8FB; }

.invoice-box-footer { /* フッター */
	background: #FFFFFF;
	border-top: 1px solid #D9DEE6;
	padding:20px 24px;
	margin-top:24px;
	margin-left:-24px;
	margin-right:-24px;
	box-shadow: 0px -4px 20px rgba(26, 33, 39, 0.04);
	position: fixed;
    bottom: 0;
	width:100%;
	max-width:1970px;
	min-width:1010px;
}

.invoice-utiwake-box { /* 内訳ポップアップ  */
	width: 200px;
	height: auto;
	padding:16px 0;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 4px;
	z-index:1;
}


 /* 明細行　追加・削除ボタン */
.meisai_button {
	float:left;
	width:16px;
	margin-left:-30px;
	margin-top:-10px;
}
.meisai_button img {
	cursor:pointer;
    opacity: 0.5;
}
.meisai_button img:hover {
    opacity: 1.0;
}
.meisai_button .sakujo {
	margin-top:20px;
}


/* ---------- 請求書予約作成 ---------- */

/* 自動入力キーワード枠 */
.jido-keyword {
	background: #FFFFFF;
	border-bottom: 1px solid #BDC6D1;
	border-left: 1px solid #BDC6D1;
	border-right: 1px solid #BDC6D1;
	border-radius: 0px 0px 4px 4px;
	padding:16px 16px 6px;
	margin-top:-5px;
}
.jido-keyword h3 {
	font-size: 14px;
	font-weight: normal;
	color: #798A9A;
	margin-bottom:10px;
}
.jido-keyword2 {/* 内訳キーワード　ポップアップ枠 */
	background: #FFFFFF;
	font-size: 14px;
	font-weight: normal;
	color: #798A9A;
	border: 1px solid #D9DEE6;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 4px;
	text-align:left;
	padding:16px;
}
.jido-keyword2 h3 {
	font-size: 14px;
	font-weight: bold;
	color: #798A9A;
	margin-bottom:10px;
}
.jido-k-icon {
	vertical-align:-3px;
	cursor: pointer;
}

.jido-keyword3 {/* 内訳ポップアップ内　枠なし */
	background: #FFFFFF;
	font-size: 14px;
	font-weight: normal;
	color: #798A9A;
	margin:40px 0 10px;
	padding:16px;
	border: 1px solid #BDC6D1;
	border-radius: 4px;
}
.jido-keyword3 h3 {
	font-size: 14px;
	font-weight: bold;
	color: #798A9A;
	margin-bottom:10px;
}


/* 管理No表示 */
.i-yoyaku-kanri { 
	color: #798A9A;
	font-size: 12px;
	height: 9px;
	padding: 1px 7px;
	border:#BCC5D0 solid 1px;
	border-radius: 4px;
    vertical-align: 1px;
	font-weight: bold;
}

/* 一覧　請求期間　 */
.seikyukikan {
	display:inline-block;
	width:52px;
}


/* ------------------ 設定　自社情報 ------------------ */

/* 設定タブメニュー */
.set-header { /* タブ全体枠 */
	display: flex;
	display: -webkit-flex;
	background: #FFFFFF;
	width: auto;
	height:67px;
	padding:0;
}
/* 上部メニュー
以下のクラスの組み合わせ
inv-tab = すべてにつく（共通の指定）
inv-tab-off = オフの状態につく
inv-tab-hover = マウスホバーに反応する
 */
.set-tab {
	padding:24px 24px 20px;
	font-weight: bold;
	font-size: 14px;
	border-bottom: #2D55AD 4px solid;
	margin-right:2px; /* タブ選択時の隙間設定追加 */
}
.set-tab-off { /*オフ*/
	padding:24px;
	color: #798A9A;
	cursor:pointer;
	border-bottom:none;
}
.set-tab-off.set-tab-hover:hover{ /*オフのホバー*/
	padding:24px 24px 20px;
	border-bottom: #2D55AD 4px solid;
	color:#1A2127;
	cursor:pointer;
}


/* 設定 右上サブメニュー */
.set-submenu {
	position: fixed;
	width: 250px;
	height: auto;
	left: 1092px;
	top: 102px;
	border: 1px solid #D9DEE6;
	box-sizing: border-box;
	border-radius: 4px;
	padding:16px;
	font-size: 14px;
	line-height: 32px;
	background:#ffffff;
}
/* サブメニュー　アンカーリンク位置調整 */
a.anchor {
    display: block;
    padding-top: 70px;
    margin-top: -70px;
}

/* ドラッグ・プレビュー表示 */
.drag-area {
	padding:0;
	background: #F6F8FB;
	border: 1px solid #BCC5D0;
	border-radius: 4px;
	width:250px;
	height:160px;
	line-height: 18px;
	text-align:center;
	position:relative;
}
.d-preview {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:100%;
}

/* レイアウト表示枠 */
.set-layout {
	display:inline-block;
	width:194px;
}
.set-layout img {
	margin-bottom:5px;
}
.set-layout label {
	margin-left:5px;
}
.set-layout-preview {
	width: 357px;
	height: 505px;
	padding:25px;
	background: #E5E8EC;
}

.set-line { /* 設定タイトル */
	margin-top:40px;
	padding-top:30px;
	border-top: 3px dashed #D9DEE6;
}

 /* 編集ポップアップ（振込口座） */
.company-edit {
	width: 872px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px;
}
.company-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding:32px 0;
}
.company-edit h2 {
	font-weight: bold;
	font-size: 18px;
	line-height: 24px;
	padding-top:40px;
}

 /* ファイルアップロード */
.fileupload-pop {
	width: 600px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px;
}
.fileupload-pop h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding:32px 0;
}
.fileupload-pop h2 {
	font-weight: bold;
	font-size: 18px;
	line-height: 24px;
	padding-top:40px;
}


/* ------------------ 自社情報　メール　※アコーディオンは取引先と共通 ------------------ */

.company-mail-all { /* 全体枠 */
	margin-top:24px;
	width:802px;
	border-top: 1px solid #D9DEE6;
}

.company-mail-text { /* メール本文枠　※本文中のスタイル指定は請求書メールと共通 */
	padding:24px;
	background:#ffffff;
	height: auto;
}

/* ------------------ 自社情報　メール編集ポップアップ　※取引先と共通 ------------------ */

.company-mail-edit { /* 全体枠 */
	width: 872px;
	height:750px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}

.company-mail-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:8px;
}

.mail-keyword { /* 自動入力キーワード枠 */
	width: 276px;
	height: 557px;
	background: #FFFFFF;
	border-radius: 4px;
	border:#D9DEE6 solid 1px;
	overflow:auto;
}
.mail-keyword h2 {
	padding:16px;
	border-bottom:#D9DEE6 solid 1px;
	font-weight: bold;
	font-size: 14px;
	margin-bottom:12px;
}
.mail-keyword .copy {
	padding:6px 16px;
	border-bottom:#D9DEE6 solid 1px;
}
.mail-keyword .copy.seikyu {
	border: none;
}

 /* キーワードコピー用テキストボックス */
.text-copy {
	height:30px;
	width:150px;
	padding:0 16px;
	font-size:12px;
	text-align:left;
	background: #FFFFFF;
	border-radius: 30px;
	margin-bottom:10px;
}
.text-copy.jisha {
	border: 1px solid #80BE5A;
}
.text-copy.torihikisaki {
	border: 1px solid #CE7E7E;
}
.text-copy.seikyu {
	border: 1px solid #6F98EC;
}

 /* メールサンプルプレビュー */
.mail-sample-preview {
	width: 920px;
	height: auto;
	background: #ffffff;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius:8px;
	padding:0;
}
.p-title {
	padding:8px;
}

.p-text {
	background:#ffffff;
	border: #E5E8EC solid 24px;
	border-radius:0 0 8px 8px;
	height:684px;
	overflow:auto;
}

.p-text.waku { /* 枠あり（請求書送信時） */
	border: #E5E8EC solid 1px;
	border-radius:0;
}

	


/* ------------------ 自社情報　メール設定（ドメイン） ------------------ */
.domain-edit {
	width: 592px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.domain-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:8px;
}

.domain-setting {
	font-size: 14px;
	line-height: 18px;
	margin-bottom:16px;
	margin-top:24px;
}
.domain-setting2 {
	font-size: 14px;
	line-height: 18px;
	margin-bottom:24px;
	margin-top:0;
}


.domain-atten {
	font-size: 12px;
	line-height: 18px;
	color: #4F6071;
	margin-top:10px;
}


/* ------------------ 設定 ユーザー ------------------ */

/* ユーザーアイコン表示　大きいもの */
.user-icon {
	float:right;
	margin-top:-30px;
}

/* テキスト枠ごとの編集リンク */
.s-link {
	font-size:12px;
	float:right;
}

/* 権限設定枠 */
.kengen-box {
	padding:26px 24px 0;
	margin-top:24px;
	width: 294px;
	border: 1px solid #D9DEE6;
	border-radius: 4px;
}
.kengen-midasi {
	font-size:16px;
	font-weight: bold;
	padding-bottom:26px;
	padding-left:5px;
}
.kengen-inner {
	display: flex;
	display: -webkit-flex;
	justify-content: left;
	align-items: center;
	border-top: 1px solid #D9DEE6;
	padding-bottom:10px;
	padding-left:5px;
	padding-right:0;
	padding-top:10px;
}
.kengen-inner-midasi {
	display: flex;
	display: -webkit-flex;
}
.kengen-text {
	flex:1;
	font-size: 14px;
}
.kengen-check {
	width:144px;
	padding-right:5px;
}

.kengen-bg { /* 「請求」「入金」「仕訳」の背景色 */
	background-color:#F6F8FB;
}

/* ユーザーロック 上部に表示 */
.user-st-lock {
	background: url(../img/i_rock.png) no-repeat 14px, linear-gradient(0deg, rgba(209, 81, 26, 0.1), rgba(209, 81, 26, 0.1)), #FFFFFF;
	border: 1px solid #D1511A;
	box-sizing: border-box;
	border-radius: 4px;
	color: #D1511A;
	padding-bottom:16px;
	padding-left:44px;
	padding-right:24px;
	padding-top:16px;
	width: 526px;
	height: 56px;
	font-size:14px;
	font-weight:bold;
}
.user-st-lock a {
	font-weight:normal;
	float:right;
}

/* ユーザー仮登録 上部に表示 */
.user-st-kari {
	background: #F6F8FB;
	border-radius: 4px;
	box-sizing: border-box;
	border-radius: 4px;
	color: #1A2127;
	padding:24px;
	width: 560px;
	height: auto;
	font-size:14px;
	font-weight: normal;
}

.user-st-kari h1 {
	font-weight:bold;
	font-size:18px;
	margin-bottom:10px;
}


/* ------------------ ユーザーアイコン ------------------ */

 /* 基準 */
.i-user {
	display:inline-block;
	height:26px;
	width:26px;
	border-radius:50%;
	font-size: 12px;
	font-weight: bold;
	line-height:26px;
	text-align:center;
	border: 1px solid #FFFFFF;
}

/* 大きいアイコン */
.i-user-big {
	display:inline-block;
	height:98px;
	width:98px;
	border-radius:50%;
	font-size: 50px;
	font-weight: bold;
	line-height:98px;
	text-align:center;
	vertical-align:middle
}

/* 色設定 */
.i-color01 { background-color:#DF8781; color:#ffffff; }
.i-color02 { background-color:#CF5980; color:#ffffff; }
.i-color03 { background-color:#A02556; color:#ffffff; }
.i-color04 { background-color:#F2C66A; color:#000000; }
.i-color05 { background-color:#E59E55; color:#ffffff; }
.i-color06 { background-color:#EE7058; color:#ffffff; }
.i-color07 { background-color:#BBC367; color:#000000; }
.i-color08 { background-color:#58AD83; color:#ffffff; }
.i-color09 { background-color:#30754D; color:#ffffff; }
.i-color10 { background-color:#4DA2DC; color:#ffffff; }
.i-color11 { background-color:#6F98EC; color:#ffffff; }
.i-color12 { background-color:#5C64A7; color:#ffffff; }
.i-color13 { background-color:#B8A8D2; color:#000000; }
.i-color14 { background-color:#9876A2; color:#ffffff; }
.i-color15 { background-color:#883E9C; color:#ffffff; }
.i-color16 { background-color:#d3d3d3; color:#000000; }
.i-color17 { background-color:#a9a9a9; color:#ffffff; }
.i-color18 { background-color:#757575; color:#ffffff; }

/* 2名 */
.i-two {
	transform: scale(0.75);
	margin-left:0;
	font-size:0;
}
.i-two1 {
	font-size:14px;
}
.i-two2 {
	font-size:14px;
	margin-left:-6px;
}
/* 3名 */
.i-three {
	transform: scale(0.75);
	font-size:0;
	margin-left:-12px;
}
.i-three1 {
	font-size:14px;
}
.i-three2 {
	font-size:14px;
	vertical-align:-10px;
	margin-left:-11px;
}
.i-three3 {
	font-size:14px;
	vertical-align:-20px;
	margin-left:-45px;
}
.i-four {
	font-size:12px;
}


/* ユーザーアイコン設定 編集画面（ポップアップ） */
.icon-edit {
	width: 560px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.icon-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	margin-bottom:24px;
}

.icon-color {
	display: flex;
	display: -webkit-flex;
	flex-direction: column;
	flex-wrap: wrap;
	width:168px;
	height:85px;
	border: 1px solid #BCC5D0;
	border-radius: 8px;
	padding:8px;
	margin-right:40px;
}
.icon-color	.i-user {
	width:20px;
	height:20px;
	border: 3px solid #ffffff;
	margin:1px;
	cursor:pointer;
}
.i-user.i-select {
	border: 3px solid #D9DEE6;
}

/* ユーザーメールアドレス登録（ポップアップ） */
.mail-edit {
	width: 560px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.mail-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	margin-bottom:24px;
}

/* パスワード変更（ポップアップ） */
.password-edit {
	width: 1090px;
	height: auto;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.password-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	margin-bottom:24px;
}
.password-edit .password-info {
	top:60px;
	left:400px;
}

.password-edit-text {
	margin-bottom:50px;
	margin-top:30px;
	font-size: 14px;
	line-height: 24px;
}


/* ------------------ 消費税区分詳細 ------------------ */

.tax-list {
	display: flex;
	display: -webkit-flex;
	width:812px;
}

.tax-list-midasi {
	background: #F6F8FB;
	margin-left:-1px;
	padding:12px 0;
	text-align:center;
	font-size:12px;
	font-weight:bold;
	border: 1px solid #D9DEE6;
}
.tax-list-midasi.midasi01 { width:155px; border-radius: 4px 0 0 0; }
.tax-list-midasi.midasi02 { width:100px; }
.tax-list-midasi.midasi03 { width:230px; }
.tax-list-midasi.midasi04 { width:230px; }
.tax-list-midasi.midasi05 { width:92px; border-radius: 0 4px 0 0; }

.tax-list-data {
	background: #ffffff;
	margin-left:-1px;
	padding:24px 0;
	font-size:14px;
	font-weight: normal;
	border-bottom: 1px solid #D9DEE6;
	border-left: 1px solid #D9DEE6;
	border-right: 1px solid #D9DEE6;
}
.tax-list-data.data01 { width:155px;  }
.tax-list-data.data01.tax-bottom1 { width:155px; border-radius: 0 0 0 4px; }
.tax-list-data.data02 { width:100px; }
.tax-list-data.data03 { width:230px; }
.tax-list-data.data04 { width:230px; }
.tax-list-data.data05 { width:92px; }
.tax-list-data.data05.tax-bottom5 { border-radius: 0 0 4px 0; }

.t-inner { margin:0 16px;}
.t-inner01 { margin:0 8px;}
.t-inner05 { margin-left:36px; margin-top:3px; }


/* ------------------ 承認・発行経路詳細 ------------------ */

/* 請求書作成者 */
.sakuseisha-box { 
	padding: 32px 24px;
	margin-top: 24px;
	background: #F6F8FB;
	border-radius: 4px;
	width:846px;
}
.b-title {
	font-weight:bold;
	font-size:14px;
	margin:0;
}

.sakuseisha-inner {
	display: flex;
	display: -webkit-flex;
	align-items: flex-end;
	margin-bottom:16px;
}
.sakuseisha-joken01 {
	margin-right:20px;
}
.sakuseisha-joken02 {
	vertical-align:0;
	margin-right:20px;
	padding-bottom:14px;
}
.sakuseisha-joken03 { /* 削除ボタン */
	margin-left:-10px;
	margin-bottom:10px;
}


 /* 承認ステップ */
.shonin-step {
	padding-left: 50px;
	padding-top:5px;
	background:url(../img/bg_shoninstep.png)  repeat-y;
}
.shonin-step p {
	margin-top:8px;
}
.shonin-step hr {
	width:838px;
	margin:16px 0;
	text-align:left;
}
.shonin-step2 {
	padding-left: 50px;
}
.shonin-step2 p {
	margin-top:8px;
}
.shonin-step2 hr {
	width:838px;
	margin:16px 0;
	text-align:left;
}

.shonin-step-inner { /* 所属・役職・ユーザー選択の全体枠（横に並べる） */
	display: flex;
	display: -webkit-flex;
	align-items: flex-end;
	margin-bottom:16px;
}
.step-joken01 { /* 所属・役職・ユーザーのドロップダウン枠 */
	margin-right:20px;
}
.step-joken02 { /* ドロップダウンの間の文字「の」 */
	vertical-align:0;
	margin-right:20px;
	padding-bottom:14px;
}
.step-joken03 { /* 削除ボタン */
	margin-left:-10px;
	margin-bottom:10px;
}


.shonin-step h3 {
	font-weight: bold;
	font-size: 16px;
	margin-bottom:24px;
	margin-left:-50px;
	margin-top:50px;
}

.step-no {
	display:inline-block;
	height:40px;
	width:40px;
	border-radius:50%;
	font-weight: bold;
	font-size: 18px;
	line-height:40px;
	text-align:center;
	border: 1px solid #D9DEE6;
	margin-right:8px;
	background:#ffffff;
}
.step-delete {
	vertical-align:-6px;
	cursor:pointer;
}

/* 閲覧者 */
.eturan-box { 
	padding: 32px 24px;
	margin-top: 50px;
	background: #ffffff;
	border: 1px solid #BCC5D0;
	border-radius: 4px;
	width:840px;
}

/* ------------------ お知らせ ------------------ */

.osirase-date {
	margin-top:40px;
	margin-bottom:24px;
	font-weight: bold;
	font-size: 14px;
}
.osirase-text {
	width:710px;
	margin-bottom:24px;
}
.osirase-text p{
	font-size: 14px;
	line-height: 28px;
}

/* ------------------ パスワードの再設定 ------------------ */

.pass-reset-text { /* タイトル下のテキスト */
	margin-bottom:30px;
	margin-top:40px;
	font-size: 14px;
	line-height: 18px;
}

.pass-reset-id {  /* ユーザーIDの表示 */
	font-weight:normal;
	margin-left:16px;
	font-size: 12px;
}

.password-info { /* パスワード要件　固定枠  */
	position: absolute;
	left: 512px;
	top:158px;
	width: 662px;
	height: auto;
	padding:24px;
	background: #F6F8FB;
	border-radius: 8px;
}
.r-title {
	font-weight: bold;
	font-size: 14px;
	margin-bottom:4px;
}
.r-text { /* パスワード要件　テキスト  */
	font-size: 12px;
	line-height: 18px;
}
.r-text ul {
	padding-left:22px;
}
.r-text pre {
	margin:0;
	padding-left:22px;
	font-family:"Hiragino Sans","Meiryo UI" ;
}

/* ------------------ 取引先　取引先詳細 ------------------ */

.client-all { /* 取引先を並べる全体枠  */
	display: flex;
	display: -webkit-flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	align-items: flex-start;
	margin-top:24px;
}
.client-box { /* 取引先の枠  */
	padding: 24px;
	width: 478px;
	height: auto;
	border: 1px solid #D9DEE6;
	border-radius: 8px;
	margin-bottom:20px;
	margin-right:20px;
}
.c-area { /* 所属・役職で高さを変化させない  */
	min-height:180px;
}
.c-no { /* 管理No.  */
	font-size: 12px;
	color: #4F6071;
	margin-bottom:4px;
}
.c-name { /* 取引先名  */
	font-weight: bold;
	font-size: 18px;
	margin-bottom:10px;
}
.c-midasi { /* TELなどの見出し  */
	font-size: 14px;
	color: #4F6071;
	width:40px;
	height:20px;
}
.c-data { /* TELなどのデータ部分  */
	font-size: 14px;
	color: #1A2127;
	width:130px;
}
.c-address { /* 住所  */
	font-size: 14px;
	color: #1A2127;
	min-height:40px;
	margin-bottom:10px;
	margin-top:5px;
}
.c-mail { /* メールアドレス  */
	font-size: 14px;
	color: #1A2127;
}
.c-memo { /* 備考  */
	font-size: 14px;
	line-height: 21px;
	padding:16px;
	height: 105px;
	background: #F6F8FB;
	border-radius: 4px;
	margin-top:10px;
	margin-bottom:15px;
	overflow:auto;
}


 /* 取引先担当者 編集画面（ポップアップ） */
.client-edit {
	width: 872px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px;
}
.client-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding:32px 0;
}
.client-edit h2 {
	font-weight: bold;
	font-size: 18px;
	line-height: 24px;
	padding-top:40px;
}

/* ------------------ 取引先　メール ------------------ */

.client-mail-all { /* 全体枠 */
	margin-top:24px;
	width:802px;
	border-top: 1px solid #D9DEE6;
}

.client-mail-text { /* メール本文枠　※本文中のスタイル指定は請求書メールと共通 */
	padding:24px;
	background:#ffffff;
	height: auto;
}

.mail-setting {
	margin-top:40px;
	margin-left:16px;
}

/* ------------------ メール表示用アコーディオンメニュー ※要jquery　 ------------------  */

/* アコーディオンメニュー全体のサイズ・位置 */
.acco {
	width: 100%;
}

/* クリック領域 */
.acco-parent {
	position: relative;  /* 追加 */
	height: 70px;
	border-bottom: 1px solid #D9DEE6;
	background-color: #ffffff;
	color: #1A2127;
	font-weight: bold;
	font-size: 14px;
	text-align: left;
	line-height: 70px;
	padding-left:16px;
	cursor: pointer;
}

/* クリックしたら表示される領域 ※メールのグレー背景 */
.acco-child {
	display: none;
	margin:0;
	padding: 16px;
	background-color: #D9DEE6;
	text-align: left;
}

/* 擬似要素で下三角形を作成 */
.acco-parent:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 45%;
	right: 30px;
	width: 8px;
	height: 8px;
	border-right: 1px solid #4F6071;
	border-bottom: 1px solid #4F6071;
	transform: translateY(-50%) rotate(45deg);
	transition: 0s;
}

/* オープン時にopenクラスを付与 */
.acco-parent.open:after {
	transform: rotate(225deg);
}


/* ------------------ 設定　サービス利用状況 ------------------ */

.service-midasi { /* サービス利用状況　見出し */
	font-size: 12px;
	font-weight:bold;
	color: #1A2127;
	height:20px;
	white-space: nowrap;
}
.service-midasi a {
	font-weight:normal;
}
	
.service-text { /* サービス利用状況　データ */
	font-size: 12px;
	color: #4F6071;
	margin-right:36px;
	white-space: nowrap;
}
.service-icon { /* (i)アイコン配置 */
	vertical-align: -3px;
}
.service-pop { /* 明細取得回数について ポップアップ枠  */
	width: 376px;
	height: auto;
	padding:16px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 4px;
	z-index:1;
}
.pop-title { /* 明細取得回数について 見出し  */
	font-weight: bold;
	font-size: 14px;
	margin-bottom:8px;
}
.pop-text { /* 明細取得回数について テキスト  */
	font-size: 12px;
	line-height: 18px;
}

 /* 情報の表示枠  */
.service-info-box {
	border: 1px solid #D9DEE6;
	padding: 24px;
	margin-top:18px;
	margin-bottom:40px;
	width:1030px;
}
.service-info-midasi {
	font-size:12px;
	text-align:right;
	margin-right:60px;
}
.service-info-midasi-l {
	font-size:12px;
	text-align:left;
	width:156px;
}

.service-info-text {
	font-weight: bold;
	font-size: 16px;
	text-align:right;
	margin-right:60px;
}
.service-info-text-l {
	font-weight: bold;
	font-size: 16px;
	text-align:left;
	width:156px;
}
.service-info-border {
	border-left: #D9DEE6 solid 1px;
	margin-right:60px;
}

 /* 有料ユーザー枠を変更画面（ポップアップ） */
.service-edit {
	width: 592px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.service-edit h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:8px;
}

.service-edit-money {
	font-size: 20px;
	line-height: 32px;
}


/* ------------------ 請求書　CSVアップロード ------------------ */

 /* CSVアップロード（ポップアップ） */
.csv-upload {
	width: 592px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:0 24px 26px;
}
.csv-upload h1 {
	font-weight: bold;
	font-size: 20px;
	line-height: 32px;
	padding-top:32px;
	padding-bottom:8px;
}
.csv-upload-text {
	font-size: 14px;
	line-height: 18px;
	min-height:40px;
	margin-bottom:10px;
}

/* ドラッグ・プレビュー表示 */
.csv-drag-area {
	position:relative;
	padding:0;
	margin:8px 0;
	background: #F6F8FB;
	border: 1px solid #D9DEE6;
	border-radius: 4px;
	width: 592px;
	height: 160px;
	line-height: 18px;
	text-align:center;
}
.csv-preview {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:100%;
	color: #000000;
}
.csv-file-midasi {
	color: #798A9A;
	padding-right:32px;
}
.csv-file-name {
	color: #1A2127;
	font-size:14px;
}

.csv-list {
	height:150px;
	overflow:auto;
	border-bottom: 1px solid #D9DEE6;
	border-top: 1px solid #D9DEE6;
}

.csv-list2 {
	height:300px;
	overflow:auto;
	border-bottom: 1px solid #D9DEE6;
}


/* ------------------ 請求書　CSVダウンロード ------------------ */
.csv-download-text {
	font-size: 14px;
	line-height: 18px;
	height:50px;
}


/* ------------------ メール請求書表示 ------------------ */
.view-idpw {
	padding:40px;
	position: absolute;
	width: 340px;
	height: auto;
	left: calc(50% - 420px/2);
	top: calc(50% - 412px/2);
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
}

.view-idpw .title-img {
	text-align:center;
	margin:0;
}
.view-idpw p {
	font-size: 12px;
	line-height:16px;
	font-weight: bold;
	margin-bottom:8px;
	width:340px;
}
.view-text {
	margin-top:32px;
	margin-bottom:24px;
}


.view-pass-err {
	color: #D1511A;
	text-align:left;
	height:32px;
	margin-top:8px;
}

/* 発行元のユーザーによる参照 */
.view-hakkomoto {
	position: absolute;
    bottom:20px;
	width:100%;
	text-align:center;
}

.view-header {
	background: #FFFFFF;
	border-top: 1px solid #D9DEE6;
	border-right: 1px solid #D9DEE6;
	border-left: 1px solid #D9DEE6;
	border-radius: 4px 4px 0px 0px;
	width:754px;
	padding:13px 24px;
	text-align:right;
	margin-top:32px;
}

.view-info-midasi {
	font-size:14px;
	line-height: 18px;
	color: #4F6071;
	width:70px;
	height:35px;
}
.view-info-text {
	font-weight: bold;
	font-size: 14px;
	line-height: 18px;
	color: #1A2127;
	width:730px;
}

/* ------------------ 請求書一括発行 ------------------ */

.seikyu-ikkatu-tinfo {
	margin-bottom:10px;
	font-size:16px;
	line-height:22px;
}

.seikyu-ikkatu-atten {
	border-top: 3px dashed #D9DEE6;
	line-height:18px;
	padding-top:15px;
	margin-top:20px;
	line-height:20px;
}




/* ------------------ スナックバー (snackbar) メッセージ表示 ------------------ */
.snackbar {
	width:452px;
	margin:0 auto;
	font-weight: bold;
	font-size: 14px;
	line-height: 18px;
	border: 1px solid #80BE5A;
	padding:16px 24px;
	background: linear-gradient(0deg, rgba(128, 190, 90, 0.1), rgba(128, 190, 90, 0.1)), #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 4px;
}

/* ------------------ エラー画面（セッションタイムアウトなど） ------------------ */

.session-error {
	margin:400px auto 0;
	font-size: 20px;
	font-weight: bold;
	line-height: 32px;
	color: #798A9A;
	text-align: center;
}


/* ============================= クレカ決済関連 ============================= */

.banner-trial { /* トライアル期間バナー */
	display:block;
	position: fixed;
	top:0;
	height: 32px;
	width:100%;
	background: #D1511A;
	font-size: 24px;
	color:#ffffff;
	padding-bottom:22px;
	padding-left:24px;
	padding-top:18px;
}
.banner-trial .cc-close {
	float:right;
	margin-right:45px;
	cursor:pointer;
}

.banner-top {
	margin-top:72px;
}

.banner-seminar { /* セミナー申し込みバナー */
	display:block;
	position: fixed;
	top:0;
	height: 32px;
	width:100%;
	background: #6F98EC;
	font-size: 24px;
	color:#ffffff;
	padding-bottom:22px;
	padding-left:24px;
	padding-top:18px;
}
.banner-seminar .cc-close {
	float:right;
	margin-right:45px;
	cursor:pointer;
}
.banner-top.t-144 { /* セミナー申し込みバナーと2つ表示の時 */
	margin-top:144px;
}
.banner-trial.t-72 {
	top:72px;
}




.banner-trial.t-blue { /* トライアル期間バナー 青　上部に表示 */
	height: 24px;
	background:#e9f5fe url(../img/b-Info.png) no-repeat 18px;
	border-radius: 4px;
	color:#0c3657;
	font-size: 18px;
	padding:18px;
}
.t-blue-text {margin-left:40px;}


.banner-trial-blue { /* トライアル期間バナー 青　タイトル下メッセージタイプ（クレカ決済側にサンプル） */
	margin: 24px 0;
	padding:16px 16px 16px 56px;
	background:#e9f5fe url(../img/b-Info.png) no-repeat left 17px top 14px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.05em;
	color:#0c3657;
}



.sinse-button { /* 継続利用の申請ボタン */
	display:inline-block;
	background-color: transparent;
	background-image:url(../img/ExternalLink_w.png);
	background-position: right 25px bottom 10px;
	background-repeat: no-repeat;
	padding: 8px 45px 8px 30px ;
	border: 2px solid #ffffff;
	border-radius: 100px;
	font-weight: bold;
	font-size: 14px;
	text-align: left;
	color: #ffffff;
	margin-left:20px;
	vertical-align:4px;
	cursor:pointer;
}
 
.cc-kessai { /* 全体枠 */
	text-align:center;
	background:#F6F8FB;
	padding:0;
	margin:0;
	min-width:100%;
	max-width:100%;
}

.cc-kessai h1 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:12px;
	margin-top:80px;
}

.cc-kessai-main { /* 登録画面　全体枠 */
	width: 708px;
	height: auto;
	margin:48px auto;
	background: #FFFFFF;
	filter: drop-shadow(0px 4px 20px rgba(26, 33, 39, 0.2));
	border-radius: 16px;
	text-align:left;
}

.cc-kessai-bars { /* 登録状況　以下スタイルで表示画像を指定  */
	width:708px;
	height:88px;
	border-radius: 16px 16px 0 0;
	border-bottom:#D9DEE6 solid 1px;
}
.cc-kessai-bars.bars01 { background:url(../img/bars01.png) no-repeat }
.cc-kessai-bars.bars02 { background:url(../img/bars02.png) no-repeat }
.cc-kessai-bars.bars03 { background:url(../img/bars03.png) no-repeat }
.cc-kessai-bars.bars04 { background:url(../img/bars04.png) no-repeat }

.cc-kessai-bars.bars-s01 { background:url(../img/bars-s01.png) no-repeat }
.cc-kessai-bars.bars-s02 { background:url(../img/bars-s02.png) no-repeat }
.cc-kessai-bars.bars-s03 { background:url(../img/bars-s03.png) no-repeat }


.cc-kessai-inner { /* 登録画面 入力欄 */
	padding:20px 90px 48px;
	word-break:break-all;
	word-wrap:break-word;
}

.cc-kessai-inner h2 { /* 見出しアイコン対応 */
	font-weight: bold;
	font-size: 18px;
	line-height: 32px;
	margin-top:40px;
	margin-bottom:6px;
	padding-left:36px;
}
/* h2見出しアイコン */
.cc-midasi00 { margin-left:-36px; }/* アイコンなし */
.cc-midasi01 { background:url(../img/color01.png) no-repeat; }
.cc-midasi02 { background:url(../img/color02.png) no-repeat; }
.cc-midasi03 { background:url(../img/color03.png) no-repeat; }
.cc-midasi04 { background:url(../img/color04.png) no-repeat; }
.cc-midasi05 { background:url(../img/color05.png) no-repeat; }
.cc-midasi06 { background:url(../img/color06.png) no-repeat; }
.cc-midasi07 { background:url(../img/color07.png) no-repeat; }


.cc-info {
	font-size: 12px;
	line-height: 18px;
	color: #4F6071;
	margin-top:8px;
	text-align:left;
}

/* アイコン付のリンク */
.cc-link12 {
	font-size: 12px;
	font-weight:normal;
	color: #2D55AD;
	cursor:pointer;
}
.cc-link12 img {
	vertical-align:-3px;
}
.cc-link14 {
	font-size: 14px;
	font-weight:normal;
	color: #2D55AD;
	cursor:pointer;
}
.cc-link14 img {
	vertical-align:-3px;
}


.cc-koza-info {
	padding: 0px 24px 24px;
	border: 1px solid #D9DEE6;
	box-sizing: border-box;
	border-radius: 4px;
}

.cc-sab {
	font-weight: bold;
	font-size: 16px;
	line-height: 18px;
	margin-top: 24px;
	margin-bottom:8px;
}

.cc-footer {
	text-align:center;
	margin-top:32px;

}

.cc-kanryo {
	text-align:center;
	margin-top:40px;
}
.cc-kanryo h2 {
	margin-top:10px;
	padding:0;
}

/* 再申請　変更箇所表示 */
.cc-saisinse {
	background: linear-gradient(0deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.48)), #D9D341;
}


/* 継続利用のご案内 ポップアップ  */
.cc-pop {
	display:block;
	position: absolute;
	width: 592px;
	height: auto;
	top:190px;
	left: calc(50% - 640px/2);
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:30px 24px;
	z-index:99;
}
.cc-pop h1 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:10px;
}
.cc-pop h2 {
	font-weight: bold;
	font-size: 18px;
	margin-bottom:18px;
	margin-top:32px;
	padding-left:8px;
	border-left : 4px solid #2D55AD;
}
.cc-pop h3 {
	font-weight: bold;
	font-size: 16px;
	margin-bottom:8px;
}
.cc-pop ul {
	margin-left:24px;
	margin-bottom:18px;
}

/* 料金表  */
table.cc-about {
	table-layout: fixed;
	width:100%;
	border-collapse: separate;
	border-spacing:0;
	border: 1px solid #D6DEE5;
	border-radius: 8px;
	margin:16px 0;
}

table.cc-about th {
	font-weight: bold;
	font-size: 16px;
	color: #1A2127;
	padding:16px 24px;
	border-radius: 8px 8px 0 0;
	background: #F6F8FB;
}
table.cc-about td {
	font-size: 14px;
	color:#4F6071;
	padding:16px 24px;
	vertical-align: middle;
	height:40px;
}
table.cc-about td.text-right {
	text-align:right;
}
table.cc-about td.border0 {
	border-bottom: none;
}
table.cc-about tr:hover {
	background-color: transparent;
}

/* 認証など ポップアップ  */
.cc-pop-ninsho {
	display:block;
	position: absolute;
	width: 592px;
	height: auto;
	top:200px;
	left: calc(50% - 640px/2);
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:30px 24px;
	z-index:99;
}
.cc-pop-ninsho h1 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:10px;
}

/* 自社情報　クレジットカード決済タブ 情報表示グレー枠  */
.jisha-cc-kessai {
	width: 1078px;
	height: auto;
	background: #F6F8FB;
	padding: 24px;
	margin:24px;
}
.jisha-cc-kessai h2 {
	font-weight: bold;
	font-size: 18px;
	margin-bottom:24px;
}

/* サービス利用状況　請求QUICK契約情報タブ  */
.cc-service-inner {
	padding:0;
}
.cc-service-inner h2 { /* 見出しアイコン対応 */
	font-weight: bold;
	font-size: 18px;
	line-height: 32px;
	margin-top:30px;
	margin-bottom:6px;
	padding-left:36px;
}

.cc-service-inner hr {
	margin-bottom:0;
	margin-top:20px;
}

 /* クレカ請求で発行 全体枠 */
.cc-main-single {
    background-color: #F6F8FB;
	padding-top:80px;
	padding-left:60px;
	width:100%;
}

 /* クレカ請求で発行 請求書情報 */
.cc-invoice-main {
	background: #D9DEE6;
	border: 1px solid #D9DEE6;
	border-radius: 0px 0px 4px 4px;
	width:569px;
	height:800px;
	padding:24px;
}
.cc-invoice-main iframe {
    width:100%;
    height:100%;
}

.cc-view-info {
	width: 446px;
	height: auto;
	padding:40px;
	margin-right:64px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 16px;
}
.cc-view-header {
	background: #FFFFFF;
	border-top: 1px solid #D9DEE6;
	border-right: 1px solid #D9DEE6;
	border-left: 1px solid #D9DEE6;
	border-radius: 4px 4px 0px 0px;
	width:569px;
	padding:13px 24px;
	text-align:right;
}

.cc-view-info-midasi {
	font-size:14px;
	line-height: 18px;
	color: #4F6071;
	width:95px;
	height:35px;
}
.cc-view-info-text {
	font-weight: bold;
	font-size: 14px;
	line-height: 18px;
	color: #1A2127;
}
.cc-view-info-text .cc-furikomi {
	font-weight: normal;
	font-size: 14px;
	line-height: 18px;
	color: #1A2127;
	margin-bottom:12px;
	margin-top:6px;
}

.cc-view-info-text .cc-furikomi2 {
	font-weight: normal;
	font-size: 14px;
	line-height: 18px;
	color: #1A2127;
	margin-bottom:12px;
	margin-top:0;
}

.cc-toiawase { /* クレカ決済　失敗時の問い合わせ先 */
	font-size:12px;
	text-align:left;
	margin-bottom:24px;
	margin-left:160px;
	margin-top:24px;
}

.cc-error { /* クレカ決済　カード情報を登録の上限 */
	background: #F6F8FB;
	border-radius: 8px;
	padding:24px;
	margin-top:18px;
}
.cc-error-text {
	background: url(../img/error_g.png) no-repeat top left;
	color: #D1511A;
	padding-left:26px;
}


 /* サービス利用状況 トライアル期間の警告 */
.trial-warning {
	margin: 24px 0;
	padding:16px 56px;
	background:#fff5e5 url(../img/warning.png) no-repeat left 17px top 26px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.05em;
	color:#5c3700;
}

 /* サービス利用状況 修正依頼の警告 ボタン表示あり */
.trial-error {
	position: relative;
	margin: 24px 0;
	padding-bottom:22px;
	padding-left:56px;
	padding-right:55%;
	padding-top:29px;
	background:#feeceb url(../img/error.png) no-repeat left 17px top 26px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.05em;
	color:#5c3700;
}
.trial-error button {
	position: absolute;
	left:45%;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.trial-error2 { /* ボタン表示なし */
	margin: 24px 0;
	padding:16px 56px;
	background:#feeceb url(../img/error.png) no-repeat left 17px top 14px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.05em;
	color:#5c3700;
}


 /* サービス利用状況 テキストメッセージのみ */
.trial-message {
	margin: 24px 0 0;
}
.trial-message .ok-card {
	margin-bottom:24px;
	margin-top:8px;
}

.sinse-btn { /* 継続利用の申請ボタンなど　茶色 */
	display:inline-block;
	background-color: transparent;
	padding: 8px 20px ;
	border: 2px solid #5c3700;
	border-radius: 100px;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	color: #5c3700;
	margin-left:20px;
	vertical-align:4px;
	cursor:pointer;
}



 /* サービス利用状況 申請ステータス表示　進捗バーの配置 */
.cc-status {
	margin: 24px 11px 0;
}
.cc-status img {
	vertical-align:middle;
}
 /* サービス利用状況 申請ステータス表示　進捗バーの文字色 */
.cc-sinsei01 { /* 完了 */
	font-weight: bold;
	font-size: 16px;
	color:#798A9A;
}
.cc-sinsei02 { /* 対応中 */
	font-weight: bold;
	font-size: 16px;
	color:#2D55AD;
}
.cc-sinsei03 { /* 未完了 */
	font-weight: bold;
	font-size: 16px;
	color:#BDC6D1;
}
 /* サービス利用状況 申請ステータス　進捗バーの文字の表示幅 */
.column-st-a {
	width:117px;
	text-align:left;
	line-height:24px;
	height:40px;
}
.column-st-b {
	width:188px;
	text-align:center;
	line-height:24px;
	height:40px;
}

 /* サービス利用状況 申請ステータス　カードの審査状況　凡例（OK・NG・審査中） */
.cc-sta-text {
	color:#798A9A;
	font-size:12px;
	font-weight:normal;
}
.cc-sta-text img {
	vertical-align:2px;
	margin-right:5px;
}

 /* サービス利用状況 申請ステータス　カードの審査状況　OK・NG（ベースはi-moji） */
.card-ok {
	background:#f2f9ef url(../img/card_ok.png) no-repeat right 3px top 3px;
	border: 1px solid #80BE5A;
	color:#80BE5A;
	padding-right:20px;
}
.card-ng {
	background:#feeceb url(../img/card_ng.png) no-repeat right 3px top 3px;
	border: 1px solid #F44336;
	color:#F44336;
	padding-right:20px;
}


/* 請求書　クレカ決済取消 */
.cancel-link a:link {
	color: #D1511A;
	font-size:14px;
	text-decoration: none;
}
.cancel-link a:visited {
	color: #D1511A;
	text-decoration: none;
}
.cancel-link a:hover, a:active, a:focus {
	text-decoration: underline;
	transition: 0.4s ;
}



/* 入金　クレジットカード請求詳細 */
.card-seikyu-info {
	border: 1px solid #BDC6D1;
	box-sizing: border-box;
	border-radius: 4px;
	padding: 32px 24px 16px;
	width:460px;
}
.card-seikyu-midasi {
	color: #4F6071;
	width:125px;
	height:35px;
}
.card-seikyu-text {
	color: #1A2127;
}


/* 背景色追加　必要に応じてbodyに指定 */
.bg-gray {
    background-color: #F6F8FB;
}


/* 決済処理中のアニメーション */
.loader-layout {
  margin-top:32px;
  margin-bottom:24px;
}
.loader-layout #loader {
  display: inline-block;
  width: 45px;
  height: 45px;
  border: 4px solid rgba(45, 85, 173, 0.3);
  border-radius: 50%;
  border-top-color: #2d55ad;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}


/* 狭い枠の登録エラー */
.error-message2 { /* 上部のエラーメッセージ */
	font-size: 14px;
	color: #D1511A;
	background: url(../img/i_error.png?v=1)  no-repeat left top;
	padding-left:24px;
	margin-top:10px;
}

/* 添付ファイルドラッグ枠 */
.tenp-drag-area {
	background: #FFFFFF;
	border: 1px dashed #D9DEE6;
	box-sizing: border-box;
	border-radius: 4px;
	padding:0;
	width: 526px;
	height: 160px;
	line-height: 18px;
	text-align:center;
	position:relative;
}
.tenp-d-preview {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:100%;
}


/* ファクタリング　サービス利用状況（利用申し込み） */
.factoring-ng { /* 利用不可 */
	margin: 24px 0;
	padding:16px 56px;
	background:#feeceb url(../img/error.png) no-repeat left 17px top 14px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.05em;
	color:#5c3700;
}
.factoring-ok { /* 利用可 */
	margin: 24px 0;
	padding:16px 56px;
	background:#f2f9ef url(../img/ok.png) no-repeat left 17px top 14px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.05em;
	color:#25361a;
}
.factoring-warning {
	margin: 24px 0;
	padding:16px 56px;
	background:#fff5e5 url(../img/warning.png) no-repeat left 17px top 14px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.05em;
	color:#5c3700;
}


 /* サービス利用状況 申請ステータス　進捗バーの文字の表示幅 */
.fac-status {
	margin: 24px 18px 0;
}
.fac-status img {
	vertical-align:middle;
}
 /* サービス利用状況 申請ステータス表示　進捗バーの文字色 */
.fac-sinsei01 { /* 完了 */
	font-weight: bold;
	font-size: 16px;
	color:#798A9A;
}
.fac-sinsei02 { /* 対応中 */
	font-weight: bold;
	font-size: 16px;
	color:#2D55AD;
}
.fac-sinsei03 { /* 未完了 */
	font-weight: bold;
	font-size: 16px;
	color:#BDC6D1;
}
 /* サービス利用状況 申請ステータス　進捗バーの文字の表示幅 */

.column-fac-a {
	width:124px;
	text-align:left;
	line-height:24px;
	height:40px;
}
.column-fac-b {
	width:188px;
	text-align:center;
	line-height:24px;
	height:40px;
}

/* ----------フィルタボタン3　サイズ固定（サービス利用状況で使用） ---------- */
/* すべて・金額一致・金額不一致
以下のクラスの組み合わせ
filter3 = すべてにつく（共通の指定）
filter3-off = オフの状態につく
filter3-hover = マウスホバーに反応する
 */
.filter3-area { 
	border: 1px solid #D9DEE6;
	border-radius: 4px;
	font-size: 0; /* inline-block の空白対応 */
	height:35px;
	width:244px;
	margin:24px 0;
}
.filter3 {
	display: inline-block;
	height:35px;
	width: 122px;
	background-color:#2D55AD;
	margin:0;
	padding:7px 16px;
	font-weight: bold;
	font-size: 14px;
	text-align:center;
	color:#ffffff;
}
.filter3-off { /*オフ*/
	background-color:#F6F8FB;
	color:#798A9A;
	font-weight: bold;
	cursor:pointer;
}
.filter3-off.filter3-hover:hover{ /*オフのホバー*/
	background-color:#2D55AD;
	color:#ffffff;
	font-weight: bold;
	cursor:pointer;
	transition: 0.4s ;
}
.filter3.left { /* 左端の角丸 */
	border-top-left-radius:4px;
	border-bottom-left-radius:4px;
	border-right: 1px solid #D9DEE6;
}
.filter3.right { /* 右端の角丸 */
	border-top-right-radius:4px;
	border-bottom-right-radius:4px;
}


.filter3:hover { /* オン状態のマウスオン */
	cursor: pointer;
	background-color: #1F3E84;
	transition: 0.4s ;
}

/* ---------- 請求書買取　買取申請詳細 ---------- */

.kaitori-box { /* 角丸の枠 */
	width: 1078px;
	border: 1px solid #BCC5D0;
	box-sizing: border-box;
	border-radius: 4px;
	padding: 32px 24px 16px;
	margin-top:26px;
	margin-bottom:40px;
}
.kaitori-midasi { /* 買取申請　見出し */
	font-size: 14px;
	color: #4F6071;
	height:35px;
	width:100px;
}
.kaitori-text { /* 買取申請　データ */
	font-size: 14px;
	color: #1A2127;
	height:35px;
	width:200px;
}

 /* 買取不可アイコン（ベースはi-moji） */
.kaitori-ng {
	background:#feeceb;
	border: 1px solid #F44336;
	color:#F44336;
	width:50px;
	height:15px;
	text-align:center;
}

/* ---------- 請求書買取　新規申請確認ポップアップ ---------- */
.fac-pop {
	position:absolute;
	width: 1126px;
	height: 750px;
	left: 96px;
	top: 150px;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(26, 33, 39, 0.2);
	border-radius: 8px;
	padding:40px 24px;
	z-index:99;
}
.fac-pop h1 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:8px;
}
.fac-pop h2 {
	font-weight: bold;
	font-size: 18px;
	margin-bottom:8px;
}
.fac-gaiyo {
	padding: 18px 24px;
	background: #F6F8FB;
	border-radius: 4px;
	margin-bottom:24px;
	margin-top:32px;
}
.gaiyo-midasi { /* 申請概要　見出し */
	font-size: 14px;
	color: #4F6071;
	height:35px;
}
.gaiyo-text { /* 申請概要　データ */
	font-size: 14px;
	color: #1A2127;
	height:35px;
	min-width:200px;
}
.gaiyo-info {
	color: #798A9A;
	font-size: 12px;
	line-height: 18px;
}

/* ---------- 請求書買取　新規買取申請　下部情報 ---------- */

.kaitori-f01 {
	font-size: 14px;
	color: #4F6071;
}

.kaitori-f02 {
	display:inline-block;
	margin-left:40px;
	margin-right:20px;
	font-weight:bold;
}
.kaitori-f03 {
	display:inline-block;
	border: 1px solid #D9DEE6;
	border-radius: 8px;
	padding:8px;
	width:150px;
	text-align:right;
	font-weight:bold;
	font-size: 16px;
}

.update-message { /* マスタとの相違チェックを表示 */
	font-size: 14px;
	color: #4F6071;
	background: url(../icon16/Info.png?v=1)  no-repeat left top 2px;
	padding-left:24px;
	margin-top:-25px;
}