@charset "utf-8";

/*
 * 2017.09.15 内部サイトのログイン画面CSS新規作成
 * 2017.11.02 「テストサイト」ラベルの表示スタイル追加
 * 2019.02.21 システムメッセージ行スタイル追加
 */

body{
	font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Maru Gothic Pro","ヒラギノ丸ゴ Pro W4",Osaka,sans-serif;
	color:#333;
}
input,select,option,textarea {
    font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Maru Gothic Pro","ヒラギノ丸ゴ Pro W4",Osaka,sans-serif;
}
a{
	color:#333;
	text-decoration:none;
}
a:hover{
	text-decoration:underline;
}

/* 共通 */
.f-left{
    float: left;
}
.f-right{
    float: right;
}
.clear{
    clear: both;
}
.wrapper {
    margin: 0 auto;
    width: 912px;
}
.container-fluid {
    width: 100%;
}
.container {
    margin: 0 auto;
    max-width: 912px;
}
.fs10n{
	text-align: center;
	padding-top:10px;
}
table#wrapper .logo-collabo{
	text-align: center;
}
table#wrapper .logo-collabo img{
	max-width:50%;
}
table#form input{
	width: 100%;
}
table#form td.col-1{
	white-space:nowrap;
	overflow:hidden;
}

/* 「テストサイト」の表示 */
#site_label{
	position:fixed;
	background-color:#c82623;
	color:#fff;
	padding:5px 10px;
	border:2px solid #ccc;
	border-top:0 none;
	font-weight:bold;
	left:0;
	top:0;
	z-index:9999;
}

/* システムメッセージ */
body.has_sys_msg{margin:0}
body.has_sys_msg .sys_msg,
body.has_sys_msg .sys_msg_under{
	color:red;
	border:2px solid red;
	border-left:0 none;
	border-right:0 none;
	background:#fff;
	text-align:center;
	padding:10px 0;
	font-weight:bold;
}
body.has_sys_msg .sys_msg{
	width:100%;
	position:fixed;
	z-index:9998;
}

/****************************************************** PC用 ******************************************************/
@media all and (min-width: 768px) {
    .sp{ display:none !important; }
}

/****************************************************** SP用 ******************************************************/
@media all and (max-width: 767px) {
	.pc{ display:none !important; }
	*{
		-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
		font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Maru Gothic Pro","ヒラギノ丸ゴ Pro W4",Osaka,sans-serif;
		font-size:14px;
		-webkit-text-size-adjust:none;
	}
	textarea{
		-webkit-appearance: none;
		font-size:14px;
		border: 1px solid #ccc;
		width:100%;
		background:#fff;
		border-radius:0;
		padding:5px;
		font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Maru Gothic Pro","ヒラギノ丸ゴ Pro W4",Osaka,sans-serif;
	}
	select{
		font-size:14px;
		border: 1px solid #ccc;
		width:100%;
		border-radius:0;
		vertical-align:middle;
		padding:0;
		height:28px;
		line-height:1em;
		font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Maru Gothic Pro","ヒラギノ丸ゴ Pro W4",Osaka,sans-serif;
	}
	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="number"]{
		-webkit-appearance: none;
		font-size:14px;
		border: 1px solid #ccc;
		width:100%;
		background:#fff;
		border-radius:0;
		vertical-align:middle;
		padding:5px;
		height:28px;
		line-height:1em;
		font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Maru Gothic Pro","ヒラギノ丸ゴ Pro W4",Osaka,sans-serif;
	}
	::-webkit-input-placeholder { /* WebKit browsers */
		color:    #aca899 !important;
	}
	:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
		color:    #aca899 !important;
	}
	::-moz-placeholder { /* Mozilla Firefox 19+ */
		color:    #aca899 !important;
	}
	:-ms-input-placeholder { /* Internet Explorer 10+ */
		color:    #aca899 !important;
	}
	img{
		max-width:100%;
		border:none;
		vertical-align:middle;
	}
	
    /* ログイン画面 */
    table#wrapper{
        width: 100%;
    }
    table#wrapper .td-left, table#wrapper .td-right{
        width: 18%;
    }
    table#form{
        width: 100%;
    }
	
    /* 共通 */
    .wrapper {
        width: 92%;
        margin: 0 auto;
    }
    .container-fluid {
        width: 100%;
    }
    .container {
        margin: 0 auto;
        width: 88.75%;
    }
    .pc{
        display: none;
    }
}

@media all and (max-width: 480px) {
    /* ログイン画面 */
    table#wrapper td, table#form td, #site_label{
        font-size: 13px;
    }
    table#wrapper .td-left, table#wrapper .td-right{
        width: 6.510416666666667%;
    }
}

@media all and (max-width: 320px) {
    /* ログイン画面 */
    table#wrapper td, table#form td, #site_label{
        font-size: 11px;
    }
    table#form .col-1{
        width: 22%;
    }
    table#form .col-2{
        width: 74%;
    }
}
