@charset "utf-8";
/*基本設定*/
html {
  font-size: 62.5%; /*以下フォントサイズはrem指定するブラウザごとに変化する。例：1.2rem＝12pxとなる。*/
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 0;
}
body {
  margin-left: auto;
  margin-right: auto;
  font-family: "hiragino-mincho-pron", sans-serif;
  font-weight: 300;
  font-style: normal;
  position: relative;
  line-height: 1.8;
  letter-spacing: 0.12em;
}
img {
  max-width: 100%;
  height: auto;
}
a {
  display: block;
}
.sp_none {
  display: none;
}
/*共通の領域*/
/*header*/
#top .sp_hero {
  height: 680px;
  width: 100%;
  object-fit: cover;
}
#top .copy {
  writing-mode: vertical-rl;
  font-size: 2rem;
  letter-spacing: 0.15em;
  color: #fff;
  position: absolute;
  top: 200px;
  left: 65vw;
  z-index: 500;
}
#top .mat_75 {
  margin-top: 75px;
}
#top h1 {
  height: 90px;
  position: absolute;
  top: 460px;
  left: 65%;
  overflow: hidden;
  z-index: 500;
}
.fadein {
  animation-name: fadeinAnime;
  animation-duration: 5s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeinAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/*footer*/
.footer_wrap {
  width: 300px;
  margin: 0 auto;
}
footer {
  height: 256px;
  background-color: #73923B;
}
footer nav {
  color: #fff;
  font-size: 1.7rem;
  writing-mode: vertical-rl;
  font-family: "shinryu", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin: 0 auto;
  padding-top: 40px;
  position: relative;
}
footer nav li:not(:first-child) {
  margin-right: 30px;
}
.footer_btn a {
  color: #B89F26;
  font-size: 16px;
  background-color: #fff;
  width: 230px;
  margin: 0 auto;
  text-align: center;
  padding: 10px 15px 10px 60px;
  margin-top: 30px;
  border: 1px solid #B89F26;
}
.footer_btn {
  position: relative;
}
.footer_btn::before {
  content: '';
  background-image: url("../img/tel_icon.png");
  background-size: contain;
  display: inline-block;
  width: 35px;
  height: 35px;
  position: absolute;
  left: 60px;
  top: 8px;
}
footer p {
  text-align: center;
}
small {
  color: #fff;
  font-size: 1.4rem;
  display: inline-block;
  margin-top: 30px;
}
/*HBGnav*/
#HBG_nav {
  width: 375px;
  font-family: "shinryu", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.4rem;
  color: #fff;
  background-color: rgba(14, 5, 21, 0.9);
  padding-bottom: 60px;
}
#HBG_nav ul {
  padding-top: 90px;
  padding-bottom: 90px;
  padding-left: 200px;
}
#HBG_nav ul li:not(:last-child) {
  margin-bottom: 50px;
}
#HBG_nav ul li {
  display: block;
  position: relative;
}
#HBG_nav ul li::before {
  content: '';
  display: block;
  width: 180px;
  height: 4px;
  background-image: url("../img/white_line.png");
  background-repeat: no-repeat;
  position: absolute;
  left: -200px;
  top: 20px;
}
.HBG_btn a {
  font-family: "hiragino-mincho-pron", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 16px;
  color: #B89F26;
  background-color: #fff;
  width: 230px;
  text-align: center;
  padding: 10px 15px 10px 60px;
  border: 1px solid #B89F26;
}
.HBG_btn {
  position: relative;
  align-self: center;
}
.HBG_btn::before {
  content: '';
  background-image: url("../img/tel_icon.png");
  background-size: contain;
  display: inline-block;
  width: 35px;
  height: 35px;
  position: absolute;
  top: 8px;
  left: 25px;
}
.HBG_nav_flex {
  display: flex;
  justify-content: space-evenly;
}
#HBG_nav img {
  width: 120px;
  height: 70px;
  display: inline-block;
}
a:hover {
  opacity: 0.5;
}
h1 a:hover,.HBG_nav_logo:hover{
	opacity:1;
}
/*topページここから*/
/*consept*/
#top .concept_wrap {
  background-color: #0D0015;
  color: #fff;
}
#top .concept_wrap h2 {
  position: relative;
  color: #73923B;
  font-family: "shinryu", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.4rem;
  padding-top: 170px;
}
#top .concept_heading_first {
  padding-left: 130px;
}
#top .concept_heading_first::before {
  content: '';
  display: block;
  width: 100px;
  height: 4px;
  background-image: url("../img/green_line.png");
  background-repeat: no-repeat;
  position: absolute;
  top: 190px;
  left: 0;
}
#top .concept_text {
  writing-mode: vertical-rl;
  font-size: 1.6rem;
  letter-spacing: 0.15em;
  line-height: 1.8;
  padding-top: 80px;
}
#top .concept_vertical {
  writing-mode: horizontal-tb;
}
#top .concept_inner img {
  display: block;
  width: 90%;
  padding-top: 300px;
  filter: brightness(80%);
}
#top .text_first {
  display: block;
  position: absolute;
  left: 10vw;
  z-index: 10;
}
#top .text_second {
  position: absolute;
  right: 10vw;
  z-index: 10;
}
#top .text_first::before {
  content: '';
  display: block;
  width: 160px;
  height: 220px;
  background-image: url("../img/wagara_bg_2.png");
  background-repeat: no-repeat;
  position: absolute;
  top: 80px;
  right: -135px
}
#top .img_first {
  margin-left: auto;
}
#top .img_third {
  display: block;
  width: 90%;
  padding-top: 80px;
}
#top .concept_heading_second {
  text-align: right;
  padding-right: 130px;
}
#top .concept_heading_second::before {
  content: '';
  display: block;
  width: 100px;
  height: 4px;
  background-image: url("../img/green_line.png");
  background-repeat: repeat-x;
  position: absolute;
  top: 190px;
  right: 0;
}
#top .concept_wrap h3 {
  font-size: 2rem;
  font-weight: 600;
  text-align: center;
  margin: 45px 0;
  padding: 0 20px;
}
#top .concept_wrap h3 + p {
  font-size: 1.6rem;
  padding: 0 20px 100px 20px;
  margin-bottom: 140px;
}
#top .concept_wrap h3 + p::after {
  content: '';
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("../img/glass.jpg") no-repeat center/cover;
  z-index: -1;
}
/*menu*/
#top .menu_wrap {
  background-image: url("../img/menu-bg.jpg");
  padding-bottom: 100px;
}
#top .menu_wrap h2 {
  width: 70px;
  height: 220px;
  margin: 0 auto;
  padding-top: 45px;
}
#top .menu_wrap h3 {
  padding-top: 80px;
  font-size: 2rem;
  font-weight: 600;
  text-align: center;
  color: #73923B;
}
#top .menu_inner p {
  padding-top: 20px;
  font-size: 1.6rem;
  text-align: center;
  color: #73923B;
  margin-bottom: 45px;
}
#top .menu_text_1 {
  font-size: 2rem;
  text-align: center;
  font-weight: 600;
}
#top .menu_text_2 {
  font-size: 1.6rem;
  text-align: center;
  padding-top: 20px;
}
#top .menu_content {
  margin-right: 20px;
  margin-left: 20px;
  margin-bottom: 45px;
  padding: 20px 0;
  border: 1px solid #73923B;
}
#top .menu_list {
  font-size: 1.6rem;
  text-align: center;
  padding: 20px 0;
  border-bottom: 1px solid #73923B;
  margin-right: 20px;
  margin-left: 20px;
}
#top .menu_text_3 {
  border-top: 1px solid #73923B;
}
#top .menu_btn {
  color: #73923B;
  background-color: #fff;
  font-size: 1.6rem;
  text-align: center;
  width: 205px;
  margin: 45px auto 0 auto;
  border: 1px solid #73923B;
  padding-top: 10px;
  padding-bottom: 10px;
}
/*アクセス*/
#top .access_wrap {
  background-color: #0D0015;
  color: #fff;
}
#top .access_wrap h2 {
  font-size: 2.4rem;
  font-family: "shinryu", sans-serif;
  font-weight: 400;
  font-style: normal;
  padding-left: 130px;
  position: relative;
  padding-top: 170px;
  padding-bottom: 80px;
}
#top .access_wrap h2::before {
  content: '';
  display: block;
  width: 100px;
  height: 4px;
  background-image: url("../img/white_line.png");
  background-repeat: no-repeat;
  position: absolute;
  top: 190px;
  left: 0;
}
#top .access_text_1 {
  font-size: 2.4rem;
  font-family: "shinryu", sans-serif;
  font-weight: 400;
  font-style: normal;
  padding-top: 40px;
}
#top .access_text_1, .access_inner {
  border-bottom: 1px solid #B89F26;
  padding-bottom: 10px;
}
#top .access_inner {
  font-size: 1.6rem;
}
#top .access_text_1, .access_inner, .access_wrap iframe {
  padding-right: 20px;
  padding-left: 20px;
}
#top .access_wrap iframe {
  width: 100%;
  height: 400px;
  display: block;
  margin: 50px auto 0;
  padding-bottom: 80px;
}
#top .access_text_2 {
  display: block;
  font-size: 2rem;
  padding-top: 10px;
  margin-bottom: -20px;
}
#top .access_text_3 {
  padding-bottom: 10px;
}
#top .pc_flex_item {
  padding: 0 20px;
}
/*menuページここから*/
/*header*/
#menu .menu_top {
  width: 100%;
  height: 260px;
  object-fit: cover;
  filter: brightness(50%);
}
#menu header {
  position: relative;
}
#menu h1 {
  width: 80px;
  position: absolute;
  top: 15px;
  left: 10px;
  z-index: 10;
}
#menu h2 {
  width: 70px;
  height: 220px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/*main*/
#menu .menu_item {
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
#menu .title {
  font-size: 2.4rem;
  font-family: "shinryu", sans-serif;
  font-weight: 400;
  font-style: normal;
  padding-top: 43px;
  padding-bottom: 43px;
  padding-left: 130px;
  background-image: url("../img/menu-bg.jpg");
}
#menu .main_wrap {
  padding: 60px 0;
  background-color: #0D0015;
}
#menu .title::before {
  content: '';
  display: block;
  width: 100px;
  height: 2px;
  background-image: url("../img/black_line.png");
  background-repeat: no-repeat;
  position: absolute;
  top: 385px;
  left: 0;
}
#menu .menu_wrap_first {
  background-color: #0D0015;
  color: #fff;
  margin: 0 auto;
  text-align: center;
  font-size: 1.6rem;
}
#menu .menu_img {
  width: 250px;
  height: 250px;
  object-fit: cover;
  position: relative;
  z-index: 10;
}
#menu .menu_text_first {
  font-size: 20px;
  font-weight: 600;
  padding-top: 5px;
  padding-bottom: 5px;
}
#menu .menu_text_second {
  padding-bottom: 70px;
}
#menu .menu_wrap_second {
  background-image: url("../img/menu-bg_2.jpg");
  margin: 0 auto;
  text-align: center;
  font-size: 1.6rem;
  padding-top: 70px;
}
#menu .menu_item_inner {
  margin: 0 auto;
  width: 330px;
  position: relative;
}
#menu .menu_before::before {
  content: '';
  display: block;
  width: 160px;
  height: 190px;
  background-image: url("../img/wagara_bg_2.png");
  background-repeat: no-repeat;
  position: absolute;
  top: 30px;
  left: -40px;
}
#menu .menu_after::after {
  content: '';
  display: block;
  width: 160px;
  height: 190px;
  background-image: url("../img/wagara_bg_2.png");
  background-repeat: no-repeat;
  position: absolute;
  top: 30px;
  right: -40px;
}
@media screen and (min-width:768px) {
  #HBG_nav, .openbtn {
    display: none;
  }
  /*menu領域*/
  #menu .menu_wrap_first, #menu .menu_wrap_second {
    display: flex;
    flex-wrap: wrap;
    max-width: 960px;
  }
  #menu .menu_item_inner {
    flex-basis: 50%;
  }
  #menu .inner {
    background-color: #0D0015;
  }
  #menu .inner_second {
    background-image: url("../img/menu-bg_2.jpg");
  }
  #menu .menu_wrap_second {
    background-image: none;
  }
  #menu .title {
    text-align: center;
    padding-left: 0;
  }
  #menu .menu_top {
    height: 700px;
  }
  #menu h2 {
    width: 140px;
    height: 430px;
  }
  #menu h1 {
    width: 130px;
    position: fixed;
    z-index: 500;
  }
  /*header(共通部分)領域*/
  .sp_none {
    display: block;
  }
  .header_nav {
    text-align: center;
    position: fixed;
    z-index: 500;
    right: 0;
    color: #fff;
    background-color: rgba(14, 5, 21, 0.5);
    padding-bottom: 30px;
    display: block;
    width: 100%;
  }
  .sp_none ul {
    display: flex;
    padding-left: 60vw;
    margin-right: 10px;
    margin-top: 30px;
  }
  .sp_none li {
    font-size: 2rem;
    font-family: "shinryu", sans-serif;
    font-weight: 400;
    font-style: normal;
    width: 150px;
    display: inline;
    border-right: 1px solid #fff;
  }
  .sp_none li:nth-child(1) {
    border-left: 1px solid #fff;
  }
  /*header(menu)領域*/
  #menu .header_wrap {
    background-color: rgba(14, 5, 21, 0.7);
  }
  #menu .menu_after::after {
    right: 0px;
  }
  #menu .menu_before::before {
    left: 0px;
  }
  #menu .title::before {
    display: none;
  }
  /*footer(共通)領域*/
  footer nav {
    font-size: 2.4rem;
  }
  footer nav li:not(:first-child) {
    margin-right: 40px;
  }
  footer {
    height: 300px;
    background-color: #73923B;
  }
  .footer_btn a {
    width: 300px;
  }
  #top h1 {
    width: 130px;
    top: 15px;
    left: 10px;
    position: fixed;
    z-index: 600;
  }
  #top .sp_hero {
    display: none;
  }
  #top .pc_hero {
    width: 100%;
    height: 700px;
    object-fit: cover;
  }
  #top .main_concept_wrap {
    background-color: #0D0015;
  }
  #top .concept_wrap {
    max-width: 960px;
    margin: 0 auto;
  }
  #top .concept_inner img {
    padding-top: 0;
    width: 70%;
    filter: none;
  }
  #top .pc_flex {
    display: flex;
    justify-content: center;
    margin-top: 80px;
  }
  #top .text_first {
    position: static;
    padding-left: 20px;
  }
  #top .img_first {
    padding-right: 20px;
    margin: auto;
    align-self: flex-start;
  }
  #top .concept_text {
    padding-top: 0;
  }
  #top .text_first::before {
    display: none;
  }
  #top .text_second {
    position: static;
    padding-right: 20px;
  }
  #top .pc_flex_second {
    display: flex;
    justify-content: center;
    flex-direction: row-reverse;
    margin-top: 80px;
  }
  #top .img_second {
    padding-left: 20px;
    margin: auto;
    align-self: flex-start;
  }
  #top .img_third {
    width: 100%;
  }
  #top .menu_wrap {
    max-width: 960px;
    margin: 0 auto;
    margin-bottom: 140px;
  }
  #top .access_wrap {
    max-width: 960px;
    margin: 0 auto;
  }
  #top .main_access_wrap {
    background-color: #0D0015;
  }
  #top .pc_flex_third {
    display: flex;
    padding-left: 20px;
    padding-right: 20px;
  }
  #top .pc_flex_third img {
    width: 50%;
  }
  #top .pc_flex_item {
    padding-left: 20px;
    align-self: flex-end;
    width: 50%;
  }
  #top .copy {
    left: 70vw;
    font-size: 2.2rem;
  }
}
@media screen and (max-width:410px) {
  #menu .menu_after::after {
    right: -20px;
  }
}