/*====================================================================================*/
/* Common
/*====================================================================================*/

/*====================================================================================*/
/* PC 
/*====================================================================================*/
.PageContentsWrapper{
	padding-top:85px;
	padding-left:260px;
	padding-right:130px;
	text-align:center;
	min-height:100vh;
}
.PageContentsTitle{
	margin-bottom:150px;
}
.PageContentsListWrapper{

}
.PageContentsList{
    margin-right: 20px;
    display: inline-block;
}
.PageContentsList a{
	text-decoration:none;
	color:black;
}
.PageContentsListImage{
}
.PageContentsListImage img{
    width: calc( ( 100vw - 310px - ( 25px * 4 ) ) / 4 );

}
.PageContentsListName{
    width: calc( ( 100vw - 310px - ( 25px * 4 ) ) / 4 );

}
/* ContentsArea */
.ContentsArea{
    position: relative;
    text-align: left;
    margin-bottom: 100px;
    text-align: left;
    padding: 50px;
    border-style: solid;
    border-width: 1px;
    background-color: #f8f8f8;
    border-color: #eeeeee;
}
#LoginArea{
}
#LoginArea > .attention{
	margin-bottom:10px;
}

.ContentsTitle{
	vertical-align: top;
    font-size: 22pt;
    color: gray;
    margin-bottom: 15px;
    border-bottom: solid 1px;
    padding-bottom: 15px;
}
.ContentsArea > .form{
}
.ContentsArea > .caption{
	margin-bottom:30px;
}
.LoginError{
	color:red;
}
.parts{
	margin-bottom:30px;
}

.ContentsCaptionArea{
	vertical-align:top;
}
.LinkButton{
	display:inline-block;
	padding:7px 15px 7px 15px;
	border:solid 1px;
	cursor:pointer;
	background-color:black;
	color:white;
	
	/* For animation */
    transition: background-color 0.75s ease;
    transition: color 0.75s ease;
}
.LinkButton:hover{
	background-color:white;
	color:black;
}
/* form ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿*/
#FormReset > .caption{
	margin-bottom:15px;
}
label{
    width: 175px;
    display: inline-block;
}

input.text{
    width: 220px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    border-radius: 0;
    border: 1px solid #000000;
    border-color: #dddddd;
	background-color:white !important;
    color: #555555;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left:10px;
    margin-right: 20px;
    
    /* font */
    font-size:12pt;
    letter-spacing: 0.1em;
}
input:-internal-autofill-selected {
	background-color:white !important;
}
.pwform{
}
.pwform:after{
	content:"AA";
	background-image:()
}
.FlashEyeIcon{
	width: 40px;
    margin-left: -61px;
	vertical-align: middle;
	cursor: pointer;
}
button {
    display: inline-block;
	padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    /* width: 150px; */
    border-style: solid;
    border-width: 0.5px;
    background-color: black;
    border: solid 1px #dddddd;
    color: white;
    text-align: center;
    transition: background-color 0.75s ease;
    transition: color 0.75s ease;

    /* font */
    font-size:12pt;
    letter-spacing: 0.1em;
}
button:hover{

	/* Design */
	border-style:solid;
	border-width:0.5px;
	background-color:#ffffff;
	color:black;
	text-align:center;
	cursor:pointer;
}
select{
    width: 220px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    border-radius: 0;
    border: 1px solid #000000;
    border-color: #dddddd;
	background-color:white !important;
    color: #555555;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left:10px;
    margin-right: 20px;
    
    /* font */
    font-size:12pt;
    letter-spacing: 0.1em;
}
/* ___ table __________________________________ */
.checkinfo{
	margin-bottom:50px;
}
th,td {
    border: solid 1px;  /* 枠線指定 */
    padding: 18px;      /* 余白指定 */
    font-weight: 100;
}
 
table {
    border-collapse:  collapse; /* セルの線を重ねる */
    
}


/*====================================================================================*/
/* スマフォ縦表示
/*====================================================================================*/
/* ipad pro? */
@media only screen and (max-width: 1024px) and (orientation:portrait){
/* Contents _______________________*/
.PageContentsWrapper{
	padding-top:130px;
	padding-left:45px;
	padding-right:45px;
}
.ContentsArea{
	padding:30px;
}
}
/*====================================================================================*/
/* スマフォ　横表示
/*====================================================================================*/
@media only screen and (max-width: 1024px) and (orientation:landscape){
.PageContentsWrapper{
	padding-left:100px;
}
}