@charset "utf-8";
/**
 * HANIRO LINE — 会員登録 skin
 * 운영 /account/register2017 본문 — HANIRO 헤더·푸터 안에서 표시
 */

body.haniro.haniro-register {
	background: var(--haniro-color-bg1);
}

body.haniro.haniro-register .haniroSignin__wrap,
body.haniro.haniro-register .haniroSignin__section {
	background: var(--haniro-color-bg1);
}

body.haniro.haniro-register .haniroSignin__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--haniro-layout-width);
	margin: 0 auto;
	padding: 40px 20px 100px;
}

body.haniro.haniro-register #container.SignUp {
	float: none;
	width: 100%;
	max-width: 100%;
	margin: 0 !important;
	padding: 0 0 40px;
	background-color: transparent !important;
}

body.haniro.haniro-register #container.SignUp .accountN {
	width: 680px;
	max-width: 100%;
	margin: 0 auto;
	font-family: var(--haniro-font-jp) !important;
}

body.haniro.haniro-register #container.SignUp .accountN .topTit h1,
body.haniro.haniro-register #container.SignUp .accountN h1 {
	font-family: var(--haniro-font-jp) !important;
	color: var(--haniro-color-black1) !important;
}

body.haniro.haniro-register #container.SignUp .topTit .required {
	font-size: 14px;
	font-weight: 700;
}

body.haniro.haniro-register #container.SignUp .topTit .required span,
body.haniro.haniro-register #container.SignUp dl.cLine2 dt .fColor1,
body.haniro.haniro-register #container.SignUp dl.cLine2 dt label .fColor1 {
	color: var(--haniro-color-red) !important;
}

/* 링크 — 블루 */
body.haniro.haniro-register #container.SignUp a.fColor1 {
	color: var(--haniro-color-blue) !important;
}

body.haniro.haniro-register #container.SignUp .outBox,
body.haniro.haniro-register #container.SignUp .outBox .accountN,
body.haniro.haniro-register #container.SignUp #registerComplete .outBox {
	width: 100%;
	max-width: 680px;
	box-sizing: border-box;
}

body.haniro.haniro-register #container.SignUp .accountN .outBox,
body.haniro.haniro-register #container.SignUp #registerComplete .outBox {
	padding: 60px !important;
	box-sizing: border-box;
	border-radius: 15px;
	overflow: hidden;
	box-shadow: var(--haniro-shadow-box) !important;
	background: var(--haniro-color-white);
}

body.haniro.haniro-register #container.SignUp #registerForm .outBox #content.accountN,
body.haniro.haniro-register #container.SignUp #registerComplete .outBox #content.accountN {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 auto;
	float: none;
}

/* 폼 — 운영 원본 가로 dt+dd 레이아웃 */
body.haniro.haniro-register #container.SignUp dl.cLine2 {
	display: block;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 0 10px;
	overflow: hidden;
	float: none;
}

body.haniro.haniro-register #container.SignUp dl.cLine2 dt {
	width: 190px;
	max-width: 190px;
	height: 48px;
	line-height: 48px;
	float: left;
	display: block;
	padding: 0 30px;
	box-sizing: border-box;
	background-color: #f1f1f1 !important;
	font-weight: bold;
	font-size: 12px;
}

body.haniro.haniro-register #container.SignUp dl.cLine2 dd {
	width: calc(100% - 190px);
	float: left;
	background-color: #f8f8f8 !important;
	padding: 10px 15px;
	min-height: 48px;
	max-height: none;
	box-sizing: border-box;
}

body.haniro.haniro-register #container.SignUp dl.cLine2 dd input {
	width: 100% !important;
	height: 28px !important;
	line-height: 28px !important;
	border: none !important;
	background-color: #f8f8f8 !important;
	box-sizing: border-box;
	outline: none;
	box-shadow: none;
}

body.haniro.haniro-register #container.SignUp form input:focus,
body.haniro.haniro-register #container.SignUp form input:focus-visible,
body.haniro.haniro-register #container.SignUp form input[type="text"]:focus,
body.haniro.haniro-register #container.SignUp form input[type="text"]:focus-visible,
body.haniro.haniro-register #container.SignUp form input[type="password"]:focus,
body.haniro.haniro-register #container.SignUp form input[type="password"]:focus-visible,
body.haniro.haniro-register #container.SignUp form select:focus,
body.haniro.haniro-register #container.SignUp form select:focus-visible,
body.haniro.haniro-register #container.SignUp #settingForm input:focus,
body.haniro.haniro-register #container.SignUp #settingForm input:focus-visible,
body.haniro.haniro-register #container.SignUp #settingForm select:focus,
body.haniro.haniro-register #container.SignUp #settingForm select:focus-visible {
	border: none !important;
	border-width: 0 !important;
	background-color: #f8f8f8 !important;
	box-shadow: none !important;
	outline: none !important;
	-webkit-tap-highlight-color: transparent;
}

body.haniro.haniro-register #container.SignUp dl.cLine2.select dd {
	overflow: hidden;
}

body.haniro.haniro-register #container.SignUp dl.cLine2.select dd.sBox {
	width: 129px;
	padding: 10px 8px 10px 10px;
}

body.haniro.haniro-register #container.SignUp dl.cLine2.select dd.sBox select.sel {
	width: 100% !important;
	height: 28px !important;
	line-height: 28px !important;
	padding: 0 18px 0 0 !important;
	border: none !important;
	border-radius: 0;
	background: url(/images2017/sub/right_arrow.png) 100% 50% no-repeat !important;
	background-color: #f8f8f8 !important;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
}

body.haniro.haniro-register #container.SignUp dl.cLine2.select dd:not(.sBox) {
	width: calc(100% - 190px - 129px - 10px);
	margin-left: 10px;
}

body.haniro.haniro-register #container.SignUp dl.cLine2.select dd:not(.sBox) input {
	width: 100% !important;
	height: 28px !important;
	line-height: 28px !important;
}

body.haniro.haniro-register #container.SignUp .accountNTxt {
	width: 100%;
	max-width: 100%;
	margin-top: 10px;
	padding: 16px 0 10px 20px;
	font-size: 12px;
	line-height: 20px;
	color: #5e5e5e;
	border-bottom: 1px solid #f1f1f1;
	box-sizing: border-box;
}

body.haniro.haniro-register #container.SignUp .accountNTxt p {
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 10px;
	padding-top: 20px;
	margin: 0;
}

body.haniro.haniro-register #container.SignUp .accountNTxt label {
	cursor: pointer;
}

body.haniro.haniro-register #container.SignUp .cBtnArea {
	width: 100%;
	padding-top: 25px;
	text-align: left;
	overflow: visible;
}

body.haniro.haniro-register #container.SignUp .cBtnArea .btnPack {
	display: block;
	width: 100%;
	margin: 0;
	float: none;
}

body.haniro.haniro-register #container.SignUp .cBtnArea .btnPack a {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100% !important;
	height: 46px;
	line-height: 46px;
	padding: 0 16px !important;
	border-radius: 4px !important;
	font-size: 14px;
	text-decoration: none !important;
}

/* 가입·완료 버튼 — 블루 */
body.haniro.haniro-register #container.SignUp .btnPack.btnC5 a,
body.haniro.haniro-register #container.SignUp .btnPack.btnC5 a:link,
body.haniro.haniro-register #container.SignUp .btnPack.btnC5 a:visited {
	border: 1px solid var(--haniro-color-blue) !important;
	background: var(--haniro-color-blue) !important;
	color: var(--haniro-color-white) !important;
}

body.haniro.haniro-register #container.SignUp .btnPack.btnC5 a:hover,
body.haniro.haniro-register #container.SignUp .btnPack.btnC5 a:focus {
	border-color: var(--haniro-color-blue-light) !important;
	background: var(--haniro-color-blue-light) !important;
	color: var(--haniro-color-white) !important;
}

/* 가입 완료 */
body.haniro.haniro-register #container.SignUp #registerComplete .accountNPoint {
	padding: 0;
	color: #303030;
	font-size: 14px;
	text-align: center;
}

body.haniro.haniro-register #container.SignUp #registerComplete .accountNPoint .Tinfor {
	font-weight: bold;
}

body.haniro.haniro-register #container.SignUp #registerComplete .accountNPoint .Emailinfor {
	font-weight: bold;
	background-color: #f8f8f8;
	padding: 10px 30px;
	margin-top: 10px;
}

body.haniro.haniro-register #container.SignUp #registerComplete .accountNPoint .Emailinfor span {
	color: var(--haniro-color-blue) !important;
}
