﻿@charset "utf-8";

/* normalize --------- */
*{
	margin:0;
	padding:0;
}
html,
button,
input,
select,
textarea {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
html{
	height:100%;
}
body{
	color:#4E4A4D;
	height:100%;
}
header,footer,article,section,div{
	display:block;
}
h1,h2,h3{
	display:block;
	font-weight: normal;
}
p{
	line-height:1.5;
}
img{
	max-width:100%;
	height: auto;
	vertical-align:middle;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
input,select{
	/*appearance:none;*/
	-webkit-appearance:none;
	-moz-appearance:none;
	-o-appearance:none;
	-ms-appearance:none;
}
select::-ms-expand {
 	display: none;
}
ul,ol,dl,li,dt,dd{
	list-style:none;
}
div,p,a,ul,ol,dl,dt,li,table,td,section,article,span,small,label,input{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

/* //normalize --------- */

/* 汎用クラス */
.align-l{text-align: left !important;}
.align-c{text-align: center !important;}
.align-r{text-align: right !important;}

.txt_red{
	color:red;
	margin-left:3px;
}

html{/* 全体の文字サイズ調整 */
	font-size:87.5%;/* 14px */
}

/* ie6,7用ハック */
* html input{
	padding-top:2px;
	vertical-align:text-bottom;
}
*:first-child+html input{
	padding-top:2px;
	vertical-align:text-bottom;
}

/* ========= header ========= */
.header{
	position: relative;
	display: inline-block;
	width: 100%;
	background: #fff url(../images/header_bg_arc_2x.png) left bottom no-repeat;
	-webkit-background-size: 1000px auto;
	-moz-background-size: 1000px auto;
	-o-background-size: 1000px auto;
	background-size: 1000px auto;
	padding: 1em;
}
h1{
	display: block;
	float: left;
	width: 20em;
	height: 2em;
	background: url(../images/header_logo_2x.png) left top no-repeat;
	-webkit-background-size: 240px auto;
	-moz-background-size: 240px auto;
	-o-background-size: 240px auto;
	background-size: 240px auto;
	padding: 2.25em 0 0 2.4375em;
	color: #c02;
	font-size: 1em;
	font-weight: bold;
	line-height: 2;
}

/* user_info */
.user_info{
}
.user_info .sp{
	position: absolute;
	right: 0;
	top: 50%;
	width: 4em;
	height: 4em;
	padding: 1em;
	margin-top: -2em;
}
.user_info .info_box{
	position: absolute;
	right: 0;
	top: 6.25em;
	display: none;
	padding: 1em;
	background: #444044;
	border-radius: 0 0 .5em .5em;
	z-index: 100;
}
.user_info .info_box ul{
	display: block;
	overflow: hidden;
}
.user_info .info_box ul li{
	float: left;
	color: #f6f3f6;
	font-size: .75em;
	line-height: 2;
	word-break: break-all;
}
.user_info .info_box ul li:last-child{
	max-width: 18em;
}
.user_info .info_box ul li .time{
	margin-left: 1em;
}
.user_info .info_box ul li:first-child{
	color: #c6c3c6;
}
.user_info .info_box ul.user_id li:first-child{
	text-indent: 3.8125em;
}
.user_info .logout{
	width: 10em;
	background:url(../images/header_bg_logout.png) .5em center repeat-x;
	margin: 1.5em auto 0;
	border-radius: .5em;
}
.user_info .logout:hover{
	opacity: .7;
    cursor: pointer;
}
.user_info .logout a{
	display: block;
	padding: .5em 1em .5em 3em;
	background:url(../images/icon_logout_2x.png) .5em center no-repeat;
	-webkit-background-size: 2em;
	-moz-background-size: 2em;
	-o-background-size: 2em;
	background-size: 2em;
	color: #fff;
	text-decoration: none;
}
/* ========= /header ========= */


/* ========= main ========= */
.main{
	padding: 2em 1em;
}
/* ========= /main ========= */

/*===== メイン =====*/
h2.page-title{
	display:block;
	background-color:#DEEAEC;
	height:48px;
	margin:0 0 1em 0;
	padding:0 0.4em;
	font-size:180%;
	line-height:48px;
	/*min-width:923px;*/
}

h3.subtitle{
	margin:0 0 1em 0;
	padding:2px 0.4em;
	color:#393333;
	border-left:4px solid #ED1A3D;
	font-size:14px;
}

h4.label-title{
	margin:0 0 1em 0;
	padding:2px 0.4em;
	color:#393333;
	border-left:4px solid #4178db;
	background-color:#ebebf0;
	font-size:19px;
	margin-left : 7px;
}
h4.topPage_label_title{
	margin:0 0 0 0;
	padding:2px 0.4em;
	color:#393333;
	border-left:4px solid #4178db;
	background-color:#ebebf0;
	font-size:19px;
    margin-left : 7px;
}

h5.table-title{
	margin:0 0 1em 0;
	padding:2px 0.4em;
	color:#393333;
	border-left:4px solid #ED1A3D;
	background-color:#ebebf0;
	font-size:15px;
	margin-left : 12px;
}

/* 汎用テーブルスタイル */
.default_table{
	width:100%;
	border:1px solid #c7cbd5;
	border-collapse:collapse;
	margin-bottom:1em;
	text-align:left;
}
.default_table_margin-l{
	width:98%;
    margin-left:12px;
}
.default_table td{
	border-top:1px solid #c7cbd5;
	border-left:1px solid #c7cbd5;
	border-collapse:collapse;
	padding:0.5em 0.5em;
/*	background-color:#ffffff;*/
}
.default_table th{
	background-color:#e3ebfa;
	border-top:1px solid #a7a7af;
	border-left:1px solid #a7a7af;
	border-collapse:collapse;
	padding:0.6em 0.6em;
	line-height:20px;
    text-align:left;
}
.default_table th.noLH{
	line-height:1.2em;
}
.default_table th.category{/* 検索項目のカテゴリ表示用 */
	background-color:#f0f0f0;
	background-image:none;
	border-left:4px solid #cf3535;
	padding:0.6em 1em;
	text-align:left;
	line-height:20px;
}
.default_table th.blank{/* 空のth */
	background-color:#e9e9e9;
	background-image:none;
}
.default_table thead{
	text-align:center;
}
.default_table tbody td{
	line-height:20px;
}
.default_table .chirashiNameSize,
.default_table .chirashiPdfSize{
    width:700px;
}
.default_table .fileName{
    word-break: break-all;
}

/*===== トップ画面用 =====*/
.lnk_menu{
	margin:0 0 0 2em;
    padding:0 0 0 1em;
	font-size:100%;
    font-weight:bold;
	border-left:0.25em solid #ebebf0;
    line-height:2.5em;
}

.top_menu{
	line-height:3em;
}
/*===== //トップ画面用 =====*/

/*===== 検索条件・結果一覧用 =====*/
.default_table th.srch_th,
.default_table td.srch_td
{
	white-space:nowrap;
}
th.srchRslt_title
{
	text-align:center;
	white-space:nowrap;
}
/*===== //検索条件・結果一覧用 =====*/

/* セル幅調整 */
.sellw_02{ width:20px; }
.sellw_03{ width:30px; }
.sellw_04{ width:40px; }
.sellw_05{ width:50px; }
.sellw_06{ width:60px; }
.sellw_07{ width:70px; }
.sellw_08{ width:80px; }
.sellw_09{ width:90px; }
.sellw_10{ width:100px; }
.sellw_11{ width:110px; }
.sellw_12{ width:120px; }
.sellw_13{ width:130px; }
.sellw_14{ width:140px; }
.sellw_15{ width:150px; }
.sellw_16{ width:160px; }
.sellw_17{ width:170px; }
.sellw_18{ width:180px; }
.sellw_19{ width:190px; }
.sellw_20{ width:200px; }
.sellw_21{ width:210px; }
.sellw_22{ width:220px; }
.sellw_23{ width:230px; }
.sellw_24{ width:240px; }
.sellw_25{ width:250px; }
.sellw_26{ width:260px; }
.sellw_27{ width:270px; }
.sellw_28{ width:280px; }
.sellw_29{ width:290px; }
.sellw_30{ width:300px; }
.sellw_40{ width:400px; }
.sellw_41{ width:410px; }
.sellw_42{ width:420px; }
.sellw_43{ width:430px; }
.sellw_44{ width:440px; }
.sellw_45{ width:450px; }
.sellw_46{ width:460px; }
.sellw_47{ width:470px; }
.sellw_48{ width:480px; }
.sellw_49{ width:490px; }
.sellw_50{ width:450px; }
.sellw_074{ width:74px; }

/* //セル幅調整 */

/* //汎用テーブルスタイル */


/* 処理完了メッセージ */
.success{
	margin-bottom:1em;
	padding:0.5em 0.5em 0.5em 2.5em;
	border-top:1px solid #ddddbb;
	border-right:1px solid #ddddbb;
	border-bottom:1px solid #c3c3aa;
	border-left:1px solid #ddddbb;
	background:#FFFFCC url(../images/icon_success.gif) 7px 6px no-repeat;
	line-height:1.3em;
	color:#22f;
	text-align:left;
}
/* //処理完了メッセージ */

p.info_message{/* 確認・完了画面のメッセージなど */
	font-size:14px;
	line-height:2em;
	margin-bottom:1em;
}
p.error_message{/* エラー画面のメッセージ */
	font-size:14px;
	line-height:2em;
	color:#dd1133;
	margin-bottom:1em;
}

.page_button
{
    padding:0.5em 1em;
}
.page_button input
{
	margin:0em 0.5em;
    padding:0.5em 1em;
	font-size:1em;
    border-radius:0.5em;
    cursor: pointer;
}

/* ボタン w72px h20px */
a.button01{
	display:block;
	width:72px;
	height:20px;
	background:url(../images/bg_button01.gif) top left no-repeat;
	overflow:hidden;
	text-align:center;
	margin:auto;
	padding:0;
	color:#544;
	text-decoration:none;
}
a.button02{
	display:block;
	width:35px;
	height:20px;
	background:url(../images/bg_button02.gif) top left no-repeat;
	overflow:hidden;
	text-align:center;
	margin:auto;
	padding:0;
	color:#544;
	text-decoration:none;
}

.tipped{
	color: #999;
}

/* フォーム部品汎用 */
label{
	margin-right:1.5em;
}

/* エラーページ */
p.error{
	margin:2em auto;
	padding:0 1em;
	font-size:130%;
	font-weight:bold;
	color:#FF3300;
}

/* jQuery　テーブルリスト */
.fakeContainer {
    margin: 0;
		padding: 0 0 0 0;
		width:auto;
}

/* ========= form ========= */
.error_msg{
	padding: 1em 1em 1em 4em;
	background: #FFE475 url(../images/icon_error_2x.png) .75em .75em no-repeat;
	-webkit-background-size: 32px;
	-moz-background-size: 32px;
	-o-background-size: 32px;
	background-size: 32px;
	border-radius: .5em;
	margin-bottom: 1.5em;
}
.error_msg li{
	position: relative;
	display: block;
	padding-left: 1em;
}
.error_msg li::before{
	content: "";
	position: absolute;
	top: .5em;
	left: 0;
	display: inline-block;
	width: .5em;
	height: .5em;
	background-color: #4E4A4D;
	border-radius: .25em;
}

/* input_area */
.input_area{
	margin-bottom: 2em;
}
.input_area dl{
	display: block;
	padding: 0 1em;
	background-color: #FCD9D9; 
	border-radius: .5em;
	overflow: hidden;
}
.input_area dt, .input_area dd{
	float: left;
	padding: 1em 0;
	border-bottom: 1px solid #ffe4ef;
	line-height: 3;
	box-sizing: border-box;
}
.input_area dt{
	width: 40%;
	text-align: center;
	font-weight: bold;
	text-shadow: 0 1px 0 rgba(255,255,255,0.8);
}
.input_area dd{
	width: 60%;
}
.input_area dt:last-of-type, .input_area dd:last-of-type{
	border-bottom: none;
}
.input_area dd input,.input_area dd select{
	width: 100%;
	height: 2.875em;
	padding: 0 .25em;
	border: 1px solid #b8a;
	border-radius: .5em;
}
.input_area dd select{
	background:#fff url(../images/select_bg_arrow_2x.png) right center no-repeat;
	background-size: auto 100%;
}
.input_area dd input:focus,.input_area dd select:focus{
	background-color: #CDFFF6;
	transition: .3s;
}
.input_area dd input:disabled,.input_area dd select:disabled{
	background-color: #ddd;
	border-color: #ccc;
}

/* login page */
.input_area dl.login{
	background-color: #DEEAEC; 
}
.input_area dl.login dt, .input_area dl.login dd{
	border-bottom-color: #f3f3f3;
}
.input_area dl.login dd input{
	border-color:#818EA1;
}

/* button_area */
.button_area{
}
.button{
	display: block;
	width: 100%;
	padding: 1em 1em 1em 3.5em;
	background: #0089a9 1em center no-repeat;
	-webkit-background-size: auto 1.525em;
	-moz-background-size: auto 1.525em;
	-o-background-size: auto 1.525em;
	background-size: auto 1.525em;
	border-radius: .5em;
	border: none;
	margin-bottom: .75em;
	color: #fff;
	font-size: 1.5em;
	text-align: left;
	text-decoration: none;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
	cursor: pointer;
}
.button:hover{
	transition: .3s;
	opacity: .7;
}
.button:focus{
	opacity: 1;
	background-color: #006999;
}

/* アイコン設定 */
.button.chirashi{
	background-image: url(../images/icon_chirashi_2x.png);
}
.button.qr{
	background-image: url(../images/icon_qr_2x.png);
}
.button.url{
	background-image: url(../images/icon_url_2x.png);
}

/* ボタン非アクティブ時 */
.button.disabled{
	background-color: #999399;
	opacity: .4;
	cursor: default;
}
.button.login{
	padding:1em;
	margin: 0 auto;
	text-align: center;
}

.info_url{/* 生成したQRコード */
	font-size:18px;
	line-height:2em;
	padding-left:1em;
	margin-bottom:1em;
}

/* ========= /form ========= */

@media screen and (min-width:480px){
	h1{
		padding: 0 0 0 260px;
	}
	.user_info .info_box{
		top: 4em;
	}
}

@media screen and (min-width:768px){
	html{/* 全体の文字サイズ調整 */
		font-size:100%;/* 16px */
	}
	.header{

	}
	h1{
		background-position: left center;
		-webkit-background-size: 300px auto;
		-moz-background-size: 300px auto;
		-o-background-size: 300px auto;
		background-size: 300px auto;
		height: 2.5em;
		padding: 0 0 0 320px;
		color: #c02;
		font-size: 1.125em;
		font-weight: bold;
		line-height: 2.5;
	}
	
	/* info_box */
	.user_info .info_box{
		top:4.8125em;
	}

	/* input_area */
	.input_area dl{
		padding: 0;
	}
	.input_area dl dt{
		width: 45%;
		padding: .5em 1em .5em 0;
		text-align: right;
		font-size: 1.25em;
	}
	.input_area dl dd{
		width: 55%;
	}
	.input_area dl dd input,.input_area dl dd select{
		width:10em;
		height: 2em;
		font-size: 1.25em;
	}
	.input_area dl dd select{
		width: 18em;
	}
	.button.login{
		width: 12em;
	}
	.main{
		width:768px;
		margin: 0 auto;
	}
}

@media screen and (min-width:1150px){
	.header{
		background: #fff url(../images/header_bg_arc.png) center bottom no-repeat;
		-webkit-background-size: auto;
		-moz-background-size: auto;
		-o-background-size: auto;
		background-size: auto;
	}
	h1{
		width: auto;
		-webkit-background-size: 368px auto;
		-moz-background-size: 368px auto;
		-o-background-size: 368px auto;
		background-size: 368px auto;
		height: 2.5em;
		padding: 0 0 0 380px;
	}
	
	/* user_info */
	.user_info .sp{
		display: none;
	}
	.user_info .info_box{
		display: block !important;
		top: 0;
		right: 1em;
		width: auto;
		padding: .5em 9em .5em 0;
		background:none;
	}
	.user_info .info_box ul{
		float: none;
		display: block;
		margin-top: .5em;
	}
	.user_info .info_box ul li{
		float: left;
		display: block;
		color:#4E4A4D;
		line-height: 1;
	}
	.user_info .info_box ul li:first-child{
		color:#ACA9AC;
	}
	.user_info .info_box ul li:last-child{
		max-width: 12em;
	}
	.user_info .logout{
		position: absolute;
		top: 1em;
		right: 0;
		width: 7em;
		background:url(../images/header_bg_logout.png) left bottom repeat-x;
		margin: 0;
	}
	.user_info .logout a{
	/*.user_info .logout input{*/
		padding: .5em 0 .5em 3em;
		background-position: 1em center;
		background-size: 1.5em;
		font-size: .75em;
		line-height: 1;
	}

	.button_area ul li{
		float: left;
		width: 30%;
		margin-left: 5%;
	}
	.button_area ul li:first-child{
		margin-left: 0;
	}
	
	.main{
		width: 960px;
		margin: 0 auto;
	}
}
@media screen and (min-width:1200px){
	.user_info .info_box ul li:last-child{
		max-width: 24em;
	}	
}
