/* -- signup -- */
.signup-info{
	margin-left:2rem;
	margin-bottom:3rem;
	position:relative;
	border-bottom:rgba(220,20,60,0.7) solid 2px;
}
.signup-info:before{
	content:'\f06a';
	font-family:'Font Awesome 5 Free';
	font-weight:900;
	display:block;
	width:2rem;
	color:#f05242;
	font-size:1.1rem;
	text-align:center;
	position:absolute;
	left:-2rem;
	top:0;
}
.signup-kind{
	position:relative;
}
.signup-kind:before{
	content:'';
	display: block;
	width:4px;
	height:100%;
	background-image:linear-gradient(to right,#24936e 0%, #036eb8 100%);
	position: absolute;
	top:0;
	left:calc(50% - 2px);
	z-index:10;
}
.signup-kind,.service-kind{
	padding-left:15px;
	padding-right:15px;
}
.signup-kind a,.service-kind a{
	border-color:transparent;
	border-width:4px;
	border-style:solid;
	background:rgba(0,0,0,0);
}
.signup-kind a span{
	display:block;
}
.signup-kind a.inactive,
.service-kind a{
	background:rgba(0,0,0,.3);
	border-color:rgba(0,0,0,0);
}
.signup-kind a.inactive:hover,
.service-kind a:not(.active):hover{
	background:rgba(0,0,0,0);
}
.signup-kind a, .signup-kind a *,
.service-kind a{
	transition:all .2s ease-in-out .2s;
}
.signup-kind .visitor{
	padding-left:30px;
	border-radius:calc(50% + 1.325rem) 0 0 calc(50% + 1.325rem);
	border-right:none;
}
.signup-kind .company{
	padding-right:30px;
	border-radius:0 calc(50% + 1.325rem) calc(50% + 1.325rem) 0;
	border-left:none;
}
.signup-kind .visitor,
.signup-kind .visitor.inactive:hover,
.visitor .service-kind a:hover{
	border-color:#24936e;
}
.signup-kind .visitor:hover,
.signup-kind .visitor.active,
.visitor .service-kind .active,
.visitor .signup-form .title{
	background:#24936e;
}
.signup-kind .company,
.signup-kind .company.inactive:hover,
.company .service-kind a:hover{
	border-color:#036eb8;
}
.signup-kind .company:hover,
.signup-kind .company.active,
.company .service-kind .active,
.company .signup-form .title{
	background:#036eb8
}
.visitor .h-line{
	padding-top:.25rem;
	padding-bottom:.25rem;
	color:#24936e;
	line-height:2.5rem;
	font-size:1.1rem;
	font-weight:bold;
	background:rgba(0,0,0,.15);
	text-align:center;
	border-radius:3rem;
}
#inquire .signup-form .title{
	background:#f05242;
}
.signup-kind .icon{
	display:block;
	margin:0 auto;
	width:156px;
	height:156px;
	text-align:center;
	position:relative;
}
.signup-kind .icon:after{
	display:block;
	font-family:'Font Awesome 5 Free';
	font-weight:900;
	font-size:100px;
	transform:translate(-50%,-50%);
	position:absolute;
	left:50%;
	top:50%;
	transition:all .2s ease-in-out .2s;
}
.signup-kind .visitor .icon:after{
	content:'\f007';
	color:#24936e;
}
.signup-kind .company .icon:after{
	content:'\f0b1';
	color:#036eb8;
}
.signup-kind a:hover .icon:after,
.signup-kind a.active .icon:after{
	color:#fff;
}
.signup-kind .icon i{
	display:block;
	text-indent:-99999px;
}
.signup-kind .title,
.service-kind{
	padding-bottom:1rem;
	font-size:1.1rem;
	font-weight:bold;
	text-align:center;
}
.signup-kind .visitor .title,
.signup-kind .visitor.inactive:hover .title,
.visitor .service-kind a:hover{
	color:#24936e;
}
.signup-kind .company .title,
.signup-kind .company.inactive:hover .title,
.company .service-kind a:hover{
	color:#036eb8;
}
.signup-kind a:hover .title,
.signup-kind a.active .title,
.signup-kind a.inactive .title,
.service-kind a, .service-kind a.active:hover{
	color:#fff;
}
.service-kind a{
	padding-top:8px;
	padding-bottom:8px;
}
.service-kind a:first-child{
	padding-left:30px;
	border-radius:calc((1.65rem / 2) + 12px) 0 0 calc((1.65rem / 2) + 12px);
}
.service-kind a:last-child{
	padding-right:30px;
	border-radius:0 calc((1.65rem / 2) + 12px) calc((1.65rem / 2) + 12px) 0;
}
@media screen and (max-width: 575.98px){
	.signup-kind a .icon{
		width:100%;
		height:0;
		padding-bottom:100%;
	}
	.signup-kind .icon:after{
		font-size:36px;
	}
	.signup-kind .title,
	.service-kind{
		font-size:1.05rem;
	}
}

/* -- signup-form --*/
form.visitor, form.company{
	margin-bottom:0;
}
b.star,
.form-note{
	padding-top:.36rem;
	padding-bottom:.36rem;
	font-size:.9rem;
}
b.star,
.form-note i.fa-times-circle {
	color:#f05242;
}
.form-note i.fa-exclamation-circle{
	color:#007bff;
}
.form-note i.fa-check-circle{
	color:#4caf50;
}
.form-note{
	display:block;
}
.signup-form{
	margin-top:30px;
}
.product-edit .signup-form{
	margin-top:0;
}
.signup-form .info{
	margin:1rem 0;
	color:#f05242;
	font-size:.9rem;
	text-align:right;
}
.signup-form .title{
	padding-top:8px;
	padding-bottom:8px;
	color:#fff;
	text-align:center;
	font-size:1.1rem;
	font-weight:bold;
	border-radius:1rem 1rem 0 0;
}
.signup-form .title.br-0{
	margin-top:30px;
	margin-bottom:15px;
	border-radius:0;
}
.signup-form .form-data{
	margin-bottom:30px;
	padding:15px 15px 30px 15px;
	background:#fff;
	border:rgba(0,0,0,.15) solid 1px;
	border-radius:0 0 1rem 1rem;
}
.product-edit .form-data{
	border:none;
	padding:0;
}
.signup-form .form-data .cell{
	padding-top:.375rem;
	padding-bottom:.375rem;
	border-top:rgba(0,0,0,.08) solid 1px;
}
.signup-form .form-data .cell:last-child{
	border-bottom:rgba(0,0,0,.08) solid 1px;
}
.signup-form .form-data .cell-label,
.signup-form .form-data .cell-cont .data{
	height:calc(1.5rem + .75rem);
	line-height:calc(1.5rem + .75rem);
}
.signup-form .form-data .cell-label{
	width:calc(6rem + 30px);
}
.signup-form .form-data .cell-cont{
	border-left:rgba(0,0,0,.08) solid 1px;
}
.subscript, .securcheck{
	padding-top:15px;
	padding-bottom:15px;
	border-bottom:#ccc dashed 1px;
}
.securcheck{
	border-top:#ccc dashed 1px;
	border-bottom:#ccc dashed 1px;
}
.subscript + .securcheck{
	border-top:none;
}
.subscript .title{
	margin-bottom:1rem;
	font-weight:bold;
}
.securcheck{
	margin-bottom:30px;
}
.securcheck .s-img{
	font-size:.9rem;
	transition:all .2s ease-in-out .2s;
}
.securcheck .s-img img{
	width:120px;
}
.form-btn{
	margin-top:30px;
}
.form-btn button{
	display:block;
	width:100%;
	text-align:center;
	color:#fff;
	line-height:calc(3rem - 6px);
	font-size:1.1rem;
	font-weight:bold;
	transition:all .2s ease-in-out .2s;
	border-radius:3rem;
	border-style:solid;
	border-width:3px;
	cursor:pointer;
}
.form-btn button i{
	font-weight:900;
}
.form-btn button[type="reset"]{
	background:#fff;
	color:#888;
	border-color:transparent;
}
.form-btn button[type="reset"]:hover{
	border-color:rgba(136,136,136,.5);
}
.visitor .securcheck .s-img,
.visitor .form-btn button[type="submit"]:hover{
	color:#24936e;
}
.visitor .form-btn button[type="submit"]{
	background:#24936e;
	border-color:rgba(36,147,110,.5);
}
.company .securcheck .s-img,
.company .form-btn button[type="submit"]:hover{
	color:#036eb8;
}
.company .form-btn button[type="submit"]{
	background:#036eb8;
	border-color:rgba(3,110,184,.5);
}
.inquire .form-btn button[type="submit"]{
	background:#f05242;
	border-color:rgba(220,20,60,0.5);
}
.inquire .securcheck .s-img,
.inquire .form-btn button[type="submit"]:hover{
	color:#f05242;
}
.visitor .form-btn button:hover,
.company .form-btn button:hover,
.inquire .form-btn button:hover{
	background:rgba(255,255,255,.5);
}
.securcheck .s-img:hover{
	color:#888;
}

@media screen and (max-width:575px){
	.signup-form .form-data .cell-cont{
		border-left:none;
	}
	.signup-form .form-data .mult:not(:last-child){
		padding-bottom:.375rem;
	}
	.securcheck .s-img{
		padding-bottom:15px;
	}
	.signup-form .form-data .cell-label, .signup-form .form-data .cell-cont .data{
		margin-bottom:0.5rem;
		height:1.5rem;
		line-height:1.5rem;
	}
	.form-btn > div[class*=col-]{
		padding-left:8px;
		padding-right:8px;
	}
	.form-btn button{
		font-size:1rem;
	}
}
@media screen and (max-width: 991.98px){
	.signup-form{
		padding-left:15px;
		padding-right:15px;
	}
}
.notify{
	margin-top:60px;
	margin-bottom:60px;
	text-align:center;
}
.notify .signup-info{
	margin-bottom:0;
}
@media screen and (max-width: 575.98px){
	.signup-info{
		width:calc(100% - 30px);
		margin-top:2rem;
		margin-left:15px;
		margin-right:15px;
		text-align: center;
		border:none;
	}
	.signup-info:before{
		transform:translateX(-50%);
		top:-1.5rem;
		left:50%;
	}
}

/* -- visitor-res -- */
.visitor-res .icon .icon-box{
	width:100%;
	height:0;
	padding-bottom:100%;
	position:relative;
	border-radius:1rem 1rem 0 0;
}
.visitor-res .icon.vist .icon-box{
	background:#42acaf;
}
.visitor-res .icon.arch .icon-box{
	background:#21988e;
}
.visitor-res .icon.intr .icon-box{
	background:#00846d;
}
.visitor-res .icon .icon-box i.fa{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	color:#fff;
	font-size:60px;
}
.visitor-res .detail{
	border-top:rgba(0,0,0,.15) solid 10px;
	border-bottom:rgba(0,0,0,.15) solid 10px;
}
.visitor-res .detail .detail-box{
	padding:15px 0;
}
.visitor-res .detail .detail-box strong{
	color:#e95514;
	text-align:center;
}
@media screen and (max-width:767px){
	.visitor-res .icon .icon-box{
		padding-bottom:30%;
		border-radius:1.5rem 1.5rem 0 0;
	}
	.visitor-res .detail{
		margin-bottom:30px;
		padding-top:20px;
		padding-bottom:20px;
		background:rgba(0,0,0,.08);
		text-align:center;
	}
}
.visitor-join a, .visitor-join a:hover{
	color:#777;
}
.visitor-join a{
	display:inline-block;
	border-bottom:rgba(240,94,28,0.7) solid 2px;
}
.visitor-join a:hover{
	border-bottom:rgba(240,94,28,1) solid 2px;
}

/*-- tel valid --*/
input[type=tel] + span{
	display:inline-block;
	width:30px;
	height:1.5rem;
	transform:translateY(-50%);
	position:absolute;
	top:50%;
	right:15px;
}
input[type=tel] + span:after{
	display:block;
	width:30px;
	height:1.5rem;
	font-family:'Font Awesome 5 Free';
	font-weight:900;
	transform:translateY(-50%);
	position:absolute;
	left:0;
	top:50%;
}
input[type=tel]:invalid + span:after{
	content:'\f057';
	color:#f05242;
}
input[type=tel]:valid + span:after{
	content:'\f058';
	color:#4caf50;
}

/*--add-product--*/
.add-product{
	margin-top:30px;
}
.add-product a{
	padding-left:calc(30px + 2rem);
	padding-right:30px;
	position:relative;
	line-height:calc(3rem - 6px);
	font-size:1.1rem;
	border-radius:3rem;
	border-width:3px;
	border-style:solid;
	border-color:#036eb8;
	background:#036eb8;
	color:#fff;
	transition:all .2s ease-in-out .2s;
	cursor:pointer;
}
.add-product a:after{
	content:'\f0fe';
	display:block;
	width:2rem;
	text-align:center;
	font-family:'Font Awesome 5 Free';
	font-weight:900;
	font-size:1.2rem;
	position:absolute;
	top:50%;
	left:30px;
	transform:translateY(-50%);
}
.add-product a:hover{
	color:#036eb8;
	background:#fff;
}

.list-cont .list-title {
	margin-top: 30px;
	margin-bottom: 15px;
	font-size: 1.5rem;
	font-weight: bold;
	color: #929292;
	border-bottom: #929292 solid 2px;
}
.list-data.edit-list{
	display:flex;
	flex-wrap:wrap;
	font-size:16px;
}

.list-data a[class*=list-]{
	display:inline-block;
	margin-right:1rem;
	margin-bottom:6px;
	padding-left:30px;
	position: relative;
	color:#555;
}
.list-data a[class*=list-]:before{
	display:inline-block;
	width:30px;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	color: #00a29a;
	line-height: inherit;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
}
.list-data a[class*=list-]:after{
	content:'';
	display:block;
	width:0;
	height:2px;
	background:#ccc;
	position: absolute;
	left:0;
	bottom:-4px;
	transition:all .2s ease-in-out .2s;
}
.list-data a[class*=list-]:hover:after{
	width:100%;
}
.list-data a.list-delete:before,
.list-data a.list-info.inactive:before{
	color:#f05242;
}