@charset "UTF-8";
/* ============================================================
*
* BASE
*
* ============================================================ */
/* ------------------------------------------------------------
* 基本設定
* ------------------------------------------------------------ */

:root {
  --color-font: #333333;
  --color-font-sub: #6d5c48;
  --color-accent: #F98700;
  --color-primary: #9D7B58;
  --color-white: #fff;
  --color-black: #000;
  --color-bg: #ECF6F0;
  --color-gray: #C9C9C9;
}


html {
  line-height: 1.7;
  font-size: 62.5%;
  scroll-behavior: smooth;
}

body {
  font-family: "Zen Old Mincho", serif;
  font-size: 1.6rem;
  color: var(--color-font);
  background: #fff;
  position: relative;
}

/* ----- リンクの設定 ----- */
a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
a:active, a:visited {
  color: inherit;
  text-decoration: underline;
}
a:hover {
  color: inherit;
  text-decoration: none;
}

/* ----- ボタンの設定 ----- */
button {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* ----- 画像 ----- */
img {
  max-width: 100%;
  vertical-align: bottom;
}

.pos_rel{
  position: relative;
}

/* 改行
* -------------------------------------------------- */
.brp {
  display: block;
}

.brs {
  display: none;
}

.js_fadein {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(.4,0,.2,1), transform 0.8s cubic-bezier(.4,0,.2,1);
}

/* ============================================================
*
* レイアウト
*
* ============================================================ */
/* ------------------------------------------------------------
* ヘッダー
* ------------------------------------------------------------ */
.ly_header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;

  -webkit-transition: margin-top 0.3s ease;
  transition: margin-top 0.3s ease;
}

.ly_header_cont {
  padding: 6px 10px;
  margin: 10px;
  background-color:rgba(255,255,255);
}

/* ------------------------------------------------------------
* フッター
* ------------------------------------------------------------ */
.ly_footer {
  padding-top: 60px;
  padding-bottom: 60px;
  font-size: 0.875rem;
  background-color: var(--color-primary);
  color: var(--color-white);
}

.ly_footer_copy {
  display: block;
  padding: 20px 0 0;
  font-size: 1.6rem;
  text-align: right;
}
/* ------------------------------------------------------------
* ラッパー
* ------------------------------------------------------------ */
.ly_wrap {
  padding-top: 60px;
  padding-bottom: 60px;
}

.ly_wrap__bgColor {
  background-color: var(--color-bg);
}

.ly_wrap__bgImg {
  background-image: url(../images/home/cta_bg.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
/* ------------------------------------------------------------
* コンテンツエリア
* ------------------------------------------------------------ */
.ly_cont {
  max-width: 760px;
  padding-right: 20px;
  padding-left: 20px;
  margin-right: auto;
  margin-left: auto;
}

.ly_contXl {
  max-width: 760px;
  padding-right: 20px;
  padding-left: 20px;
  margin-right: auto;
  margin-left: auto;
}

.ly_contMd {
  max-width: 760px;
  padding-right: 20px;
  padding-left: 20px;
  margin-right: auto;
  margin-left: auto;
}

/* ============================================================
*
* モジュール
*
* ============================================================ */
/* ------------------------------------------------------------
* ボタン
* ------------------------------------------------------------ */
/* ボタン */
.el_btn {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  min-width: 335px;
  max-width: 100%;
  padding: 0.969rem 1.25rem;
  font-size: 1.125rem;
  font-weight: bold;
  line-height: 1.5;
  color: #fff;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  background-color: #E94218;
  border: 1px solid #E94218;
  border-radius: 2em;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.el_btn:visited {
  color: #fff;
}
.el_btn:active, .el_btn:hover {
  color: #E94218;
  background-color: #fff;
}


/* ナビゲーションの問い合わせボタン */
.el_btn_navContact {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  min-width: 230px;
  max-width: 100%;
  padding: 0.8rem 1rem;
  margin-left: 10px;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1.5;
  color: #fff;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  background-color: #000;
  border: 1px solid #000;
  border-radius: 2em;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.el_btn_navContact:visited {
  color: #fff;
}
.el_btn_navContact:active, .el_btn_navContact:hover {
  color: #000;
  background-color: #fff;
}


/* ------------------------------------------------------------
* 見出し
* ------------------------------------------------------------ */
.el_lgHeading {
  text-align: center;
  font-size: 24px;
  color: var(--color-primary);
  margin-bottom: 10px;
  font-weight: bold;
}

.el_mdHeading {
  font-size: 2.1rem;
  font-weight: bold;
}

.el_smHeading {
  margin-bottom: 1em;
  font-size: 18px;
  font-weight: bold;
}

.el_heading_txt {
  margin-top: 20px;
  font-size: 0.875rem;
  font-weight: normal;
  line-height: 2;
  text-align: center;
}
/* ------------------------------------------------------------
* ヘッダーのコンテンツ
* ------------------------------------------------------------ */
.bl_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 100%;
}

/* タイトル
* -------------------------------------------------- */
.bl_headerTitle {
  max-width: calc(100% - 90px);
}

.bl_headerTitle_inner {
  display: block;
  max-width: 300px;
  color: #000;
  text-decoration: none;
}
.bl_headerTitle_inner:visited {
  color: #000;
  text-decoration: none;
}
.bl_headerTitle_inner:active, .bl_headerTitle_inner:hover {
  color: #000;
  text-decoration: none;
}
.bl_headerTitle_inner img {
  display: block;
  width: 100%;
  height: auto;
}
.bl_headerTitle_inner span {
  display: block;
  margin-top: 6px;
  font-size: 10px;
  line-height: 1;
}
/* ----- ナビゲーション ----- */
.bl_headerNav {
  display: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.6rem;
  white-space: nowrap;
}

.bl_headerNavList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  list-style: none;
}

.bl_headerNavItem {
  position: relative;
  margin: 1em;
  font-style: normal;
  font-weight: 700;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  text-orientation: upright;
  align-items: center;
  height: 180px;
  gap: 16px;
  display: flex;
  font-size: 1.6rem;


}
.bl_headerNavItem span {
  padding: 6px;
  background-color: #fff;
  display: inline-block;
  margin-top: 10px;
}

.bl_headerNavItem span:hover {
  color: var(--color-primary);
  margin-top: 0;
  transition: margin-top 0.2s;
}

.bl_headerNavItem_link {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  padding: 0.5em;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.5;
  color: #000;
  text-decoration: none;
}
.bl_headerNavItem_link:active, .bl_headerNavItem_link:visited {
  color: #000;
  text-decoration: none;
}
.bl_headerNavItem_link:hover {
  color: #000;
}
.bl_headerNavItem_link:active::after, .bl_headerNavItem_link:hover::after {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}

.bl_headerSide {
  margin-top: 8px;
}

.bl_headerItem {
  margin-right: 20px;
  text-decoration: none;
}
.bl_headerItem::before {
  display: inline-block;
  width: 50px;
  height: 50px;
  padding: 2px;
  font-family: fontello;
  font-size: 30px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  content: "\e807";
  background-color: #000;
  border: #000 1px solid;
  border-radius: 50px;
}

.bl_headerItem:hover {
  text-decoration: none;
}
.bl_headerItem:hover::before {
  color: #000;
  background-color: #fff;
  border: #000 1px solid;
}

.bl_headerHumOpnBtn::before {
  font-family: fontello;
  font-size: 50px;
  content: "\e805";
}

button:hover .bl_headerHumOpnBtn::before {
  font-family: fontello;
  content: "\e80a";
}

.bl_headerHum {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 30px;
  height: 25px;
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: none;
}
.bl_headerHum span {
  display: block;
  width: 100%;
  height: 3px;
  background-color: #333;
  border-radius: 3px;
  -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: transform 0.3s ease, opacity 0.3s ease;
  transition: transform 0.3s ease, opacity 0.3s ease, -webkit-transform 0.3s ease;
}
.bl_headerHum_txt{
  font-size: 1.2rem;

}

/* メニューが開かれている状態での変化 */
.bl_headerHum.active span:nth-child(1) {
  -webkit-transform: translateY(11px) rotate(45deg);
          transform: translateY(11px) rotate(45deg);
}

.bl_headerHum.active span:nth-child(2) {
  opacity: 0;
}

.bl_headerHum.active span:nth-child(3) {
  -webkit-transform: translateY(-11px) rotate(-45deg);
          transform: translateY(-11px) rotate(-45deg);
}

/* ----- ハンバーガーメニュー ----- */
.js_menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9998; /* 他のコンテンツの上に表示 */
  display: none; /* 初期状態では非表示 */
  width: 100%;
  height: 100%;
  background-color: #fff;
  -webkit-animation: fadeIn 0.5s ease;
          animation: fadeIn 0.5s ease;
}

/* メニューを表示するときのスタイル */
.js_menu.is-open {
  display: block;
  overflow: hidden;
}

/* メニュー表示中にボディのスクロールを無効にするスタイル */
body.no-scroll {
  overflow: hidden;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-10px);
            transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-10px);
            transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}
.bl_menu_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 20px 10px;
}

.bl_headerCloseBtn::before {
  font-family: fontello;
  font-size: 50px;
  content: "\e804";
}

.bl_menu_cont {
  padding: 60px;
}

.bl_menuList {
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  text-align: center;
  list-style: none;
}

.bl_menuList_item{
  & img{
    max-height: 200px;
  }
}

.bl_menuItem {
  width: 100%;
  margin-bottom: 40px;
  font-size: 1.6rem;
}
.bl_menuItem a {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  padding: 10px 20px;
  text-decoration: none;
  border-bottom: 1px solid #fff;
}
.bl_menuItem a:hover {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-bottom: 1px solid #8D8D8D;
}

/* ------------------------------------------------------------
* フッターのコンテンツ
* ------------------------------------------------------------ */
.bl_footer{
  color: var(--color-white);
  & address{
    font-size: 1.4rem;
    margin-top: 10px;
    font-style: normal;
  }
}
.bl_footer_section{
  font-size: 2.0rem;
  position: relative;
  &:before{
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 600px;
    height: 1px;
    background-color: var(--color-white);
    margin-left: -500px;

  }
}
.bl_footer_ttl{
  margin-top: 20px;
  font-size: 1.4rem;
  & span{
    font-size: 2rem;
    margin-right: 10px;
  }
}
/* ------------------------------------------------------------
* グリッド
* ------------------------------------------------------------ */
.bl_grid {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}
.bl_grid.bl_gridd__jc_center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.bl_grid.bl_gridd__jc_between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.bl_grid.bl_gridd__jc_around {
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
.bl_grid.bl_gridd__ai_center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

[class*=bl_col] {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

.bl_col_1 {
  width: 8.33%;
}

.bl_col_2 {
  width: 16.66%;
}

.bl_col_3 {
  width: 25%;
}

.bl_col_4 {
  width: 33.33%;
}

.bl_col_5 {
  width: 41.66%;
}

.bl_col_6 {
  width: 50%;
}

.bl_col_7 {
  width: 58.33%;
}

.bl_col_8 {
  width: 66.66%;
}

.bl_col_9 {
  width: 75%;
}

.bl_col_10 {
  width: 83.33%;
}

.bl_col_11 {
  width: 91.66%;
}

.bl_col_12 {
  width: 100%;
}
/* ============================================================
*
* ヘルパー
*
* ============================================================ */
/* ------------------------------------------------------------
* フォントとテキストのスタイル
* ------------------------------------------------------------ */
/* 太字 */
.hp_font_bold {
  font-weight: bold !important;
}

/* 文字揃え */
.hp_txt_left {
  text-align: left !important;
}

.hp_txt_right {
  text-align: right !important;
}

.hp_txt_center {
  text-align: center !important;
}

.hp_txt_justify {
  text-align: justify !important;
  text-justify: inter-ideograph !important;
}

/* 文字間を戻す */
.hp_letter_0 {
  letter-spacing: 0 !important;
}

/* 文字色 */
.hp_color_yellow {
  color: #FFF617 !important;
}

.hp_color_red {
  color: #E94218 !important;
}

.hp_brp {
  display: block;
}

.hp_brs {
  display: none;
}
/* 強調 */
.hp_txt_em {
  font-style: normal !important;
  font-weight: bold !important;
}

/* 重要 */
.hp_txt_strong {
  font-weight: bold !important;
  color: #E94218 !important;
}

/* 上付き文字 */
.hp_txt_sup {
  color: #6D6D6D;
}

/* 小文字 */
.hp_txt_small {
  font-size: 0.8em !important;
}

/* ------------------------------------------------------------
* パディングとマージン
* ------------------------------------------------------------ */
.hp_pt_0 {
  padding-top: 0 !important;
}

.hp_mt_0 {
  margin-top: 0 !important;
}

.hp_MT_0 {
  margin-top: 0 !important;
}

.hp_pt_xxs {
  padding-top: 5px !important;
}

.hp_mt_xxs {
  margin-top: 5px !important;
}

.hp_MT_xxs {
  margin-top: -5px !important;
}

.hp_pt_xs {
  padding-top: 10px !important;
}

.hp_mt_xs {
  margin-top: 10px !important;
}

.hp_MT_xs {
  margin-top: -10px !important;
}

.hp_pt_sm {
  padding-top: 20px !important;
}

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

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

.hp_pt_md {
  padding-top: 40px !important;
}

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

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

.hp_pt_lg {
  padding-top: 60px !important;
}

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

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

.hp_pt_xl {
  padding-top: 80px !important;
}

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

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

.hp_pt_xxl {
  padding-top: 100px !important;
}

.hp_mt_xxl {
  margin-top: 100px !important;
}

.hp_MT_xxl {
  margin-top: -100px !important;
}

.hp_pr_0 {
  padding-right: 0 !important;
}

.hp_mr_0 {
  margin-right: 0 !important;
}

.hp_MR_0 {
  margin-right: 0 !important;
}

.hp_pr_xxs {
  padding-right: 5px !important;
}

.hp_mr_xxs {
  margin-right: 5px !important;
}

.hp_MR_xxs {
  margin-right: -5px !important;
}

.hp_pr_xs {
  padding-right: 10px !important;
}

.hp_mr_xs {
  margin-right: 10px !important;
}

.hp_MR_xs {
  margin-right: -10px !important;
}

.hp_pr_sm {
  padding-right: 20px !important;
}

.hp_mr_sm {
  margin-right: 20px !important;
}

.hp_MR_sm {
  margin-right: -20px !important;
}

.hp_pr_md {
  padding-right: 40px !important;
}

.hp_mr_md {
  margin-right: 40px !important;
}

.hp_MR_md {
  margin-right: -40px !important;
}

.hp_pr_lg {
  padding-right: 60px !important;
}

.hp_mr_lg {
  margin-right: 60px !important;
}

.hp_MR_lg {
  margin-right: -60px !important;
}

.hp_pr_xl {
  padding-right: 80px !important;
}

.hp_mr_xl {
  margin-right: 80px !important;
}

.hp_MR_xl {
  margin-right: -80px !important;
}

.hp_pr_xxl {
  padding-right: 100px !important;
}

.hp_mr_xxl {
  margin-right: 100px !important;
}

.hp_MR_xxl {
  margin-right: -100px !important;
}

.hp_pb_0 {
  padding-bottom: 0 !important;
}

.hp_mb_0 {
  margin-bottom: 0 !important;
}

.hp_MB_0 {
  margin-bottom: 0 !important;
}

.hp_pb_xxs {
  padding-bottom: 5px !important;
}

.hp_mb_xxs {
  margin-bottom: 5px !important;
}

.hp_MB_xxs {
  margin-bottom: -5px !important;
}

.hp_pb_xs {
  padding-bottom: 10px !important;
}

.hp_mb_xs {
  margin-bottom: 10px !important;
}

.hp_MB_xs {
  margin-bottom: -10px !important;
}

.hp_pb_sm {
  padding-bottom: 20px !important;
}

.hp_mb_sm {
  margin-bottom: 20px !important;
}

.hp_MB_sm {
  margin-bottom: -20px !important;
}

.hp_pb_md {
  padding-bottom: 40px !important;
}

.hp_mb_md {
  margin-bottom: 40px !important;
}

.hp_MB_md {
  margin-bottom: -40px !important;
}

.hp_pb_lg {
  padding-bottom: 60px !important;
}

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

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

.hp_pb_xl {
  padding-bottom: 80px !important;
}

.hp_mb_xl {
  margin-bottom: 80px !important;
}

.hp_MB_xl {
  margin-bottom: -80px !important;
}

.hp_pb_xxl {
  padding-bottom: 100px !important;
}

.hp_mb_xxl {
  margin-bottom: 100px !important;
}

.hp_MB_xxl {
  margin-bottom: -100px !important;
}

.hp_pl_0 {
  padding-left: 0 !important;
}

.hp_ml_0 {
  margin-left: 0 !important;
}

.hp_ML_0 {
  margin-left: 0 !important;
}

.hp_pl_xxs {
  padding-left: 5px !important;
}

.hp_ml_xxs {
  margin-left: 5px !important;
}

.hp_ML_xxs {
  margin-left: -5px !important;
}

.hp_pl_xs {
  padding-left: 10px !important;
}

.hp_ml_xs {
  margin-left: 10px !important;
}

.hp_ML_xs {
  margin-left: -10px !important;
}

.hp_pl_sm {
  padding-left: 20px !important;
}

.hp_ml_sm {
  margin-left: 20px !important;
}

.hp_ML_sm {
  margin-left: -20px !important;
}

.hp_pl_md {
  padding-left: 40px !important;
}

.hp_ml_md {
  margin-left: 40px !important;
}

.hp_ML_md {
  margin-left: -40px !important;
}

.hp_pl_lg {
  padding-left: 60px !important;
}

.hp_ml_lg {
  margin-left: 60px !important;
}

.hp_ML_lg {
  margin-left: -60px !important;
}

.hp_pl_xl {
  padding-left: 80px !important;
}

.hp_ml_xl {
  margin-left: 80px !important;
}

.hp_ML_xl {
  margin-left: -80px !important;
}

.hp_pl_xxl {
  padding-left: 100px !important;
}

.hp_ml_xxl {
  margin-left: 100px !important;
}

.hp_ML_xxl {
  margin-left: -100px !important;
}

/* ------------------------------------------------------------
* ディスプレイ
* ------------------------------------------------------------ */
.hp_block {
  display: block !important;
}

.hp_inline {
  display: inline !important;
}

.hp_inline_block {
  display: inline-block !important;
}

/* ------------------------------------------------------------
* 画像の幅
* ------------------------------------------------------------ */
/* 画像をブロックにする */
.hp_img_block {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (min-width: 480px){
  .bl_col_sm_1 {
    width: 8.33%;
  }
  .bl_col_sm_2 {
    width: 16.66%;
  }
  .bl_col_sm_3 {
    width: 25%;
  }
  .bl_col_sm_4 {
    width: 33.33%;
  }
  .bl_col_sm_5 {
    width: 41.66%;
  }
  .bl_col_sm_6 {
    width: 50%;
  }
  .bl_col_sm_7 {
    width: 58.33%;
  }
  .bl_col_sm_8 {
    width: 66.66%;
  }
  .bl_col_sm_9 {
    width: 75%;
  }
  .bl_col_sm_10 {
    width: 83.33%;
  }
  .bl_col_sm_11 {
    width: 91.66%;
  }
  .bl_col_sm_12 {
    width: 100%;
  }
  .hp_hide_sm_min {
    display: none !important;
  }
}

@media screen and (min-width: 480px) and (max-width: 1023px){
  .hp_hide_tablet {
    display: none !important;
  }
}

@media screen and (min-width: 768px){
  .ly_wrap {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .bl_col_md_1 {
    width: 8.33%;
  }
  .bl_col_md_2 {
    width: 16.66%;
  }
  .bl_col_md_3 {
    width: 25%;
  }
  .bl_col_md_4 {
    width: 33.33%;
  }
  .bl_col_md_5 {
    width: 41.66%;
  }
  .bl_col_md_6 {
    width: 50%;
  }
  .bl_col_md_7 {
    width: 58.33%;
  }
  .bl_col_md_8 {
    width: 66.66%;
  }
  .bl_col_md_9 {
    width: 75%;
  }
  .bl_col_md_10 {
    width: 83.33%;
  }
  .bl_col_md_11 {
    width: 91.66%;
  }
  .bl_col_md_12 {
    width: 100%;
  }
  .hp_hide_md_min {
    display: none !important;
  }
}

@media screen and (min-width: 1024px){
  body {
    padding-top: 113px;
  }
  .brp {
    display: none;
  }
  .brs {
    display: block;
  }
  .ly_header {
    height: 113px;
    z-index: 9998;
  }
  .ly_header_cont {
    padding: 10px;
    margin: 0;
    position: relative;
    background-color: #fff;
  }
  .ly_footer{
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .ly_cont {
    max-width: 1080px;
  }
  .ly_contXl {
    max-width: 1205px;
  }
  .ly_contMd {
    max-width: 960px;
  }
  .el_btn {
    min-width: 380px;
    padding: 1.5947rem 1.25rem;
    border-radius: 2.5em;
  }
  .el_lgHeading{
    text-align: left;
    font-size: 3.0rem;
  }
  .el_mdHeading{
    line-height: 2;
    font-size: 3.0rem;
    font-weight: bold;
  }
  .el_heading_txt {
    font-size: 1rem;
  }
  .bl_header{
    display: block;
  }
  .bl_headerTitle {
    max-width: 100%;
  }
  .bl_headerTitle_inner {
    max-width: 322px;
    margin: 0 auto;
  }
  .bl_headerTitle_inner span {
    display: block;
    margin-top: 16px;
    font-size: 16px;
    letter-spacing: -0.05px;
  }
  .bl_headerNav {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
  }
  .bl_headerSide {
    display: none;
  }
  .bl_col_lg_1 {
    width: 8.33%;
  }
  .bl_col_lg_2 {
    width: 16.66%;
  }
  .bl_col_lg_3 {
    width: 25%;
  }
  .bl_col_lg_4 {
    width: 33.33%;
  }
  .bl_col_lg_5 {
    width: 41.66%;
  }
  .bl_col_lg_6 {
    width: 50%;
  }
  .bl_col_lg_7 {
    width: 58.33%;
  }
  .bl_col_lg_8 {
    width: 66.66%;
  }
  .bl_col_lg_9 {
    width: 75%;
  }
  .bl_col_lg_10 {
    width: 83.33%;
  }
  .bl_col_lg_11 {
    width: 91.66%;
  }
  .bl_col_lg_12 {
    width: 100%;
  }
  .hp_brp {
    display: none;
  }
  .hp_brs {
    display: block;
  }
  .hp_hide_lg_min {
    display: none !important;
  }
  .hp_hide_pc {
    display: none !important;
  }
}

@media screen and (min-width: 1280px){
  .hp_hide_xl_min {
    display: none !important;
  }
}

@media screen and (max-width: 1279px){
  .hp_hide_xl_max {
    display: none !important;
  }
}

@media screen and (max-width: 1023px){
  .hp_hide_lg_max {
    display: none !important;
  }
}

@media screen and (max-width: 767px){
  .hp_hide_md_max {
    display: none !important;
  }
}

@media screen and (max-width: 479px){
  .hp_hide_sm_max {
    display: none !important;
  }
  .hp_hide_sp {
    display: none !important;
  }
}

@media screen and (max-width: 374px){
  .hp_hide_xs_max {
    display: none !important;
  }
}

/*# sourceMappingURL=bundle.min.css.map*/

/* ============================================================
*
* ユニークグループ
*
* ============================================================ */

/* ------------------------------------------------------------
* トップページ
* ------------------------------------------------------------ */
/* メインビジュアル
* -------------------------------------------------- */
.un_homeMv_inner {
  position: relative;
  width: 100%;
  height: 650px;
  background: url(../images/home/mv_sp.jpg) center center/cover no-repeat;
  opacity: 0;
  transition: opacity 1.2s cubic-bezier(.4,0,.2,1);
}

.un_homeMv_copy {
  height: auto;
  position: absolute;
  top:27%;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  gap: 1.5em;

  padding: 8px;
  align-items: flex-start;
  justify-content: center;
  opacity: 0;
  transform: translateY(40px);
}

.un_homeMv_copy span {
  display: inline-block;
  font-size: 2.8rem;
  line-height: 1.8;
  letter-spacing: 0.1em;
    background-color: #fff;
    margin: 6px;
    padding: 8px 0;
}

.un_homeTop_btn {
  position: relative;
  margin-top: -30px;
}

.un_home_mvItem{
  position: absolute;
  top:0;
  left: 0;
  width: 30vw;
  max-width: 300px;
  min-width: 200px;
  z-index: 9999;
}


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

  .un_homeTop_btn {
    margin-top: -40px;
  }
  .un_homeMv_inner {
    height: 85vh;
      background: url(../images/home/mv_pc.jpg) center center/cover no-repeat;
  }
  .un_homeMv_copy {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 5%;
    margin-left: 17%;

  }
    .un_homeMv_copy span {
    font-size: 3.0rem;
    }

  .un_home_mvItem{
    width: 26vw;
    max-width: 360px;
    z-index: 9999;
  }
}
.un_homeAbout_line{
  position: relative;
  &:before{
    content: "";
    position: absolute;
    top: 8%;
    left: -5%;
    width: 1px;
    height: 300px;
    background-color: var(--color-gray)
  }
}

/* ------------------------------------------------------------
* LP共通
* ------------------------------------------------------------ */

.un_home_en{
  display: none;
}

/* ------------------------------------------------------------
* 最高の一杯を求めて　アバウト
* ------------------------------------------------------------ */

.un_homeAbout_txt{
  margin-top: 40px;
}

.un_homeAbout_item{
  position: absolute;
  top: 0;
  left: 50%;
  margin-top: 20%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.un_homeAbout_item_pc{
  display: none;
}



.un_homeAbout_img01{
  display: none;
}
.un_homeAbout_img02{
  display: none;
}

.un_homeAbout_img03{
  display: none;
}

.un_homeAbout_img01,
.un_homeAbout_img02,
.un_homeAbout_img03 {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(.4,0,.2,1), transform 0.8s cubic-bezier(.4,0,.2,1);
}

@media screen and (min-width: 1024px){
  .un_home_en{
    position: absolute;
    top:0;
    left: 0;
    rotate: 90deg;
    font-size: 2.2rem;
    color: var(--color-gray);
    display: inline-block;
    font-weight: bold;
    font-size: 1.4rem;
    margin-left: -60px;
    margin-top: 20px;
  }

  .un_homeAbout_item{
    display: none;
  }
  .un_homeAbout_item_pc{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 14%;
    margin-right: 10%;
    margin-top: -8%;
  }
  .un_homeAbout_box{
    padding-left: 110px;
    padding-right: 280px;
  }

  .un_homeAbout_txt{
    line-height: 2.5;
  }

  .un_homeAbout_img01{
    display: block;
    position: absolute;
    top:0;
    right: 0;
    width: 30vw;
    max-width: 500px;
    margin-top:300px
  }
    .un_homeAbout_img02{
    display: block;
    position: absolute;
    top:0;
    left: 0;
    width: 14vw;
    max-width: 400px;
    margin-top:500px
  }
  .un_homeAbout_img03{
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 30vw;
    max-width: 600px;
    margin-right: 260px;
    margin-bottom: 220px;
  }

  .un_homeAbout_wrap{
    padding-bottom: 500px;
  }
}

@media screen and (min-width: 1280px){
    .un_homeAbout_img02{
    width: 20vw;
    max-width: 400px;
    margin-top:500px
  }

    .un_homeAbout_img03{
    width: 30vw;
    max-width: 600px;
    margin-right: 260px;
    margin-bottom: 100px;
  }

}

/* ------------------------------------------------------------
* 3つのこだわり
* ------------------------------------------------------------ */

.un_homePassion_img{
  position: relative;
  margin-top: 80px;

      text-align: center;
  &img{
    width: 100%;

  }
}
.un_homePassion_img__ttl{
  position: absolute;
  top: 0;
  right: 0;
  font-size: 4.5rem;
  color: #fff;
  margin-top: -40px;
}

.un_homePassion_ttl{
  position: relative;
  font-size: 2.0rem;
  font-weight: bold;
  color: var(--color-primary);
  &::before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    margin-bottom: -10px;
    width: 100%;
    height: 1px;
    margin-left: calc(50% - 50vw);
    background-color: var(--color-primary);
  };
}

.un_homePassion_head{
  font-size: 2.2rem;
  margin-top: 20px;
}



.un_homePassion_box{
    background-image: radial-gradient(#ffffff, #ecf6f0 67% 100%);
}

.un_homePassion_ttl{
  margin-top: 20px;

}

.un_homePassion_txt{
  margin-top: 20px;
}


@media screen and (min-width: 1024px){
  .un_homePassion_line{
    display: block;
    position: relative;
    &::before{
      content: "";
      position: absolute;
      top: 3%;
      bottom: 0;
      left: -3%;
      width: 1px;
      height: 101%;
      background-color: var(--color-gray);
    }
  }
  .un_homePassion_wrap{
    display: flex;
    padding: 80px 0;
  }
  .un_homePassion_img{
    width: 40%;
    order: 1;
    margin-left: 60px;
  }
  .un_homePassion_img__ttl{
    font-size: 6.0rem;
    margin-top: -60px;
  }

  .un_homePassion_box{
    width: 60%;
  }
  .un_homePassion_ttl{
    margin-top: 0;
    width: 140%;
    &::before{
      margin-left:-50%;
    }
  }
  .un_homePassion_head{
    font-size: 2.6rem;
    margin-top: 40px;
    letter-spacing: -0.02em;
  }

  .un_homePassion_txt{
    margin-top: 40px;
    line-height: 2.5;
  }
}

/* ------------------------------------------------------------
* 一杯の、やすらぎを
* ------------------------------------------------------------ */

.un_homeComm_img__sp{
  text-align: center;
}

.un_homeComm_item01{
  display: none;
}

.un_homeComm_item02{
  display: none;
}


@media screen and (min-width: 1024px){
  .un_homeComm_img__sp{
    display: none;
  }

  .un_homeComm_item01{
    position: absolute;
    display: block;
    top:0;
    left: 0;
    max-width: 17vw;
    margin-left: 6%;
    margin-top: 100px;
  }
  .un_homeComm_item02{
    position: absolute;
    display: block;
    top:0;
    right: 0;
    max-width: 17vw;
    margin-right: 6%;
    margin-top: 200px;
  }

  .un_homeComm_box{
    max-width: 520px;
    margin: 0 auto;
    padding: 40px 20px;
    & .un_homePassion_txt{
      margin-left: 40px;
    }
  }

}


@media screen and (min-width: 1280px){
  .un_homeComm_item01{
    max-width: 256px;
  }
  .un_homeComm_item02{
    max-width: 256px;
  }
}


/* ------------------------------------------------------------
* SNS CTA
* ------------------------------------------------------------ */

.un_homeComm_ttl{
  text-align: center;
  color: var(--color-primary);
  font-size: 2.5rem;
  font-weight: bold;
}

.un_homeComm_txt{
  margin-top: 10px;
}

.un_homeCTA_left{
  background-color: #ffffffda;
  padding: 30px 20px 0 20px;
  margin: 0 20px;
}

.un_homeCTA_right{
    background-color: #ffffffda;
    padding: 0 0 30px 0;
    margin: 0 20px;
}
.un_homeCTA_sns{
  display: flex;
  gap: 20px;
  padding: 20px;
  justify-content: center;
}
.un_homeCTA_sns__insta{
  padding: 10px 20px;
  background-color: var(--color-primary);
  text-align: center;
  & img{
    filter: drop-shadow(4px 4px 0px #00000039);
    width: 48px;
    height: auto;
    transition: filter 0.3s;
  }
}

.un_homeCTA_sns__line{
  background-color: #fff;
  padding: 10px 20px;
  text-align: center;
    & img{
    filter: drop-shadow(4px 4px 0px #00000039);
    width: 48px;
    height: auto;
    transition: filter 0.3s;
  }
}

.un_homeCTA_sns__txt{
  font-size: 1.2rem;
  margin-top: 10px;
  white-space: nowrap;
}

.un_homeCTA_sns__link{
  display: block;
  border: 1px solid var(--color-primary);

  & .un_homeCTA_sns__txtInsta{
    color: var(--color-white);
    text-decoration: underline;
    text-decoration-color: var(--color-white);
  }

  & .un_homeCTA_sns__txtLine{
    color: var(--color-primary);
    text-decoration: underline;
    text-decoration-color: var(--color-primary);
  }

  &:hover{
    & img{
      filter: none;
    }
    & .un_homeCTA_sns__txtInsta{
      text-decoration: none;
    }
    & .un_homeCTA_sns__txtLine{
      text-decoration: none;
    }
  }
}

@media screen and (min-width: 1024px){
  .un_homeCTA_wrap{
    display: flex;
    position: relative;
    z-index: 2;
  }

  .un_homeComm_leftBg{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    background-color: #fff;
    width: 45%;
    margin-top: 100px;
    margin-bottom: 100px;

  }

  .un_homeComm_ttl{
    font-size: 3.0rem;
    text-align: left;
    position: relative;
    &::before{
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 600px;
      margin-left: -500px;
      height: 1px;
      background-color: var(--color-primary);
    }
  }

  .un_homeComm_txt{
    margin-top: 20px;
    font-size: 2.0rem;
  }

  .un_homeCTA_left{
    background-color: transparent !important;
    width: 50%;
    margin-bottom: 0;
  }
  .un_homeCTA_half{
  }
  .un_homeCTA_right{
    width: 50%;
    background-color: transparent !important;
    padding-bottom: 0;
  }

  .un_homeCTA_sns__insta{
    width: 200px;
    height: 200px;
    padding: 40px 30px 30px;
    & img{
      width: 64px;
      height: auto;
    }
  }

  .un_homeCTA_sns__line{
    background-color: #fff;
    width: 200px;
    height: 200px;
    padding: 40px 30px 30px;
      & img{
      width: 64px;
    }
  }


  .un_homeCTA_sns__txt{
    font-size: 1.6rem;
    margin-top: 24px;
  }

}


/* ------------------------------------------------------------
* スマホ版 CTA　追跡ボタン
* ------------------------------------------------------------ */
.un_homeSpCta_wrap{
  position: fixed;
  width: 100%;
  height: 60px;
  bottom: 0;
  left: 0;
  z-index: 9999;
}

.un_homeSpCta_inner{
  display: flex;
}
.un_homeSpCta_link{
  display: block;
  text-decoration: none;
  width: 50%;
  border-top: 1px solid var(--color-primary);
}
.un_homeSpCta_link__insta{
  text-align: center;

  background-color: var(--color-primary);
  color: var(--color-white);
  height: 60px;
  padding: 14px 10px 0 10px;
  transition: background-color 0.3s;

  & img{
    width: 30px;
    display: inline-block;
  }
  & span{
    margin-left: 8px;
  }

  &:hover{
    background-color: var(--color-accent);
  }
}

.un_homeSpCta_link__line{
  text-align: center;
  background-color: var(--color-white);
  color: var(--color-primary);
  height: 60px;
  padding: 14px 10px 0 10px;
  transition: background-color 0.3s;

  & img{
    width: 30px;
    display: inline-block;
  }
  & span{
    margin-left: 8px;
  }
  &:hover{
    background-color: var(--color-bg);
  }
}


@media screen and (min-width: 1024px){
  .un_homeSpCta_wrap{
    display: none;
  }
}