@charset "UTF-8";
*{
  font-family: 'Shippori Mincho B1', serif;
  font-weight: normal;
  color: #525252;
}
a{
  color: #525252;
}
a:hover{
  color: #8D8D8D;
  opacity: .5;
}
@media screen and (max-width:767px){
  .sp{
    display: block !important;
  }
  .pc{
    display: none !important;
  }
}
@media screen and (min-width:768px){
  .sp{
    display: none !important;
  }
  .pc{
    display: block !important;
  }
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}
.bkalph,.bkalphsp{
  background-color: black;
  display: inline-block;
}
.bkalph img,.bkalphsp img{
  opacity: .7;
}
@media screen and (min-width:768px){
  .bkalphsp img{
    opacity: 1;
  }
}

.float{
	opacity: 0;
	transform: translate(0,80px);
	transition: all 800ms;
}
.float.scrollin{
	opacity: 1;
	transform: translate(0,0);
	display: block;
}
.float_slow{
	opacity: 0;
	transform: translate(0,80px);
	transition: all 1600ms;
}
.float_slow.scrollin{
	opacity: 1;
	transform: translate(0,0);
	display: block;
  height: auto;
}

h1{
  position: absolute;
  z-index: 2;
  color: #fff;
  width: 22vw;
  top: 8vw;
  left: 8vw;
}
@media screen and (min-width:768px){
  h1{
    width: 10vw;
    top: 4vw;
    left: 4vw;
  }
}
.top h1{
  width: 37vw !important;
}
@media screen and (min-width:768px){
  .top h1{
    width: 20vw !important;
  }
}


nav{
  position: absolute;
  z-index: 2;
}
/* ナビゲーション↓ */
#global-navi {
  top: 0;
  right: 0;
  width: 100%;
  position: fixed;
}
#nav_wrapper nav {
position: fixed;
top: 0;
right: -100%;
width: 100%;
height: 100%;
padding-top: 14vw;
padding-bottom: 10vh;
padding-left: 10vw;
background:rgba(255,255,255,.95);
font-size: 16px;
box-sizing: border-box;
z-index: 4;
overflow: scroll;
}
#nav_wrapper nav ul.menu li {
  display:block;
  padding: 0 0 8px 1em;
  text-align: left;

}
#nav_wrapper nav > ul.menu ul li:last-of-type {
  padding: 0 0 40px 1em;
}
#nav_wrapper nav ul.menu li a,#nav_wrapper nav ul.menu li.text{
  text-decoration: none;
  font-size: 14px;
  display: inline-block;
  letter-spacing: 2px;
  text-indent: -1.5em;
  padding-left: 1em;
  padding-right: 20px;
}
#nav_wrapper nav ul.menu li.text{
  margin-left: 8px;
}
@media screen and (min-width:768px){
  #nav_wrapper nav ul.menu li.text{
    margin-left: 39px;
  }
}
#nav_wrapper nav ul.menu .article li a{
	padding-left:5.9em;
	text-indent:-5.9em;
}
#nav_wrapper nav ul.menu li.ttl,#nav_wrapper nav ul.menu li a.ttl,#nav_wrapper nav ul.menu li.ttl a{
  font-size: 18px;
  letter-spacing: .2em;
  padding-left: 0;
}
#nav_wrapper nav ul.menu li.ttl a{
  display: inline;
}
#nav_wrapper nav ul.menu li a.ttl{
  margin-bottom: 20px;
}
#nav_wrapper nav ul.menu li.ttl span{
  color: #868686;
  font-size: 12px;
  font-family: 'Noto Serif JP', serif;
  display: inline-block;
  margin-left: 12px;
  vertical-align: 4px;
  letter-spacing: .1em;
}
#nav_wrapper nav ul.menu li a span{
  font-family: 'Noto Serif JP', serif;
}

#nav_wrapper nav ul.menu li a img{
  width: 35vw;
}
@media screen and (min-width:768px){
  #nav_wrapper nav{
    padding-top: 5vw;
    padding-left: 5vw;
  }
  #nav_wrapper nav ul.menu li{
    text-align: left;
  }
  #nav_wrapper nav ul.menu li a{
    font-size: 15px;
    width: 32vw;
  }
  #nav_wrapper nav ul.menu li a:hover{
    opacity: 1;
    color: #8D8D8D;
  }
  #nav_wrapper nav ul.menu li a.ttl{
    font-size: 25px;
    font-size: 22px;
    letter-spacing: .2em;
  }
  #nav_wrapper nav ul.menu li.ttl span{
    font-size: 12px;
    margin-left: 12px;
    vertical-align: 2px;
    letter-spacing: .1em;
  }
  #nav_wrapper nav ul.menu .article{
    margin-left: -9px;
  }
  #nav_wrapper nav ul.menu li a{
    font-size: 15px;
    letter-spacing: 2px;
  }
  #nav_wrapper nav ul.menu li a span:hover{
    opacity: 1;
    color: #8D8D8D;
  }
  #nav_wrapper nav ul.menu li a img{
    width: 16vw;
  }
}
.btn-gnavi {
  position: fixed;
  width: 40px;
  height: 44px;
  cursor: pointer;
  right: 30px;
  top: 30px;
  /* z-index: 11; */
}
@media screen and (min-width:768px){
  .btn-gnavi {
    right: 30px;
    top: 30px;
    width: 1.8vw;
    height: 44px;
  }
}
.btn-gnavi span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #fff;
  border-radius: 4px;
  z-index: 3;
}
.btn-gnavi span.bk_bg{
  background-color: #2C2C2C;
}
.btn-gnavi, .btn-gnavi span {
  display: inline-block;
  transition: all .5s;
  box-sizing: border-box;
  z-index: 11;
  /* z-index: 5; */
}
.btn-gnavi span:nth-of-type(1) {
  top: 0;
}
.btn-gnavi span:nth-of-type(2) {
  top: 8px;
  width: 30px;
}
@media screen and (min-width:768px){
  .btn-gnavi span:nth-of-type(2) {
    width: 1.2vw;
  }
}
.btn-gnavi span:nth-of-type(3) {
  bottom: 28px;
}
.btn-gnavi.open span{
  background-color: #525252 !important;
}
.btn-gnavi.open span:nth-of-type(1) {
  -webkit-transform: translateY(20px) rotate(-315deg);
  transform: translateY(20px) rotate(-315deg);
  top: -7px;
}
.btn-gnavi.open span:nth-of-type(2) {
  opacity: 0;
}
.btn-gnavi.open span:nth-of-type(3) {
  -webkit-transform: translateY(-20px) rotate(315deg);
  transform: translateY(-20px) rotate(315deg);
  bottom: 10px;
}
/* ナビゲーション↑ */









footer{
  text-align: center;
  padding: 100px 0 50px;
  background: #E3E3E3;
}
footer > div{
  width: 80vw;
  margin: auto;
}
@media screen and (min-width:768px){
  footer > div{
    width: auto;
    width: 84%;
  }
}
@media screen and (min-width:768px){
  footer ul{
    display: flex;
    justify-content: space-between;
    gap: 0 2vw; /* 余白 */
  }
}
footer ul li{
  margin-bottom: 20px;
}
@media screen and (min-width:768px){
  footer ul li{
    width: calc(100%/3);
    margin-bottom: 0;
  }
}
footer ul li a{
  display: block;
  width: 100%;
}
footer address{
  margin-top: 80px;
}
@media screen and (min-width:768px){
  footer address{
    margin-top: 100px;
  }
}
footer address p.name{
  font-size: 16px;
  letter-spacing: 2px;
}
@media screen and (min-width:768px){
  footer address p.name{
    font-size: 18px;
    letter-spacing: 1px;
  }
}
footer address p.name span{
  display: block;
  font-size: 15px;
}
@media screen and (min-width:768px){
  footer address p.name span{
    font-size: 15px;
  }
}
footer address p.ad{
  font-size: 18px;
}
@media screen and (min-width:768px){
  footer address p.ad{
    font-size: 20px;
  }
}
footer address p:nth-of-type(2){
  font-size: 13px;
  margin-top: 10px;
  letter-spacing: 1.5px;
}
@media screen and (min-width:768px){
  footer address p:nth-of-type(2){
    font-size: 13px;
    letter-spacing: 1px;
  }
}
footer small{
  font-family: 'Noto Serif JP', serif;
  color: #525252;
  margin: 60px auto 0;
  display: block;
  font-size: 11px;
  letter-spacing: 1px;
}
@media screen and (min-width:768px){
  footer small{
    margin: 80px auto 0;
    font-size: 12px;
  }
}



.pagetop{
  position: fixed;
  right: 8vw;
  bottom: 45px;
  z-index: 1000;
  width: 10vw;
}
@media screen and (min-width:768px){
  .pagetop{
    right: 1vw;
    width: 2.5vw;
  }
}