@charset "utf-8";
/* CSS Document */


.table_box{
	width:100%;
	padding-bottom: 20px;
}


.main .box p{
	margin: 5px 0;
	padding: 3px 10px;
}
.main .box{
	margin: 0 0 20px;
}

.table_box .box{
	border-collapse:collapse;
	margin:0 ;
	width:100%;
	background:none;
	
}
.c{
	text-align:center;
}
.submit_c{
	float:none;text-align: center;
}


.submit_c form{
	display:inline;
	float:none;
}

.submit_c form input{
	display:inline;
	float:none;
}

.c form{
	display:inline;
}

input,select,textarea{
	background:#fff;
	border:1px solid #ccc;
	padding:3px;
}
dd input,dd textarea{
	width: 100%;
}
	
dd p span{
	display: flex;
}
	
dd p span input{
	width: calc(50% - 2.5em);
	max-width: 10em;
}
	
	
/*Webkit*/
::-webkit-input-placeholder    {color: #999}
 
/*Firefox 19以降*/
::-moz-placeholder    {color: #999}
 
/*Firefox 18以前*/
:-moz-placeholder    {color: #999}
 
/*Windows IE*/
:-ms-input-placeholder    {color: #999} 

input[type="submit"]{
	text-align:center;
	border-radius: 3px;
    box-shadow: 0 0 1px #FFFFFF inset;
    color: #FFFFFF;
	display:inline-block;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    margin: 5px auto;
    padding: 5px 10px;
	background:-moz-linear-gradient(top, #569ece 0%, #2776AA 100%); /* FF3.6+ */
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#569ece),color-stop(100%,#2776AA)); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top, #569ece 0%, #2776AA 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top, #569ece 0%, #2776AA 100%); /* Opera 11.10+ */
	background:-ms-linear-gradient(top, #569ece 0%, #2776AA 100%); /* IE10+ */
	background:linear-gradient(to bottom, #569ece 0%, #2776AA 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#569ece', endColorstr='#2776AA',GradientType=0 ); /* IE6-9 */
    border: 1px solid #2776AA;
    text-shadow: 1px 1px 0 #216091;
}

input[type="submit"]:active{
	opacity:0.6;
	background:-moz-linear-gradient(top, #569ece 0%, #2776AA 100%); /* FF3.6+ */
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#569ece),color-stop(100%,#2776AA)); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top, #569ece 0%, #2776AA 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top, #569ece 0%, #2776AA 100%); /* Opera 11.10+ */
	background:-ms-linear-gradient(top, #569ece 0%, #2776AA 100%); /* IE10+ */
	background:linear-gradient(to bottom, #569ece 0%, #2776AA 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#569ece', endColorstr='#2776AA',GradientType=0 ); /* IE6-9 */

}


input[type="submit"]:hover{
	opacity:0.70;
}
input[type="submit"]:disabled{
	opacity:0.30;
}


.table_box .finish{
	padding:10px;
	background:#FFFFFF;
}
.progressbar {
  display: flex;
  flex-wrap: wrap;
    border: 1px solid #c8077c;
	border-radius: 8px;
	margin-bottom: 10px;
}
.progressbar .item {
    position: relative;
    width:calc(100% / 3);
    text-align: center;
    align-items: center;
    justify-content: center;
    padding: 13px 0;
    line-height: 1.5;
    background: #fff;
    color: #999999;
}
.progressbar .item:first-child {
	border-radius: 7px 0 0 7px;
}
.progressbar .item:last-child {
	border-radius: 0 7px 7px 0;
}
.progressbar .item:not(:last-child)::before,
.progressbar .item:not(:last-child)::after {
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 100%;
    content: '';
    border: 37px solid transparent;
    border-left: 20px solid #fff;
    margin: auto;
}
.progressbar .item:not(:last-child)::before {
    margin-left: 1px;
    border-left-color: #c8077c;
}

@media screen and (max-width: 767px) {
	.progressbar .item {
		font-size: 1.1rem;
		line-height: 1.4;
		padding: 10px 0;
	}
	.progressbar .item:not(:last-child)::before,
	.progressbar .item:not(:last-child)::after {
		border-width: 25px;
		border-left-width: 12px;
	}
}

/* active */

.progressbar .item.active {
    z-index: 1;
    background: #c8077c;
    color: #FFF;
}
.progressbar .item.active:not(:last-child)::after {
    border-left-color: #c8077c;
}
.progressbar .item.active:not(:last-child)::before {
    border-left: none;
}

@media (min-width: 768px) {

.table dt{
	width: 12em;
	background: rgb(212, 102, 162);
	color: #fff;
	border: 1px solid #eee;
	padding: 10px;
	position: relative;
}
.table dt em{
	font-style: normal;
}
.table dt.required::after{
	content: "";
    width: 49px;
    height: 22px;
    background: url(/img/contact/required.png) no-repeat;
    position: absolute;
    right: 5px;
    top: 20px;
    display: block;
}
.table dd{
	width: calc(100% - 12em);
	background: #fff;
	border: 1px solid #eee;
	padding: 10px;
	margin-left: 3px;
}



}

@media (min-width: 850px) {


}

