@charset "utf-8";

:root {
	--base-color: #1e1d1d;
	--base-inverted-color: #ffffff;
	--heading-black-color: var(--base-color);
	--primary-color: #3a3a3a;
	--secondary-color: #e7e7e7;
	--base-bg: #fcfcfc;
	--base-font-color: var(--base-color);
	--secondary-bg: var(--base-color);
	--chef-area-bg: var(--base-color);
	--btn-primary-color: #3a3a3a;
	--btn-swipe-color: #f4f2f0;
	--warning-color: #c9371c;
	--contact-area-text-color: #ffffff;
	--footer-background-color: #3a3a3a;
	--footer-foreground-color: #ffffff;
}


/**************************************************************
* フォームリセット
**************************************************************/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 1px solid #9c989f;
  -webkit-text-fill-color: #000000;
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
  box-shadow: 0 0 0px 1000px #ffffff inset;
  transition: background-color 5000s ease-in-out 0s;
}

input:-webkit-autofill:read-only,
textarea:-webkit-autofill:read-only,
select:-webkit-autofill:read-only,
input[type="text"]:not(#acceptance):read-only,
input[type="tel"]:not(#acceptance):read-only,
input[type="email"]:not(#acceptance):read-only,
textarea:not(.privacy-textarea):read-only {
  border-color: #9c989f;
  -webkit-text-fill-color: #000000;
  -webkit-box-shadow: 0 0 0px 1000px var(--secondary-color) inset;
  box-shadow: 0 0 0px 1000px var(--secondary-color) inset;
  transition: background-color 5000s ease-in-out 0s;
}

/* 必須ではない場合のPlaceholderの対応　*/
input[type="text"]:not(#acceptance):read-only:placeholder-shown,
input[type="tel"]:not(#acceptance):read-only:placeholder-shown,
input[type="email"]:not(#acceptance):read-only:placeholder-shown {
	-webkit-text-fill-color: var(--secondary-color);
}

/**
 * *************************************************************************************************************
 * TOPページ
 * *************************************************************************************************************
**/

/**
 * ************************************************************
 * mv
 * ************************************************************
*/

/**
 * ***************************
 * mv-list mv-bg
 * ***************************
*/
.mv-list .--01 .mv-bg {
  background-image: url(../img/top/mv/bg_01.jpg);
}
.mv-list .--02 .mv-bg {
  background-image: url(../img/top/mv/bg_02.jpg);
}
.mv-list .--03 .mv-bg {
  background-image: url(../img/top/mv/bg_03.jpg);
}
@media screen and (max-width:767px) { 
  .mv-list .mv-bg {
    padding-top: 177.866%;
  }
  .mv-list .--01 .mv-bg {
    background-image: url(../img/top/mv/bg_01_sp.jpg);
  }
  .mv-list .--02 .mv-bg {
    background-image: url(../img/top/mv/bg_02_sp.jpg);
  }
  .mv-list .--03 .mv-bg {
    background-image: url(../img/top/mv/bg_03_sp.jpg);
  }
}


/**
 * ***************************
 * info-list
 * ***************************
*/
.info-list .--mask .item__fig-bg {
	width: 12.1rem;
	background-image: url(../img/top/info-popup/mask.svg);
}
.info-list .--disinfection .item__fig-bg {
	width: 13.8rem;
	background-image: url(../img/top/info-popup/disinfection.svg);
}
.info-list .--temperature .item__fig-bg {
	width: 11.2rem;
	background-image: url(../img/top/info-popup/temperature.svg);
}
.info-list .--cleaning .item__fig-bg {
	width: 14.3rem;
	background-image: url(../img/top/info-popup/cleaning.svg);
}
.info-list .--acrylic .item__fig-bg {
	width: 12.7rem;
	background-image: url(../img/top/info-popup/acrylic.svg);
}
.info-list .--ventilation .item__fig-bg {
	width: 9.9rem;
	background-image: url(../img/top/info-popup/ventilation.svg);
}
.info-list .--alcohol .item__fig-bg {
	width: 10.9rem;
	background-image: url(../img/top/info-popup/alcohol.svg);
}
.info-list .--personal .item__fig-bg {
	width: 14.5rem;
	background-image: url(../img/top/info-popup/personal.svg);
}
.info-list .--time .item__fig-bg {
	width: 9.9rem;
	background-image: url(../img/top/info-popup/time.svg);
}
.info-list .--distance .item__fig-bg {
	width: 15.8rem;
	background-image: url(../img/top/info-popup/distance.svg);
}
@media screen and ( max-width:767px ) {
	.info-list .--mask .item__fig-bg {
		width: 6rem;
	}
	.info-list .--disinfection .item__fig-bg {
		width: 5.8rem;
	}
	.info-list .--temperature .item__fig-bg {
		width: 5.2rem;
	}
	.info-list .--cleaning .item__fig-bg {
		width: 5.7rem;
	}
	.info-list .--acrylic .item__fig-bg {
		width: 5.7rem;
	}
	.info-list .--ventilation .item__fig-bg {
		width: 5rem;
	}
	.info-list .--alcohol .item__fig-bg {
		width: 5.2rem;
	}
	.info-list .--personal .item__fig-bg {
		width: 6rem;
	}
	.info-list .--time .item__fig-bg {
		width: 6rem;
	}
	.info-list .--distance .item__fig-bg {
		width: 6.2rem;
	}
}


/**
 * ************************************************************
 * concept
 * ************************************************************
*/

/**
 * ***************************
 * concept-bg
 * ***************************
*/
.concept-bg::before {
  background-image: url(../img/top/concept/bg.jpg);
}


/**
 * ************************************************************
 * chef
 * ************************************************************
*/

/**
 * ***************************
 * chef-contents photo-bg
 * ***************************
*/
.chef-contents--01 .photo-bg {
  background-image: url(../img/top/chef/photo_chef_1.jpg);
}

.chef-contents--02 .photo-bg {
  background-image: url(../img/top/chef/photo_chef_2.jpg);
}


/**
 * ************************************************************
 * contact
 * ************************************************************
*/

/**
 * ***************************
 * contact-bg
 * ***************************
*/
.contact-bg::before {
  background-image: url(../img/top/contact/bg.jpg);
}

/**************************************************************
* 背景画像の指定
**************************************************************/

.free-btn-icn {
  background-image: url("../img/top/contact/tel_icn.svg");
}