@charset "utf-8";

/**
 * ************************************************************
 * CSS変数（背景色や三角シェープの色）
 * ************************************************************
*/
:root {
	/* 色 */
	--base-color: #000000;
	--base-inverted-color: #ffffff; /* --global-parts-bgに合わせる */
	--primary-color: #00aeef;
	--secondary-color: #fff101;

	--base-font: var(--base-color);
	--base-inverted-font: var(--base-color); /* または --base-inverted-color */
	--news-txt-color: var(--secondary-color);
	--global-parts-font: var(--base-color);
	--global-parts-bg: #fdfdfc;
	--container-bg: #fdfdfc;
	--primary-divider-shape-bg: var(--primary-color);
	--secondary-divider-shape-bg: var(--secondary-color);
	--sns-icn-fill: var(--base-color);  /* または --base-inverted-color */
}

/**************************************************************
* フォームリセット
**************************************************************/
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 {
  font-weight: bold;
  border: 1px solid transparent;
  -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 {
  font-weight: bold;
  -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;
}


/* //MEMO
    特定の入力フォームのデザインを変更する場合は、以下のCSSを使用してフォームの入力部分をカスタマイズします。
.c-form-control__input,
.c-form-control__textarea {
  color: #000000 !important;
  background: #ffffff !important;
}
*/



/**
 * ************************************************************
 * 背景画像の指定
 * ************************************************************
*/

.free-btn-icn {
  background-image: url("../img/common/tel_icn.svg");
}

/**　common
************************************************************ */

/* footer */
.footer-logo__link {
	background-image: url(../img/common/footer_logo_bg.svg);
}

/**　concept
************************************************************ */
.concept {
  background-image: url(../img/concept/picto_1_bg.svg), url(../img/concept/picto_2_bg.svg);
}

.specialities-list > li:nth-child(1) .speciality-item::after {
  background-image: url(../img/concept/kodawari_1_bg.jpg);
}
.specialities-list > li:nth-child(2) .speciality-item::after {
  background-image: url(../img/concept/kodawari_2_bg.jpg);
}
.specialities-list > li:nth-child(3) .speciality-item::after {
  background-image: url(../img/concept/kodawari_3_bg.jpg);
}

@media screen and ( min-width: 768px ) {
  .specialities-list > li::after {
    background-image: url(../img/common/kirakira_bg.svg);
  }
}

/** menu
************************************************************ */
.menu {
  background-image: url(../img/common/vertical_picto_1_bg.svg), url(../img/common/vertical_picto_2_bg.svg);
}

/** freespace (フリースペース エリア)
************************************************************ */
.freespace__outer::before {
  background-image: url(../img/freespace/picto_1_bg.svg);
}
.freespace__outer > div::before {
  background-image: url(../img/freespace/picto_2_bg.svg);
}

@media screen and ( min-width: 1024px ) {
  .freeSpace-list .list__item[class*="--picto-kirakira"]::after {
    background-image: url(../img/common/kirakira_bg.svg);
  }

	.freespace-special-item[class*="--picto-kirakira"]::after {
    background-image: url(../img/common/kirakira_bg.svg);
  }
}

/** news
************************************************************ */
.news {
  background-image: url(../img/common/vertical_picto_1_bg.svg), url(../img/common/vertical_picto_2_bg.svg);
}

/** access
************************************************************ */
.access {
  background-image: url(../img/common/vertical_picto_1_bg.svg), url(../img/common/vertical_picto_2_bg.svg);
}

.access-contents__block-2::after {
  background-image: url(../img/access/access_bg.jpg);
}