/*======= Area =======*/
#page_mypage_login .ec-layoutRole,
#page_shopping_login .ec-layoutRole{
	padding-bottom:400px;
}

.l_login_area{
	padding-top:100px;
}

.l_login_area .l_inner{
	text-align:center;
}

.l_login_area p{
	margin:0;
}

.l_login_cell .l_inner{
	width:70%;
	margin:0 auto;
}

.l_login_section{
	margin-bottom:100px;
}


.l_login_cell.l_login{
	border-right:1px solid #DDD;
}

.l_login_guide{
	font-family: 'Noto Sans JP';
	font-style: normal;
	font-weight: 400;
	font-size: 13px;
	line-height: 100%;
	letter-spacing: 0.03em;
	color: #333333;
}

/*======= input =======*/
/*----- input -----*/
.l_login_area .l_inner .l_input_area{
	height:160px;
	margin-bottom:20px;
}

.l_login_area .l_inner .l_input_area img{
	height:100%;
}

/*----- title -----*/
.l_login_title{
	font-family: 'Lato';
	font-style: normal;
	font-weight: 700;
	font-size: 32px;
	line-height: 100%;
	text-align: center;
	letter-spacing: 0.03em;
	color: #008C6B;
	margin:0 0 20px 0;
}

.l_login_title .l_title_text{
	
}

.l_login_title .l_title_subtext{
	font-family: 'Noto Sans JP';
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 100%;
	letter-spacing: 0.05em;
	color: #008C6B;
	margin-left:10px;
}

/*----- input -----*/
.l_login_input{
	box-sizing: border-box;
	background: #FFFFFF;
	border: 1px solid #DDDDDD;
	border-radius: 5px 5px 0px 0px;
	
	font-family: 'Noto Sans JP';
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	letter-spacing: 0.03em;

	color: #333333;
	
	height: 54px;
	padding:0 20px;
}

/*----- checkbox -----*/
.ec-checkbox.a_login_auto .a_auto__ckeckbox{
	position:relative;
	padding-left:35px;
}

.ec-checkbox.a_login_auto .a_auto__ckeckbox input{
	display:none;
}

.ec-checkbox.a_login_auto .a_auto__ckeckbox input +label{
	font-family: 'Noto Sans JP';
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 100%;
	letter-spacing: 0.03em;
	color: #333333;
}

.ec-checkbox.a_login_auto .a_auto__ckeckbox input[type="checkbox"] +label:before{
	content:"";
	display:inline-block;
	width:20px;
	height:20px;
	background:#FF0;
	position:absolute;
	left:0;
	top:0;
	background: #FFFFFF;
	border: 1px solid #BBBBBB;
	border-radius: 4px;
}

.ec-checkbox.a_login_auto .a_auto__ckeckbox input[type="checkbox"] +label:after{
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    content: '';
    display: block;
    height: 7px;
    left: 8px;
    margin-top: -7px;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 5px;
}


.ec-checkbox.a_login_auto .a_auto__ckeckbox input[type="checkbox"]:checked{
	display:none;
}

.ec-checkbox.a_login_auto .a_auto__ckeckbox input[type="checkbox"]:checked +label:before{
	content:"";
	display:inline-block;
	width:20px;
	height:20px;
	background:#FF0;
	position:absolute;
	left:0;
	top:0;
	background: #008C6B;
	border: 1px solid #008C6B;
	border-radius: 4px;
}

.ec-checkbox.a_login_auto .a_auto__ckeckbox input[type="checkbox"]:checked +label:after{
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    content: '';
    display: block;
    height: 7px;
    left: 8px;
    margin-top: -7px;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 5px;
}

/*----- action -----*/
.l_login_action{
	width:100%;
	height: 60px;
	color:#FFF;
	border:none;
	background: #008C6B;
	border-radius: 5px;
	position:relative;
}

.l_login_action:hover{
	background: #0B6852;
	color:#FFF;
}

.l_login_action:disabled{
	background: #BBBBBB;
}

.l_signup .l_login_action{
	display:block;
	text-decoration:none;
	line-height:60px;
}

.l_login_action:before {
	content:"";
	display:block;
	position:absolute;
	z-index:5;
	top:23px;
	right:20px;
	width:10px;
	height:15px;
	background:url("../img/icon2/caret_r.svg");
	background-repeat:no-repeat;
}


/*----- link -----*/
a.l_login_link{
	font-family: 'Noto Sans JP';
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 100%;
	letter-spacing: 0.05em;

	color: #969696;
}

a.l_login_link:hover{
	color: #333333;
	text-decoration:none;
}


/*======= explane =======*/
.l_login_explane__title_area{
	border-bottom:1px solid #97E0CF;
}

.l_login_explane__title_area hr{
	margin :20px 0 1px 0;
	border-bottom:2px solid #97E0CF;
}

.l_login_explane__title{
	font-weight: 600;
	font-size: 20px;
	color: #333333;
	text-align:center;
}

.l_login_explane__title .l_login_explane_subtext{
	font-weight: 600;
	font-size: 14px;
	color: #008C6B;
	margin-left:20px;
}


.l_login_explane__item .l_item{
	margin-bottom:20px;
}

.l_login_explane_subtext .l_subtext_only{
	color: #008C6B;
}

.login_exp_icon{
	width:30px;
}


/*======= sp =======*/
@media screen and (max-width:767px){
	.l_login_cell .l_inner{
		width:100%;
	}
	
	.l_login_cell.l_login{
		border-right:0;
	}
	
	#page_mypage_login .ec-layoutRole{
		padding-bottom:200px;
	}
	
	.l_login_explane__item .l_item{
		font-size:12px;
	}
	
	.l_login_explane__item .l_item.dflx_cc{
		flex-direction :column;
		-webkit-flex-direction :column;
	}
}