@charset "UTF-8";
/**
 * レスポンシブ時に、PCのみに適用させる。
 * @include pc{}
 */
/**
 * レスポンシブ時に、SPのみに適用させる。
 * @include sp{}
 */
/**
 * リキッドレスポンシブ時に、要素のvwを返す。
 * @param {number} $size デザインデータ上の縦横値
 * @param {number} $viewport デザインデータの横幅
 */
@media only screen and (min-width: 769px) {
	.only--sp {
		display: none;
	}
}

@media only screen and (max-width: 768px) {
	.only--sp {
		display: block;
	}
}

@media only screen and (min-width: 769px) {
	.only--pc {
		display: block;
	}
}

@media only screen and (max-width: 768px) {
	.only--pc {
		display: none;
	}
}

@media only screen and (min-width: 769px) {
	#notfound #container {
		padding-bottom: 60px;
	}
}

@media only screen and (max-width: 768px) {
	#notfound #container {
		padding-bottom: 16vw;
	}
}

#notfound .nf__title {
	text-align: center;
	font-weight: bold;
	letter-spacing: 0.1em;
}

@media only screen and (min-width: 769px) {

}

@media only screen and (max-width: 768px) {
	#notfound .nf__title {
		width: auto;
		font-size: 4.8vw;
		letter-spacing: 0.26667vw;
		line-height: 1.5;
		padding-top: 15px;
		padding-bottom: 15px;
	}
}

#notfound .nf__desc {
	line-height: 1.8;
	text-align: center;
}

@media only screen and (min-width: 769px) {
	#notfound .nf__desc {
		font-size: 18px;
	}
}

@media only screen and (max-width: 768px) {
	#notfound .nf__desc {
		font-size: 3.6vw;
	}
}

#notfound .nf__search-area {
	max-width: 90%;
	margin-left: auto;
	margin-right: auto;
}

@media only screen and (min-width: 769px) {
	#notfound .nf__search-area {
		margin-top: 30px;
	}
}

@media only screen and (max-width: 768px) {
	#notfound .nf__search-area {
		margin-top: 8vw;
	}
}

#notfound .nf__search-area .i-search {
	background: none;
}
#notfound .nf__search-area .i-search form {
	display: flex;
	justify-content: center;
}

#notfound .nf__search-area form {
	text-align: center;
}

@media only screen and (max-width: 768px) {
	#notfound .nf__search-area form {
		display: flex;
		align-items: stretch;
	}
}

#notfound .nf__search-area .iSearchAssist {
	line-height: 1.7;
	background: url(../img/404/icn_search.png) no-repeat;
	background-position: center left 10px;
	background-size: 24px;
	border-radius: 0;
	border: 2px solid #ccc;
}
#notfound .nf__search-area .iSearchAssist::placeholder {
	color: #888;
}

@media only screen and (min-width: 769px) {
	#notfound .nf__search-area .iSearchAssist {
		width: 500px;
		font-size: 18px;
		padding: 3px 10px 3px 45px;
	}
}

@media only screen and (max-width: 768px) {
	#notfound .nf__search-area .iSearchAssist {
		width: 80%;
		font-size: 3.6vw;
		padding: 3vw 2vw 3vw 8.5vw;
		background-size: 4.8vw;
	}
}

#notfound .nf__search-area .i-search-button {
	height: 100%;
	line-height: 1.7;
	border: 2px solid #ccc;
	border-left: none;
}

@media only screen and (min-width: 769px) {
	#notfound .nf__search-area .i-search-button {
		font-size: 18px;
		padding: 4px;
	}
}
@media only screen and (max-width: 768px)  {
	#notfound .nf__search-area .i-search-button {
		padding: 2.7vw 0.53333vw !important;
	}
}

@media only screen and (min-width: 769px) {
	p {
		margin-bottom: 20px;
	}
}
@media only screen and (max-width: 768px) {
	p {
		margin-bottom: 4.2vw;
		margin-top: 3.6vw;
	}
}

@media only screen and (max-width: 768px) {
	/* ボタンだけに指定する場合は以下 */
	input[type="submit"]{
		-webkit-appearance: none;
	}

	#notfound .nf__search-area .i-search-button {
		width: 19% !important;
		font-size: 4.26667vw;
		padding: 0.53333vw;
		height: 100% !important;
	}
}

.btn {
	background: #0075c2;
	border: 1px solid #0075c2;
	color: #fff;
	padding: 15px 45px;
	display: inline-block;
	transition: 0.2s;
}
.btn:hover {
	background: #fff;
	color: #0075c2;
	text-decoration: none;
}
.btn__wrap {
	text-align: center;
	margin-top: 40px;
}
@media only screen and (max-width: 768px)  {
	.btn {
		font-size: 4.5vw;
		padding: 2.4vw 6.4vw;
	}
}
