@charset "UTF-8";

.flex-type {
	display: flex;
	justify-content: space-between;
}

.flex-type div {
	width: 48%;
}

.flex-type h2 {
	font-size: 24px;
	font-weight: bold;
}

.flex-type h2 span {
	font-size: 36px;
}

.flex-type .personal h2 span {
	color: #FB803C;
}

.flex-type .business h2 span {
	color: #5f718e;
}

.flex-type .inner {
	width: 100%;
	background: #f1f3f5;
	padding: 35px 30px;
}

.flex-type .personal .inner {
	border-top: 2px solid #FB803C;
}

.flex-type .business .inner {
	border-top: 2px solid #5f718e;
}

.flex-type h3 {
	font-size: 20px;
	text-align: center;
}


.flex-type .btn-wrap {
	display: flex;
	justify-content: space-between;
	padding: 0;
	margin: 40px 0 0 0;
	list-style-type: none;
	align-items: center;
}

.flex-type .btn-wrap li {
	width: 245px;
}

.flex-type .btn-wrap .map,
.flex-type .btn-wrap .btn {
	height: 60px;
}

.flex-type .btn-wrap .map a,
.flex-type .btn-wrap .btn a {
	font-size: 18px;
	font-weight: bold;
	display: block;
	width: 100%;
	height: 100%;
}

.flex-type .personal .btn-wrap .btn a {
	background: #FB803C;
	color: #fff;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all .3s;
	box-shadow: 0 5px 0 #9d4002;
}

.flex-type .business .btn-wrap .btn a {
	background: #5f718e;
	color: #fff;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all .3s;
	box-shadow: 0 5px 0 #495363;
}

.flex-type .business .btn-wrap .map a {
	background: #fff;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all .3s;
	box-shadow: 0 5px 0 #ddd;
	border: 1px solid #ddd;
}

.flex-type .personal .btn-wrap .btn a:hover {
	opacity: 0.6;
	text-decoration: none !important;
}

.flex-type .business .btn-wrap .btn a:hover {
	opacity: 0.6;
	text-decoration: none !important;
}

.flex-type .business .btn-wrap .map a:hover {
	opacity: 0.6;
	text-decoration: none !important;
}

.flex-type .personal .btn-wrap .btn a:before,
.flex-type .business .btn-wrap .btn a:before {
	content: '';
	background: url("/inquiry/image/ico_document.png") 0 0 no-repeat;
	background-size: 26px;
	width: 26px;
	height: 30px;
	margin: 0 20px 0 0;
}

.flex-type .business .btn-wrap .map a:before {
	content: '';
	background: url("/inquiry/image/ico_map.png") 0 0 no-repeat;
	background-size: 20px;
	width: 20px;
	height: 26px;
	margin: 0 10px 0 0;
}

.flex-type .inner div {
	width: 100%;
	height: 121px;
	margin: 35px 0 0 0;
}

.flex-type .inner .other-link {}

.flex-type .inner .other-link p,
.flex-type .inner .bg-link p {
	font-size: 24px;
	font-weight: bold;
}

.flex-type .inner .other-link p span {
	display: block;
	font-size: 18px;
	font-weight: 400;
	color: #333;
}

.flex-type .personal .inner .other-link p {
	color: #FB803C;
}

.flex-type .business .inner .other-link p {
	color: #5f718e;
}

.flex-type .personal .inner .other-link a,
.flex-type .business .inner .other-link a {
	background: url("/inquiry/image/ico_link_arrow.png") right 20px center no-repeat #fff;
}

.flex-type .inner .other-link a {
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all .3s;
	border-radius: 10px;
	width: 100%;
	height: 100%;
	border: 1px solid #ccc;
	box-shadow: 0 5px 0 #ccc;
	transition: all .3s;
}

.flex-type .inner .other-link a:hover {
	opacity: 0.6;
	text-decoration: none !important;
}

.flex-type .personal .inner .bg-link a {
	background: url("/inquiry/image/ico_link_arrow_white.png") right 20px center no-repeat #FB803C;
	box-shadow: 0 5px 0 #9d4002;
	border: 1px solid #9d4002;
}

.flex-type .business .inner .bg-link a {
	background: url("/inquiry/image/ico_link_arrow_white.png") right 20px center no-repeat #5f718e;
	box-shadow: 0 5px 0 #495363;
	border: 1px solid #495363;
}

.flex-type .inner .bg-link a {
	color: #fff;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all .3s;
	border-radius: 10px;
	width: 100%;
	height: 100%;
}

.flex-type .inner .bg-link a:hover {
	text-decoration: none;
	opacity: 0.6;
}

.flex-type .inner .contact {
    background: #fff;
    border-radius: 10px;
}

.flex-type .inner .contact p {
    display: block;
}

.flex-type .inner .contact p {
    text-align: center;
    font-size: 18px;
    font-weight: bold;
}

.flex-type .business .inner .contact {
	box-shadow: 0 5px 0 #5f718e;
	border: 2px solid #5f718e;
}

.flex-type .business .inner .contact .email {
	color: #5f718e;
	font-size: 30px;
	margin: -20px 0 0 0;
}

.flex-type .business .inner .contact .email a {
	color: #5f718e;
}

.flex-type .business .inner .contact .email:before {
	content: '';
	background: url("/inquiry/image/ico_corp_email.png")0 0 no-repeat;
	display: inline-block;
	background-size: 36px;
	width: 36px;
	height: 25px;
	margin: 0 10px 0 0;
}

.caution {
	list-style-type: none;
	padding: 0;
	margin: 30px 0 0 0;
}

.caution li {
	padding: 0 0 0 1em;
	text-indent: -1em;
}

.total-contact {
	background: #d8e2ed;
	padding: 100px 0;
}

.total-contact .opinion {
	background: #fff;
	border-radius: 20px;
	padding: 65px 50px;
}

.total-contact h2 {
	font-size: 24px;
	font-weight: bold;
	color: #1d50a2;
	text-align: center;
}

.total-contact p {
	text-align: center;
	font-size: 16px;
}

.total-contact .contact-wrap {
	display: flex;
	justify-content: space-between;
}

.total-contact .contact-wrap div {
	border: 1px solid #1d50a2;
	width: 48%;
	padding: 20px 0;
}

.total-contact .contact-wrap div p {
	font-size: 16px;
	font-weight: bold;
	color: #1d50a2;
	margin: 0;
}

.total-contact .contact-wrap .tel,
.total-contact .contact-wrap .email {
	font-size: 30px;
	color: #1d50a2;
}

.total-contact .contact-wrap .tel:before {
	content: '';
	background: url("/inquiry/image/ico_free_dial.png")0 0 no-repeat;
	display: inline-block;
	background-size: 36px;
	width: 36px;
	height: 25px;
	margin: 0 10px 0 0;
}

.total-contact .contact-wrap .email:before {
	content: '';
	background: url("/inquiry/image/ico_email.png")0 0 no-repeat;
	display: inline-block;
	background-size: 36px;
	width: 36px;
	height: 25px;
	margin: 0 10px 0 0;
}

.total-contact .contact-wrap .email a {
	color: #1d50a2;
}

.total-contact .customer {
	background: #fff;
	border-radius: 20px;
	padding: 65px 50px;
	margin: 65px 0 0 0;
}

.total-contact .gardcenter {
	width: 70%;
	height: 60px;
	border: 1px solid #1d50a2;
	margin: 10px auto 0 auto;
}

.total-contact .gardcenter p {
	display: flex;
	align-items: center;
	font-size: 18px;
	font-weight: bold;
	justify-content: center;
}

.total-contact .gardcenter p:before {
	content: '';
	background: url("/inquiry/image/ico_document_blue.png")0 0 no-repeat;
	display: inline-block;
	background-size: 25px;
	width: 25px;
	height: 30px;
	margin: 0 10px 0 0;
}

.total-contact .gardcenter p a {
	color: #1d50a2;
}


.total-contact .contact {
	width: 70%;
	height: 114px;
	border: 1px solid #1d50a2;
	margin: 10px auto 0 auto;
}

.total-contact .contact p {
	display: flex;
	align-items: center;
	font-size: 18px;
	font-weight: bold;
	justify-content: center;
}


.total-contact .contact .tel {
	color: #1d50a2;
	font-size: 30px;
	margin: -10px 0 0 0;
}

.total-contact .contact .tel:before {
	content: '';
	background: url("/inquiry/image/ico_free_dial.png")0 0 no-repeat;
	display: inline-block;
	background-size: 36px;
	width: 36px;
	height: 25px;
	margin: 0 10px 0 0;
}

.total-contact .contact p {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
}

.total-contact .contact p {
	display: block;
}


@media(max-width: 640px) {
	.flex-type {
		display: block;
	}

	.flex-type div {
		width: 100%;
	}

	.flex-type .inner {
		padding: 15px;
	}

	.flex-type .personal .inner {
		border-top: 1px solid #FB803C;
	}

	.flex-type .business .inner {
		border-top: 1px solid #5f718e;
	}


	.flex-type .btn-wrap {
		display: block;
		margin: 30px 0 0 0;
	}

	.flex-type .btn-wrap li {
		width: 100%;
		text-align: center;
		margin: 20px 0 0 0;
	}

	.flex-type .btn-wrap li img {
		width: 100%;
	}


	.flex-type .inner .other-link p,
	.flex-type .inner .bg-link p {
		font-size: 20px;
		font-weight: bold;
	}

	.flex-type .inner .other-link p span {
		display: block;
		font-size: 18px;
		font-weight: 400;
		color: #333;
	}



	.flex-type .personal .inner .contact .tel {
		font-size: 26px;
	}


	.flex-type .business .inner .contact .email {
		color: #5f718e;
		font-size: 18px;
		margin: 0;
	}

	.flex-type .business .inner .contact .email a {
		color: #5f718e;
	}

	.flex-type .business .inner .contact .email:before {
		background-size: 25px;
		width: 25px;
		height: 17px;
	}

	.total-contact {
		padding: 50px 0;
	}

	.total-contact h2 {
		font-size: 20px;
	}

	.total-contact .opinion {
		padding: 20px;
	}

	.total-contact .contact-wrap {
		display: block;
	}

	.total-contact .contact-wrap div {
		width: 100%;
		padding: 10px;
		margin: 20px 0 0 0;
	}

	.total-contact .contact-wrap .tel,
	.total-contact .contact-wrap .email {
		font-size: 26px;
	}

	.total-contact .contact-wrap .email {
		font-size: 18px;
	}

	.total-contact .contact-wrap .email:before {
		background-size: 25px;
		width: 25px;
		height: 17px;
	}

	.total-contact .customer {
		padding: 20px;
		margin: 30px 0 0 0;
	}

	.total-contact .gardcenter {
		width: 100%;
		height: auto;
		border: 1px solid #1d50a2;
		margin: 10px auto 0 auto;
		padding: 10px;
	}

	.total-contact .gardcenter p {
		display: block;
		font-size: 18px;

	}

	.total-contact .gardcenter p:before {
		content: '';
		background: url("/inquiry/image/ico_document_blue.png")0 0 no-repeat;
		display: block;
		background-size: 25px;
		width: 25px;
		height: 30px;
		margin: 0 auto 10px auto;
	}

	.total-contact .gardcenter p a {
		color: #1d50a2;
	}
	.total-contact .contact {
		width: 100%;
		height: auto;
		border: 1px solid #1d50a2;
		margin: 10px auto 0 auto;
		padding: 10px;
	}

	.total-contact .contact p {
		display: block;
		font-size: 18px;

	}

}