﻿@charset "utf-8";  
/*------------------------------------------------------------ 
    login css
------------------------------------------------------------*/  

#login-hd{
	color:#333;
	padding:15px 0 25px;
}

#login-hd h2{
	display:inline-block;
	vertical-align:middle;
	font-size:175%;
	line-height:24px;
}

#login-hd p{
	display:inline-block;
	vertical-align:middle;
	line-height:24px;
	font-size:117%;
	padding-left:15px;
	margin-left:15px;
	border-left:1px solid #999;
}

.login-sentense {
	color: #333;
	font-size: 117%;
	line-height: 1.4;
	margin-bottom: 30px;
}

.login-link{
	text-align:right;
	margin-bottom:15px;
}

.login-link a{
	color:#333;
	font-size:117%;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	-o-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}

.login-link a:hover{ color:#EA66A4;}

#login-column{
	width:auto;
	padding:30px;
	margin-bottom:80px;
	border:1px solid #ddd;
}

#left-column{
	width:50%;
	float:left;
	text-align:center;
	padding-top:20px;
	padding-right:30px;
	border-right:1px solid #ddd;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	position:relative;
}

#left-column:after{
    display: block;
    content: "OR";
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    color: #fff;
    font-size: 117%;
    font-weight: bold;
    background: #ccc;
    border-radius: 50%;
    position: absolute;
    right: -20px;
    top: 50%;
    margin-top: -20px;
    z-index: 10;
}

#right-column{
	width:50%;
	float:right;
	text-align:center;
	padding-top:20px;
	padding-left:30px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.login-sub-hd{
	color:#333;
	font-size:134%;
	font-weight:bold;
	padding:15px 0;
}

.form-list{
	width:100%;
	max-width:300px;
	margin:15px auto 30px;
}

.form-save{
	margin-top:10px;
	text-align:right;
	color:#666;
}

.login-btn{
	width:100%;
	max-width:220px;
	height:40px;
	margin:0 auto;
}

.login-btn a{
	display:block;
	width:100%;
	height:100%;
	text-align:center;
	line-height:40px;
	color:#fff;
	font-size:134%;
	font-weight:bold;
	background:#FF9EBA;
	border-radius:5px;
}

.password-send-txt{
	text-align:center;
	margin-top:15px;
}

.password-send-txt a{ color:#666;}

.password-send-txt a span {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.sns-btn{
	width:100%;
	max-width:300px;
	margin:60px auto 20px;
}

.login-txt{
	text-align: center;
	color: #333;
	line-height: 1.4;
	font-size: 109%;
}

.login-txt2{
	color:#666;
	font-size:117%;
	margin-top:40px;
	text-align:center;
}

.login-txt2 a{
	color: #EA66A4;
	text-decoration: underline;
}

#password-area{
	width:auto;
	max-width:560px;
	padding:55px 20px;
	margin:0 auto 80px;
	text-align:center;
	border:1px solid #ddd;
}

.password-input{
	width:100%;
	max-width:300px;
	margin:0 auto;
	padding:25px 0 35px;
}

/*------------------------------------------------------------ 
    MediaQuery 
------------------------------------------------------------*/  

/* PC */
@media screen and (min-width: 789px){
	

}

/* TABLET */
@media screen and (max-width: 788px){

}


/* SP */
@media screen and (max-width: 560px){


}

dmp
