@charset "UTF-8";
/*
*
*  /contact/css/index.css
*
*/
.navContact.current {
    color: #888;
}
.header {
    border-bottom: 1px solid #e5e5e5;
}
.contents {
    padding-top: 70px;
}
    .contactArea {
        width: 940px;
        margin: 0 auto;
        padding: 70px 0;
    }
    .contents .pageTit {
        font-size: 3.6rem;
        font-family: 'Marcellus', serif;
        text-align: center;
    }
    .contents .pageCont {
       margin-top: 65px;
    }
        .contents .pageCont .note {
                color: #ff0101;
                font-size: 1.2rem;
                text-align: right;
                width: 600px;
                margin: 0 auto;
            }
    	.contents .pageCont .mailForm {}
            .contents .pageCont .mailForm .formGroup {
                display: flex;
                flex-wrap: wrap;
                width: 600px;
                margin: 0 auto;
            }
                .contents .pageCont .mailForm .formTit {
                    flex-basis: 160px;
                    font-size: 1.4rem;
                    margin-bottom: 3.0rem;
                    position: relative;
                }
                    
                    .contents .pageCont .mailForm .formTit span {
                        display: block;
                        font-size: 1.0rem;
                        position: absolute;
                    }
                    .contents .pageCont .mailForm .formTit .required {
                        color: #ff0101;
                        position: relative;
                        margin-left: 2px;
                        top: -4px;
                        display: inline-block;
                    }
                .contents .pageCont .mailForm .formInput {
                    flex-basis: 440px;
                    margin-bottom: 3.0rem;
                }
                    .contents .pageCont .mailForm .formInput input[type="text"],
                    .contents .pageCont .mailForm .formInput input[type="email"],
                    .contents .pageCont .mailForm .formInput input[type="tel"],
                    .contents .pageCont .mailForm .formInput textarea {
                        width: 100%;
                        display: block;
                        border: 1px solid #e5e5e5;
                        box-sizing: border-box;
                    }
                    .contents .pageCont .mailForm .formInput input[type="text"],
                    .contents .pageCont .mailForm .formInput input[type="email"],
                    .contents .pageCont .mailForm .formInput input[type="tel"] {
                        height: 40px;
                    }
                    .contents .pageCont .mailForm .formInput .error_blank {
                        color: #ff0101;
                        font-size: 1.2rem;
                    }
            .contents .pageCont .mailForm .privacyText {
                font-size: 1.4rem;
                text-align: center;
                margin-top: 3.0rem;
            }
            .contents .pageCont .mailForm .privacyText a {
                text-decoration: underline;
            }
            .contents .pageCont .mailForm .privacyText a:hover {
               opacity: 0.5;
            }
                .contents .pageCont .mailForm .privacyText .spBr {
                    display: none;
                }
            
            .contents .pageCont .mailForm .button,
            .contents .pageCont .button {
                text-align: center;
                margin-top: 6.0rem;
            }
                .contents .pageCont .mailForm .button input[type="button"],
                .contents .pageCont .button .topBtn {
                    background-color: #000;
                    font-size: 1.6rem;
                    color: #FFF;
                    width: 220px;
                    border: none;
                    padding: 1.3rem 0;
                    border-radius: 3px;
                }
                .contents .pageCont .button .topBtn {
                    display: inline-block;
                }
            .contents .pageCont.thanks p {
                text-align: center;
                line-height: 2;
            }
            .contents .pageCont.thanks p br.sp {
                display: none;

            }
            .contents .pageCont.thanks strong {
                font-size: 2.8rem;
                display: block;
                margin-bottom: 3.0rem;
            }
            
.footer {
    border-top: 1px solid #e5e5e5;
}

span.loading {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border-top: 5px solid rgba( 255, 255, 255, 0.2 );
	border-right: 5px solid rgba( 255, 255, 255, 0.2 );
	border-bottom: 5px solid rgba( 255, 255, 255, 0.2 );
	border-left: 5px solid #ffffff;
	-webkit-transform: translateZ( 0 );
	-ms-transform: translateZ( 0 );
	transform: translateZ( 0 );
	-webkit-animation: load-circle 1.0s linear infinite;
	animation: load-circle 1.0s linear infinite;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -30px;
	margin-left: -30px;
}

@-webkit-keyframes load-circle {
	0% {
		-webkit-transform: rotate( 0deg );
		transform: rotate( 0deg );
	}
	100% {
		-webkit-transform: rotate( 360deg );
		transform: rotate( 360deg );
	}
}

@keyframes load-circle {
	0% {
		-webkit-transform: rotate( 0deg );
		transform: rotate( 0deg );
	}
	100% {
		-webkit-transform: rotate( 360deg );
		transform: rotate( 360deg );
	}
}

@media screen and (max-width: 768px) {
.header {}
.contents {
    padding: 0 0 1rem;
}
    .contactArea {
        width: 100%;
        margin: 0 auto;
        padding: 60px 30px 40px;
        box-sizing: border-box;
    }
    .contents .pageTit {
        font-size: 2.8rem;
        font-family: 'Marcellus', serif;
        text-align: center;
        margin-top: 3.0rem;
    }
    .contents .pageCont {
        margin-top: 20px;
    }
    	.contents .pageCont .mailForm {}
            .contents .pageCont .mailForm .formGroup {
                display: block;
                width: 100%;
            }
                .contents .pageCont .mailForm .formTit {
                    display: block;
                    margin-bottom: 1.0rem;
                    padding-bottom: 1.5rem;
                }
                    .contents .pageCont .mailForm .formTit sup {}
                    .contents .pageCont .mailForm .formTit .sub {
                        display: block;
                        font-size: 1.0rem;
                    }
                .contents .pageCont .mailForm .formInput {
                    display: block;
                    margin-bottom: 2.0rem;
                }
                    .contents .pageCont .mailForm .formInput input[type="text"],
                    .contents .pageCont .mailForm .formInput input[type="email"],
                    .contents .pageCont .mailForm .formInput input[type="tel"],
                    .contents .pageCont .mailForm .formInput textarea {
                    }
                    .contents .pageCont .mailForm .formInput input[type="text"],
                    .contents .pageCont .mailForm .formInput input[type="email"],
                    .contents .pageCont .mailForm .formInput input[type="tel"] {
                    }
            
            .contents .pageCont .mailForm .privacyText {
                font-size: 1.2rem;
                line-height: 2;
                margin-top: 3.3rem;
            }
                .contents .pageCont .mailForm .privacyText .spBr {
                    display: block;
                }
            
            .contents .pageCont .mailForm .button,
            .contents .pageCont .button {
                margin-top: 3.0rem;
            }
                .contents .pageCont .mailForm .button input[type="button"],
                .contents .pageCont .button .topBtn {
                    font-size: 1.5rem;
                    -webkit-appearance: none;
                    border-radius: 3px;
                }
            .contents .pageCont .note {
                margin-top: 3.7rem;
                width: 100%;
            }
            .contents .pageCont.thanks p {
                line-height: 1.7;
                font-size: 1.4rem;
            }
            .contents .pageCont.thanks p br.sp {
                display: block;
            }
            .contents .pageCont.thanks strong {
                font-size: 1.8rem;
                display: block;
                line-height: 1.7;
                margin-bottom: 1.0rem;
            }
.footer {
    border-top: none;
}
}