@charset "UTF-8";


/* ▼1010px以下でヘッダー切り替え
---------------------------------------------------------------------- */
@media only screen and (max-width: 1010px) {

	nav {
		display: none;
	}

	.logo {
		width: 100%;
	}

}

/* ▼820px以下で切り替え
---------------------------------------------------------------------- */
@media only screen and (max-width: 820px) {

	.main_about {
		background: #f4f6f9;
		padding-top: 2rem;
		padding-bottom: 4rem;
		position: relative;
	}

	.about {
		width: 90%;
		position: static;
		top: auto;
		left: auto;
		margin: 0 auto;
	}


	.about img {
		width: 26%;
	}

	.about p {
		padding: 0.5rem 1rem;
	}

}

/* ▼640px以下の場合に適用
---------------------------------------------------------------------- */
@media only screen and (max-width: 640px) {

	body {
		font-size: 16px;
	}

	h3 {
		font-size: 1.6rem;
	}

	/* テーブル */
	.table01 {
		border-top: solid 1px #ccc;
	}

	.table01 th {
		display: block;
		width: 100%;
		padding: 1rem 1rem 0.5rem;
		border-bottom: none;
		font-weight: 500;
	}

	.table01 td {
		display: block;
		width: 100%;
		text-align: left;
		padding: 0 0.5rem 1rem 1rem;
		border-bottom: solid 1px #ccc;
	}

	/* アンカー */
	.anchor {
		display: block;
		margin-top: -5rem;
		padding-top: 5rem;
	}

	.btn_contact {
		display: none;
	}

	.header_cont {
		width: 100%;
	}

	h1 {
		padding: 0.2rem 1rem 0 2rem;
		font-size: 0.6rem;
		text-align: center;
	}

	.logo {
		padding: 0.3rem 1rem;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		width: 100%;
	}

	.logo img {
		max-width: 90px;
	}

	.logo span {
		padding-left: 0.5rem;
		font-size: 0.7rem;
	}

	.footerFloatingMenu {
		display: block;
		width: 100%;
		position: fixed;
		left: 0px;
		bottom: 0;
		z-index: 9998;
		text-align: center;
		padding: 0 auto;
		background: #fff;
	}

	/* メインビジュアル */
	.main {
		margin-top: 5rem;
	}

	.main_about {
		background: #f4f6f9;
		padding-top: 2rem;
		padding-bottom: 4rem;
		position: relative;
	}

	.about {
		display: block;
		padding-top: 8%;
	}


	.about img {
		display: block;
		width: 84%;
		margin: 0 auto;
	}

	.about p {
		padding: 2rem;
	}

	.company02 {
		display: block;
	}

	.company_info {
		width: 100%;
	}

	.company_info.left {
		border-right: none;
	}

	.address img {
		width: 36%;
	}

	.contact_tel p {
		font-size: 1.4rem;
	}

	.contact_tel p span {
		font-size: 0.9rem;
	}

	/* フッタ */
	footer {
		padding-bottom: 4rem;
	}

	.footer_ad {
		padding-top: 40px;
		display: block;
	}

	.footer_ad .footer_logo {
		width: 100%;
		font-size: 20px;
		text-align: center;
	}

	.footer_ad dl {
		width: 100%;
		font-size: 16px;
		line-height: 1.2rem;
		text-align: center;
	}

	.footer_ad dl dt {
		font-weight: 700;
		padding-top: 8px;
	}

	.footer_bn {
		display: block;
		padding-top: 40px;
	}

	.footer_bn li {
		width: 100%;
		padding: 2% 4%;
	}

	.footer_bn li a {
		transition: .3s;
	}

	.footer_bn li a:hover {
		opacity: .6;
	}

	.copyright {
		text-align: center;
		font-size: 11px;
		color: #50B886;
		padding: 40px 3%;
	}

	.footerFloatingMenu .inner {
		display: flex;
		align-items: center;
		width: 100%;
		padding: 3% 1%;
	}

	.footerFloatingMenu .inner li {
		padding: 0 2%;
		width: 100%;
	}

	.footerFloatingMenu .inner li a {
		display: block;
		height: 3rem;
		font-size: 14px;
		text-decoration: none;
		background: #69BBDE;
		color: #fff;
		line-height: 3rem;
	}

	.footerFloatingMenu .inner li a.footer_tel {
		background: #d58926;
	}

	.footerFloatingMenu .inner li a i {
		font-size: 22px;
		line-height: 1.5;
	}
}

/* ▼496px以下の場合に適用
---------------------------------------------------------------------- */
@media only screen and (max-width: 496px) {

	.pc {
		display: none;
	}

	.sp {
		display: block;
	}

	/* !Margin ------------------------------------------------------------------ */
	.mt10 {
		margin-top: 10px !important;
	}

	.mt20 {
		margin-top: 20px !important;
	}

	.mt40 {
		margin-top: 40px !important;
	}

	.mt60 {
		margin-top: 60px !important;
	}

	.mt80 {
		margin-top: 80px !important;
	}

	.mb60 {
		margin-bottom: 60px !important;
	}

	/* !Padding ------------------------------------------------------------------ */
	.pt10 {
		padding-top: 10px;
	}

	.pt20 {
		padding-top: 20px;
	}

	.pt40 {
		padding-top: 40px;
	}

	.pt60 {
		padding-top: 40px;
	}

	.pt80 {
		padding-top: 40px;
	}

	.pt120 {
		padding-top: 40px;
	}

	.pb60 {
		padding-bottom: 60px;
	}


	/* !Width ------------------------------------------------------------------- */
	.w60per {
		width: 100% !important;
	}

	.w80per {
		width: 100% !important;
	}

	/* ページトップ に戻る ----------------------------------------------------- */
	.pagetop {
		bottom: 48px;
		right: 8px;
	}

	.pagetop img {
		width: 36px;
	}

}