@charset "utf-8";
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
}
html, body {
  height: 100%;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}
body {
  overflow-y: scroll;
  background: #FFFFFF;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  font-weight: 300;
  font-style: normal;
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  color: #231815;
}
img {
  display: block;
  height: auto;
}
.pc {
  display: block;
}
.sp {
  display: none;
}
a {
  text-decoration: none;
  transition: 0.3s;
}
a:hover {
  /*opacity: 0.5;*/
}
li {
  list-style: none;
}
main {
  width: 100%;
  height: 100%;
  display: flex;
}
b {
  font-weight: normal;
}
/*


ホバー時に画像を差し替える


*/
.hover-fade-img {
  cursor: pointer;
  position: relative;
}
.hover-fade-img.active {
  cursor: auto;
  user-select: none;
}
.box img {}
.hover-fade-img img:last-of-type {
  top: 0;
  left: 0;
  position: absolute;
  opacity: 0;
  transition: opacity .3s;
}
.hover-fade-img.active img:last-of-type {
  opacity: 1;
}
.hover-fade-img:hover img {
  opacity: 1;
}
/*end ホバー時に画像を差し替える*/
/*

#modal_area



*/
#modal_area {
  display: none;
  position: fixed;
  z-index: 300000;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 100% !important;
  height: 100%;
  background: rgba(255, 255, 255, 0.80);
}
#modal_window_area {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 100% !important;
  height: 100%;
}
#modal_window {
  width: 80%;
  max-width: 1280px;
}
#modal_area img {
  width: 100%;
  pointer-events: none;
  user-select: none;
}
#modal_area img.tate {
  height: 90%;
  pointer-events: none;
  user-select: none;
}
#modal_close {
  line-height: 0.3em;
  position: absolute;
  top: 0;
  right: 0;
  font-size: 10vw;
  padding: 4%;
  color: rgba(255, 255, 255, 1.00);
  cursor: pointer;
  user-select: none;
}
#modal_area #youtube_close img {
  width: 100%;
}
/*


#loading_area


*/
#loading_area {
  position: fixed;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FFFFFF;
  z-index: 99999;
}
#loading_area img {
  width: 10vw;
}
/* end loading_area*/
#global_menu_area {
  width: 16%;
  height: 100%;
  background: rgba(255, 255, 255, 1.00);
  position: relative;
  font-family: a-otf-ryumin-pr6n, serif;
  font-weight: 300;
  font-style: normal;
}
#global_menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 16%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;
  letter-spacing: 0.2em;
  font-size: 0.7vw;
  font-size: 14px;
}
#global_menu_contents {
  width: 70%;
  /*min-width: 300px;*/
  margin: 0 auto;
}
#global_logo_area01 {
  width: 100%;
  margin-bottom: 20%;
  margin-bottom: 3vh;
  margin-top: 27%;
}
#global_logo_area01 img {
  width: 100%;
}
#global_logo_area02 img {
  width: 40%;
}
/*押せないボタン*/
.no_btn {
  opacity: 0.2;
}
/*

popup

*/
.comment_btn_ajast {
  display: flex;
  justify-content: flex-start;
  align-items: end;
  letter-spacing: 0.2em;
}
.pupup_btn {
  cursor: pointer;
  display: inline-block;
  margin-left: 1em;
}
#popupwrap_area {
  display: none;
}
#popup_area {
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 50000;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 0.8);
}
#popup_close {
  line-height: 0.3em;
  position: absolute;
  top: 0;
  right: 0;
  font-size: 10vw;
  padding: 4%;
  color: rgba(255, 255, 255, 1.00);
  cursor: pointer;
  user-select: none;
}
#popup {
  max-width: 1000px;
  height: 100vh;
  /*  max-height: 95%;*/
  display: flex;
  justify-content: center;
  align-items: center;
}
.comment_img {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.comment_img img {
  max-height: 100%;
  max-width: 100%;
}
/*

end popup

*/
@media screen and (max-height: 1090px) {
  #global_menu_contents {
    width: 50%;
  }
  #global_menu {
    font-size: 13px;
  }
  #global_logo_area02 img {
    width: 52%;
  }
}
#global_itemlist_area {
  /* width: 77%;*/
  margin: 0 auto;
}
#global_itemlist {
  /*line-height: 2.8em;*/
  /* margin: 20% 0;*/
}
#global_itemlist li {
  margin-bottom: 1.6em;
}
#global_itemlist_sns li {
  margin-bottom: 0em;
}
#global_itemlist li a, #global_itemlist_sns li a {
  color: #231815;
}
#global_itemlist_contact li {
  margin-bottom: 0em;
}
#global_itemlist_contact li a {
  color: #231815;
}
.grobal_menu-item {
  padding-left: 2%;
  padding-right: 15%;
  overflow: hidden;
  position: relative;
  z-index: 1;
  margin-bottom: 1.5em;
  letter-spacing: 0.1em;
  margin-bottom: 0em;
  display: inline-block;
}
.grobal_menu-item::after {
  background: #231815;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: 0.3s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}
.grobal_menu-item:hover {
  cursor: pointer;
  transition: 0.5s;
  color: #fff;
}
li.active .grobal_menu-item {
  color: #fff;
}
li.active .grobal_menu-item::after {
  transform: scale(1, 1);
}
.grobal_menu-item:hover::after {
  transform: scale(1, 1);
}
#global_itemlist {
  margin-bottom: 20%;
}
#global_itemlist_sns {
  font-size: 90%;
  line-height: 2em;
  margin-bottom: 20%;
}
#global_itemlist_contact {
  font-size: 90%;
  line-height: 2em;
  margin-bottom: 49%;
}
#global_translate_area {
  display: flex;
  margin-bottom: 17%;
}
#global_translate_now {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  padding-left: 2%;
}
#global_translate_now b {
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  font-weight: 300;
  font-style: normal;
  color: #231815;
  font-size: 54%;
}
#global_translatelist {
  font-size: 70%;
  border: 0.1em solid #231815;
  width: 100%;
  opacity: 0;
  transform: translateX(-15%);
  transition: 0.7s;
}
#global_translate_area:hover #global_translatelist {
  opacity: 1;
  transform: translateX(0);
}
#global_translatelist li {
  border-bottom: 0.1em solid #231815;
  padding: 1% 0;
  text-align: center;
  background: #fff;
}
#global_translatelist li a {
  color: #231815;
  width: 100%;
  display: inline-block;
}
#global_translatelist li:hover {
  background: #231815;
}
#global_translatelist li:hover a {
  color: #FFFFFF;
}
#global_translatelist li.current {
  background: #231815;
  color: #FFFFFF;
}
#global_translatelist li:last-child {
  border-bottom: none;
}
#global_logo_area02 {
  margin: 0 auto;
}
#main_area {
  width: 83.5%;
}
/*



#copyright_area



*/
#copyright_area {
  padding: 5.5% 0;
  font-family: kozuka-gothic-pr6n, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 0.5vw;
  letter-spacing: 0.2em;
}
/*end #copyright_area */
#sp_global_menu_over {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
  font-family: a-otf-ryumin-pr6n, serif;
  font-weight: 300;
  font-style: normal;
  z-index: 10;
}
@media screen and (max-width: 800px) {
  .pc {
    display: none;
  }
  .sp {
    display: inline-block;
  }
  #global_menu_area {
    display: none;
  }
  #global_menu {
    display: none;
  }
  #main_area {
    margin-top: 15%;
    width: 100%;
  }
  #loading_area img {
    width: 30vw;
  }
  /*



	#sp_global_menu_area



*/
  #sp_global_menu_area {
    position: fixed;
    display: flex;
    width: 100%;
    top: 0;
    left: 0;
    justify-content: space-between;
    align-items: center;
    font-family: a-otf-ryumin-pr6n, serif;
    font-weight: 300;
    font-style: normal;
    padding-top: 2%;
    z-index: 9;
    background: rgba(255, 255, 255, 1.00);
  }
  #sp_global_menu_area img {
    width: 100%;
  }
  #sp_logo_area {
    width: 27%;
  }
  #sp_translate_area {
    width: 63%;
    font-size: 3vw;
  }
  ul#sp_global_translatelist {
    display: flex;
    margin-left: 10%;
  }
  ul#sp_global_translatelist li {
    margin-right: 12%;
  }
  ul#sp_global_translatelist a {
    cursor: pointer;
    color: #231815;
    opacity: 0.3;
    transition: opacity .3s;
  }
  ul#sp_global_translatelist li:hover a {
    opacity: 1;
  }
  #sp_menu_btn_area {
    width: 10%;
    padding-right: 3%
  }
  #sp_menu_btn {
    cursor: pointer;
    width: 100%;
  }
  /*



  #sp_global_menu_over



*/
  #sp_global_menu_over_area {
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    position: relative;
  }
  #sp_menu_close {
    position: absolute;
    top: 0;
    right: 0;
    margin-top: 4%;
    margin-right: 4%;
    width: 10%;
  }
  #sp_menu_close img {
    width: 100%;
  }
  #sp_global_menu_over_contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 30%;
    margin: 0 auto;
  }
  #sp_global_menu_over_contents img {
    width: 100%;
  }
  #sp_global_over_logo_area {
    margin-top: 40%;
  }
  #sp_global_itemlist_area {
    text-align: center;
    margin-top: 30%;
    font-size: 3.5vw
  }
  ul#sp_global_itemlist li {
    margin-bottom: 11%
  }
  #sp_global_itemlist_area a {
    cursor: pointer;
    color: #231815;
  }
  #sp_global_itemlist_sns {
    margin-top: 23%;
  }
  #sp_global_itemlist_sns li {
    margin-bottom: 5%
  }

		  #sp_global_itemlist_contact {
    margin-top: 23%;
  }
  #sp_global_itemlist_contact li {
    margin-bottom: 5%
  }

  #sp_global_itemlist_link_logo img {
    width: 100%;
  }
  #sp_global_itemlist_link_logo ul {
    margin-top: 50%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  #sp_global_itemlist_link_logo li {
    width: 72%;
  }
}