::placeholder {
    color: #ccc;
}
#mv{
	background: url(../img/bg_mv.jpg) no-repeat;
	background-size: 100% auto;
	background-position: 50% 50%;
	overflow: hidden;
}
#mv .inside{
	height: 400px;
	position: relative;
}
#mv p{
	background-color: rgba(0, 0, 0, 0.7);
	color: #fff;
	font-size: 150%;
	font-weight: bold;
	left: 50%;
	letter-spacing: 2px;
	padding: 6px 40px 4px;
	position: absolute;
	text-align: center;
	text-shadow: 2px 2px 4px #333;
	top: 60%;
	transform: translate(-50%, -50%);
	width: 100%;
}
section{
	padding: 120px 0;
}
section .inside{
	overflow: hidden;
}
section:nth-of-type(even){
	background-color: #e7f1e0;
}
section.page1:nth-of-type(odd){
	background-color: #e7f1e0;
}
section.page1:nth-of-type(even){
	background-color: #fff;
}
section h2{
	border-bottom: 4px solid #ffc455;
	font-size: 150%;
	font-family: 'Kiwi Maru', serif;
	padding: 0 40px 10px 40px;
	text-align: center;
}
section .red{
	background-color: transparent;
	color: #f00;
	font-weight: bold;
}
section .box{
	margin-top: 60px;
}
section .box p{
	margin-top: 10px;
}
section .box p:first-child{
	margin-top: 0;
}
section .txt{
	margin-top: 20px;
	text-align: center;
}
section .txt:first-child{
    margin-top: 40px;
}

form,
#form{
    background-color: #e7f1e0;
    margin: 60px auto 0;
    padding-bottom: 50px;
    width: 90%;
}
#btns{
    text-align: center;
}
form .box,
#form .box{
    border-top: 1px solid #fff;
}
form .line,
#form .line{
    border-bottom: 1px solid #fff;
    display: grid;
    grid-template-columns: 250px 1fr;
    padding: 25px;
}
form .line p{
    position: relative;
}
form .line p.must::after{
    background-color: #dd9e93;
    color: #fff;
    content: "必須";
    padding: 2px 15px;
    position: absolute;
    top: 0;
    right: 0;
}
form .input-box{
    padding-left: 50px;
}
form .input-line:not(:first-child){
    margin-top: 10px;
}
form label{
    margin-right: 15px;
    vertical-align: middle;
}
form input{
    border-radius: 4px;
    box-sizing: border-box;
    padding: 5px 10px;
}
form #search{
    background-color: #888;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    margin: -2px 0 0 25px;
    padding: 2px 15px;
}
form #name,
form #kana,
form #email{
    width: 460px;
}
form #zip{
    width: 135px;
}
form #address{
    width: 100%;
}
form #telephone{
    width: 235px;
}
form textarea{
    border-radius: 4px;
    box-sizing: border-box;
    min-height: 275px;
    padding: 5px 10px;
    width: 100%;
}
form .input-box span{
    display: inline-block;
    margin-top: 10px;
}
form span.notice{
    display: inline-block;
}
form #error{
    color: #a00a0a;
}
form .btn-outer,
.back{
    text-align: center;
}
form .btn,
.back .btn{
    background-color: #ffc455;
    color: #fff;
    display: inline-block;
    margin-top: 30px;
    padding: 10px 100px;
    position: relative;
    text-decoration: none;
    transition: ease .2s;
}
form .btn::before,
.back .btn::before{
	background: #fff;
    border: 1px solid #ffc455;
	content: '';
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	transform: scale(0, 0);
	transform-origin: center;
	transition: transform .3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
	width: 100%;
	z-index: 5;
}
form .btn:hover::before,
.back .btn:hover::before{
	transform: scale(1, 1);
}
form .btn:hover span,
.back .btn:hover span{
	color: #ffc455;
	position: relative;
	z-index: 10;
}
form .error-php{
    color: #a00a0a;
    display: block !important;
    margin: 0 0 0 0 !important;
}
form .countSpan{
    margin: 0 !important;
}
.confirm{
    display: inline-block;
    margin-top: 0;
    padding: 0;
}
.confirm:first-child button{
    background-color: #ccc;
    color: #333;
}
.comp{
    border-bottom: 1px solid #fff;
    padding: 25px;
}
.comp h3{
    font-size: 150%;
    font-weight: bold;
    text-align: center;
}
.comp p{
    margin-top: 10px;
    text-align: center;
}
table{
	border: none;
	border-collapse: separate;
	border-spacing: 6px;
	margin: 60px auto 0;
	width: 80%;
}
table tr:last-child{
	border-bottom: none;
}
table th{
	background-color: #fff;
	border-left: none;
	box-shadow: 0 0 8px #c6d187;
	position: relative;
	text-align: left;
	width: 30%;
	text-align: center;
	padding: 20px 0;
}
table td{
	background-color: #fff;
	border-left: none;
	box-shadow: 0 0 8px #c6d187;
	text-align: left;
	width: 70%;
	padding: 10px 30px;
}
table tr{
	border-bottom: none;
	box-shadow: 0 0 8px #c6d187;
}
table tr:nth-of-type(even) th,
table tr:nth-of-type(even) td{
	background-color: #f6f6f6;
}
table span{
    background-color: #fff;
    display: inline-block;
    width: 100%;
    margin-top: 20px;
}
table span:first-child{
    margin-top: 0;
}

.staff-link{
	margin-top: 60px;
}
.staff-link ul{
	display: grid;
	grid-gap: 20px;
	grid-template-columns: repeat(2, 1fr);
}
.staff-link li img{
	opacity: .5;
}
.staff-link li p{
	color: #fff;
	font-size: 125%;
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	transform: translate(-50%,-50%);
	width: 90%;
}
.staff-link a{
	background-color: #000;
	border: 8px solid #fff;
	box-shadow: 4px 4px 4px #7f9271;
	color: #333;
	display: block;
	height: 200px;
	overflow: hidden;
	position: relative;
	text-decoration: none;
	margin: 4px;
	transition: all .3s ease;
}
.staff-link a:hover{
	opacity: .7;
}

@media screen and (max-width: 1024px){
    #mv{
		background-position: 50% 0;
		background-size: 100% auto;
	}
	#mv p{
		border: 0;
		font-size: 120%;
	}
	section{
		padding: 40px 0;
	}
	#mailform h2{
		margin: 0 auto;
		width: 90%;
	}
    #mailform .txt{
        margin: 10px auto;
        text-align: left;
		width: 90%;
    }
    section{
        padding: 40px 0;
    }
    form #name, form #kana, form #email{
        width: 100%;
    }
    .staff-link ul{
		grid-template-columns: 1fr;
		margin: 0 auto;
		width: 90%;
	}
}
@media screen and (max-width: 829px){
    #mv{
		background-size: auto 100%;
	}
	section h2{
		font-size: 150%;
	}
	section h2 span{
		display: block;
		margin-top: -10px;
	}
    #content .txt{
        text-align: left;
    }
    form .line, #form .line{
        display: block;
    }
    form .input-box{
        padding-left: 0;
    }
    form .line p.must::after{
        margin-left: 20px;
        position: relative;
    }
    form #name, form #kana, form #email{
        width: 100%;
    }
    form .error-php{
        margin: 10px 0 0 0 !important;
    }
    form .btn, .back .btn{
        padding: 20px 0;
        width: 100%;
    }
    .confirm-form{
        width: 100%;
    }
    .confirm{
        width: 100%;
    }
    form, #form{
        margin-top: 20px !important;
    }
    #form .box{
        margin-top: 0 !important;
    }
    table{
        width: 90%;
    }
}
@media screen and (max-width: 539px){
    section h2{
		font-size: 127%;
	}
	#mv .inside{
		height: 300px;
	}
    form .line, #form .line{
        padding: 15px 0;
    }
    form #zip{
        width: 40%;
    }
    form #search{
        font-size: 67%;
        padding: 15px 10px;
        margin-left: 10px;
        text-align: center;
        width: 40%;
    }
    form input, textarea{
        padding: 10px 10px;
    }
    form label{
        display: inline-block;
        padding-top: 9px;
    }
    form .btn, .back .btn{
        margin-top: 15px;
    }
    #form .box{
        padding: 10px;
    }
    .staff-link a{
		height: 130px;
	}
	.staff-link a p{
		font-size: 100%;
	}
}