@charset "utf-8";
@import url('//fonts.googleapis.com/earlyaccess/notosansjapanese.css');
@import url('//fonts.googleapis.com/css?family=Roboto Condensed|Lato:700i');
@import url('//fonts.googleapis.com/css?family=Oswald');

html,body,head,header,footer,h1,h2,h3,h4,h5,div,table,th,td,p,strong,a,span,ul,ol,li,dl,dt,dd,input,select,textarea{
	margin:0;
	padding:0;
}

input,select,textarea{
	font-family: "ヒラギノ角ゴ ProN W3","HiraKakuProN-W3","ヒラギノ角ゴ Pro W3","HiraKakuPro-W3","Hiragino Kaku Gothic Pro",'Noto Sans Japanese', "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro W3","ＭＳ Ｐゴシック","MS PGothic",Geneva,Arial,Verdana,sans-serif;
}


body{
	font-size: 16px;
}



/* PAGE login */


body.login{
	height: 100vh;
	background-color: #F1F3F8;
}


body.login input[type=text],
body.login input[type=password]{
	margin-bottom:18px;
	padding:20px;
	width: 100%;
	box-sizing:border-box;
	outline: 0;
	font-size: 16px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #D0D0D0;
	/*
	box-shadow: 0px 1px 2px 2px rgba(135,135,135,.07) inset;
	*/
}

body.login input[type=submit]{
	margin-bottom:18px;
	padding:20px;
	width: 100%;
	box-sizing:border-box;
	outline: 0;
	font-size: 16px;
	color:#FFF;
	background-color: #FF0000;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #FF0000;
/*	box-shadow: 0px 1px 1px 3px rgba(0,0,0,.05);*/
	cursor: pointer;
}

body.login input[type=submit]:hover,
body.login input[type=submit]:active{
	background-color: #D81226;
	border: 1px solid #D81226;
	transition: background-color 0.2s linear 0;
}

body.login #wrapper #container #contents input[type=checkbox]{
/*	display: inline;*/
	display: none;

	width: 26px;
	height: 26px;
	margin-right: 10px;
	vertical-align: middle;

	box-sizing:border-box;
	outline: 0;
	font-size: 16px;
	background-color: #FF0000;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #D0D0D0;
/*	box-shadow: 0px 1px 1px 2px rgba(0,0,0,.05) inset;*/
	cursor: pointer;
}

body.login #wrapper #container #contents input[type="checkbox"]+label{
    display: none;
    cursor: pointer;
    display: inline-block;
    position: relative;
    padding-left: 25px;
    padding-right: 10px;
}

body.login #wrapper #container #contents input[type=checkbox]+label::before{
    content: "";
    position: absolute;
    display: block;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    left: 0;
    top: 50%;
    border: 1px solid;
    border-color:  #585753; /* 枠の色変更 お好きな色を */
    background-color: #FFF; /* 背景の色変更 お好きな色を */
}

body.login #wrapper #container #contents input[type=checkbox]:checked+label::before{
    border: 1px solid #FF0000;
    background-color: #FF0000; /* 背景の色変更 お好きな色を */
}

/* チェックが入った時のレ点 */
body.login #wrapper #container #contents input[type=checkbox]:checked+label::after{
    content: "";
    position: absolute;
    display: block;
    box-sizing: border-box;
    width: 13px;
    height: 9px;
    margin-top: -9px;
    top: 57%;
    left: 3px;
    transform: rotate(-45deg);
    border-bottom: 2px solid;
    border-left: 2px solid;
    border-color:  #FFF; /* チェックの色変更 お好きな色を */
}


body.login #wrapper #container{
	margin:0 auto;
}

body.login #wrapper #container #contents{
	margin: auto;
	padding:8% 10px 0;
	max-width:440px;
	height: auto;
	margin:0 auto;
	vertical-align: middle;
}

body.login #wrapper #container #contents p{
	margin-bottom:28px;
}

body.login #wrapper h1{
	width: 440px;
	margin-bottom:44px;
	font-size: 28px;
	text-align: center;

	font-family: "Roboto Condensed";
	font-style: normal;
	font-weight: 100;
/*
	src: local('Roboto Condensed Regular'), local('RobotoCondensed-Regular'), url(http://themes.googleusercontent.com/static/fonts/robotocondensed/v9/Zd2E9abXLFGSr9G3YK2MsB43XjeME5heavxWqLE69Ro.ttf) format('truetype');
*/
}

body.login #wrapper h1 span{
	padding:4px 6px;
	font-size: 20px;
	font-weight: 700;
	color:#2F2E57;
	border:1px solid #302F58;
}

body.login #wrapper h1 img{
	margin-bottom:10px;
}

body.login #wrapper #container #contents label{
	display: inline;
	padding:5px 0;
	font-size: 14px;
}


.bg01{
	padding:44px 55px;
	background-color:#FFFFFF;
	border-radius: 3px;

	box-shadow: 0px 1px 1px 2px rgba(112,112,112,.05);
}

body.login #wrapper #container #contents p.att{
	margin-bottom:0;
	font-size: 12px;
}

.mb20px{
	margin-bottom:20px;
}

.input_val{
	display: none;
}