/*
----------------------------------------

footer-01

----------------------------------------
*/

#footer-01 {
	background: var( --base-color );
	color: #fff;
}

#footer-01 .flex {
	align-items: center;
}

#footer-01 a {
	color: #fff;
}

#footer-01 .footer-wrap {
	padding: 16px 0;
	border-bottom: solid 1px rgba( 255, 255, 255, .2 );
}

#footer-01 .logo {
	line-height: .5;
	margin-right: auto;
}

#footer-01 .nav-wrap {
	justify-content: center;
	align-items: center;
	padding: 25px 0;
}

#footer-01 #sitemap a {
	display: inline-block;
	padding: 10px 20px;
	margin: 0 6px;
}

#footer-01 .nav-wrap .logo {
	display: none;
}

#footer-01 .copyright {
	background: #000;
	padding: 16px 20px;
}

#footer-01 .copyright .wrap {
	font-size: 1.4rem;
	text-align: center;
}


/* 1200 */

@media screen and ( max-width: 1200px ) {

	#footer-01 #sitemap a {
		padding: 10px 15px;
	}

}


/* 768 */

@media screen and ( max-width: 768px ) {

	#footer-01 .footer-wrap .logo {
		display: none;
	}

	#footer-01 > .wrap {
		padding: 0;
	}

	#footer-01 .footer-wrap {
		padding: 20px;
	}

	#footer-01 .phone-btn,
	#footer-01 .contact-btn {
		width: calc( ( 100% - 1rem ) / 2 );
	}

	#footer-01 .btn-set {
		width: 100%;
	}

	#footer-01 .phone-btn {
		margin-right: 1rem;
	}

	#footer-01 .phone-btn a {
		padding: 0;
		line-height: 1.4;
	}

	#footer-01 .phone-btn .num {
		font-size: 2.2rem;
	}

	#footer-01 .phone-btn .note {
		font-size: 1.1rem;
	}

	#footer-01 .contact-btn a {
		font-size: 1.6rem;
	}

	#footer-01 .nav-wrap {
		padding: 0;
	}

	#footer-01 #sitemap {
		width: 100%;
	}

	#footer-01 #sitemap .flex {
		flex-direction: column;
	}

	#footer-01 #sitemap li {
		width: 100%;
		border-bottom: solid 1px rgba( 255, 255, 255, .2 );
	}

	#footer-01 #sitemap li a {
		display: block;
		width: 100%;
		padding: 13.5px 45px 13.5px 20px;
		margin: 0;
		background: url( ../../img/common/svg/arrow-01-wh.svg ) right 20px center / 5px no-repeat;
		text-align: left;
		font-size: 1.6rem;
	}

	#footer-01 .nav-wrap .logo {
		display: block;
		width: 100%;
		text-align: center;
		padding: 29.5px 20px;
	}

	#footer-01 .copyright {
		padding: 13px 0 83px;
	}

	#footer-01 .copyright .wrap {
		font-size: 1.2rem;
	}

}

/* hover */

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

	#footer-01 .logo a:hover {
		opacity: .75;
	}

	#footer-01 #sitemap a:hover {
		opacity: .75;
	}

}
