/*
Theme Name: 
*/

html {
  font-size: calc(10 / 1280 * 100vw);
  /* 画面幅1280pxで10px*/

}


/* フォント定義（Webフォント読み込み） */
@font-face {
  font-family: 'TheImpressionist';
  src: url('fonts/theimpressionist-webfont.woff2') format('woff2'),
       url('fonts/theimpressionist-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}



/* :root でカスタムプロパティとしてフォント名を定義 */
:root {
  --main-font: 'TheImpressionist', serif;
  --base-font-size: 16px;
  --heading-font-size: 2rem;
  --sub-font: 'Noto Sans JP', sans-serif;
}


/* 
Regular 400
Medium 500
SemiBold 600
Bold 700
ExtraBold 800
*/
img {
  width: 100%;
  object-fit: cover;
}

.sp_only {
  display: none;
}

/* <!-- メインビジュアルここから --> */
.ar_main_img {
  height: 37rem;
  object-fit: cover;
}

/* <!-- メインビジュアルここまで --> */
@media screen and (max-width:699.98px) {
  html {
    font-size: calc(10 / 375 * 100vw);
    /* 画面幅375pxで10px*/
  }

  /* <!-- メインビジュアルここから --> */
  .ar_main_img {
    margin-top: 8rem;
    height: 15rem;
  }

  /* <!-- メインビジュアルここまで --> */
  .sp_only {
    display: block;
  }
}