@charset "utf-8";

.l-container {padding:10px 0 0 0; margin:0 10px;}

.l-container .logo {text-align:center; padding:10px 0;}
.l-container .logo img {width:100%; border:0;}

.l-container .tabs {margin:0 15px 30px 15px; position:relative;}
.l-container .tabs ul {display:block; white-space:nowrap; height:47px;}
.l-container .tabs li {position:relative; display:inline-block; vertical-align:middle; width:calc(50% + 1px);}
.l-container .tabs li:nth-child(2) {margin-left:-1px;}
.l-container .tabs li label {z-index:1; position:relative; display:block; height:47px; background-color:#fff; word-break:break-all; text-align:center;}
.l-container .tabs li label {font-weight:bold; line-height:45px; font-size:18px; color:#acacac;}
.l-container .tabs li label:before {z-index:-2; display:block; content:''; position:absolute; left:0; top:0; width:calc(100% - 2px); height:calc(100% - 2px); border:1px solid #ebebeb; opacity:1;}
.l-container .tabs li label:after {z-index:-1; display:block; content:''; position:absolute; left:0; bottom:0; width:100%; border-bottom:1px solid #000000;}
.l-container .tabs li label.focus {z-index:2; color:#000000;}
.l-container .tabs li label.focus:before {border-color:#000000; border-bottom:0; height:calc(100% - 1px);}
.l-container .tabs li label.focus:after {border-color:transparent;}

.l-container .wrap {padding:0 15px 0 15px;}
.l-container .wrap.ty-2 {padding-bottom:100px;}

.l-container .list {margin:25px 0 0 0; position:relative; display:block;}
.l-container .list ul {display:block;}
.l-container .list ul li {display:block;}
.l-container .list ul li:last-child {margin-top:-1px;}
.l-container .input {transition:border 0.2s, background 0.2s; z-index:1; display:block; vertical-align:middle; background-color:#f7f7f7; border:1px solid #d7d7d7;}
.l-container .input input {padding:0 10px 0 10px; width:calc(100% - 22px); height:40px;}
.l-container .input input {font-weight:bold; line-height:40px; font-size:16px; color:#acacac;}
.l-container .input .name {font-weight:bold; line-height:40px; font-size:16px; color:#acacac;}
.l-container .input.focus {z-index:2; background-color:#ffffff;}
.l-container .input.value input,
.l-container .input.focus input {color:#000000;}

.l-container .link {margin:10px 0 0 0; position:relative;}
.l-container .link label {display:inline-block; vertical-align:middle; cursor:pointer;}
.l-container .link label {font-weight:bold; line-height:22px; font-size:13px;}
.l-container .link .side {position:absolute; right:0; top:0;}
.l-container .link a {display:inline-block; vertical-align:middle;}
.l-container .link a {font-weight:bold; line-height:22px; font-size:13px;}

.l-container .result {margin:26px 0 -13px 0; position:relative; display:none; padding-left:20px;}
.l-container .result {line-height:1.4; font-size:14px; color:#ef4f4e;}
.l-container .result.active {display:block;}
.l-container .result:before {content:'✔';}
.l-container .result:before {display:block; position:absolute; right:-15px; top:0;}
.l-container .result:before {font-weight:400; line-height:1.4; font-size:14px; color:#ef4f4e;}
.l-container .result.ty-2 {margin-top:17px}

.l-container .guest-msg {margin:6px 0 -3px 0;}
.l-container .guest-msg {line-height:1.4; font-size:14px; color:#000000;}

.l-container .hp-step1,
.l-container .hp-step2 {display:none;}
.l-container .hp-step1.active,
.l-container .hp-step2.active {display:block;}
.l-container .hp-step2 .tx1 {margin:-7px 0 0 0; text-align:center;}
.l-container .hp-step2 .tx1 {font-weight:bold; line-height:27px; font-size:18px; color:#000000;}

.l-container .code-input {margin-top:26px; display:table; width:100%;}
.l-container .code-input ul {display:table-row;}
.l-container .code-input li {display:table-cell; vertical-align:top;}
.l-container .code-input li:nth-child(2) {padding-left:5px; width:110px;}
.l-container .code-input .btn {display:block; height:41px; background-color:#acacac; text-align:center; cursor:pointer;}
.l-container .code-input .btn {font-weight:bold; line-height:41px; font-size:15px; color:#fff;}
.l-container .code-input .btn:hover {background-color:#000000;}

.l-container .code-timer {margin:8px 0 -3px 0; padding-bottom:10px;}
.l-container .code-timer {line-height:1.4; font-size:14px; color:#000000;}
.l-container .code-timer .timer {color:#605ca8;}
.l-container .code-timer .error {color:#f16362;}

.l-container .submit {position:relative; margin:20px 0 0 0; text-align:center; cursor:pointer;}
.l-container .submit {line-height:45px; font-size:18px; color:#ffffff;}

.l-container .account {margin-top:25px;}
.l-container .account li {padding:3px 0 1px 0; position:relative; display:inline-block; vertical-align:top; cursor:pointer;}
.l-container .account li:before {display:block; content:''; position:absolute; left:0; top:0; width:0; height:100%; border-left:1px dotted #e0e0e0;}
.l-container .account li:first-child:before {display:none;}
.l-container .account span {position:relative; margin:0 auto; display:block; width:20px; height:20px;}
.l-container .account span:before {display:block; content:''; position:absolute; left:0; top:0;}
.l-container .account p {margin-top:10px; text-align:center;}
.l-container .account p {line-height:15px; font-size:13px;}

.l-container .account.type1 {margin-top:10px;}
.l-container .account.type1 li {padding:10px 0 10px 0; width:calc(100% - 2px); border:1px solid #d7d7d7; background-color:#f7f7f7; text-align:center;}
.l-container .account.type1 li span,
.l-container .account.type1 li p {margin:0; display:inline-block; vertical-align:top;}
.l-container .account.type1 li p {margin-left:10px; margin-right:20px; padding-top:2px;}
.l-container .account.type2 li {width:50%;}
.l-container .account.type3 li {width:33.333%;}
.l-container .account.type4 li {width:25%;}

.l-container .join {margin:100px 15px 0 15px; display:block; background-color:#000000; text-align:center; cursor:pointer;}
.l-container .join {text-decoration:none; line-height:45px; font-size:18px; color:#ffffff;}