#header-sp{ background:rgba(255,255,255,.9); width:100%; height:60px; z-index: 999; top:0; transition: 0.7s ease; position: fixed;}
#header-sp #logo-sp{ padding:5px 10px 0; position:relative;}
#header-sp #logo-sp .left { display:inline-block; text-align:center; position:absolute; left:0; right:0; margin:auto;}
#header-sp #logo-sp .left .p-02{ margin-bottom:3px; color:#f93b1d; font-size:22px; font-weight:bold;}
#header-sp #logo-sp .left .p-02 img{ height:15px;}
#header-sp #logo-sp .left .p-01{ font-size:12px; letter-spacing:normal;color:#000;font-weight:bold; text-indent:-0.5em;}
#header-sp #logo-sp .left a{ display:inline-block; text-decoration:none; color:#f93b1d;}

/*============
ナビ
#navArea
=============*/
#navArea{ position:relative; z-index:10;}
nav {
  display: block;
  position: fixed;
  top:0px;/*上からの距離*/
  right: -430px;/*左から出すか右から出すか*/
  bottom: 0;
  width:80%;
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  z-index: 20;
  transition: all .75s cubic-bezier(.64,.04,.35,1);
}
.open nav {
  right: 0;  /*左から出すか右から出すか*/
  opacity: 1;
}

nav .inner{ padding:70px 10px 50px 20px; text-align:left;}
nav .inner .logo{ display:inline-block; text-decoration:none; position:relative; margin-bottom:25px;}
nav .inner .logo img{ vertical-align:middle; margin-right:0px; transition:.3s;}
nav .inner .logo p { color:#393332;transition:.3s;}
nav .inner .logo .name{ display: none; vertical-align:middle; text-align: center;}
nav .inner .logo .name .p-01{ font-size:18px; font-weight:500; letter-spacing:normal; margin-top:5px;}
nav .inner .logo .name .p-02{ font-size:18px; font-weight:600; color:#f93b1d; margin-left:7px;}
nav .inner .logo .name .p-02 span{ font-size:24px;}



nav .inner ul{ margin-bottom:40px;}
nav .inner ul li{ margin-bottom:16px;}
nav .inner ul li a{ font-size:17px; font-weight:500; color:#333; display:inline-block; text-decoration:none;font-family: "Noto Serif", serif;}

nav .inner .area-01{ margin:auto; text-align:center;}
nav .inner .area-01 .btn{}
nav .inner .area-01 .btn a{ background:#393332; padding:15px 30px; display:inline-block; text-decoration:none; border:1px solid #393332; box-sizing:border-box; position:relative; transition:.3s;}
nav .inner .area-01 .btn a p{ font-size:14px; font-weight:500; color:#fff; transition:.3s;}
nav .inner .area-01 .btn a:hover{ background:#fff; border:1px solid #f93b1d; opacity:1;}
nav .inner .area-01 .btn a:hover p{ color:#f93b1d;}


/*▼▼▼スクロールでふわっと表示▼▼▼*/

/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.up {
  transition-timing-function: cubic-bezier(.64,.04,.35,1);
  transition: 0.6s ease-in-out;
  transform: translateY(60px);
  opacity: 0;
  transition-delay:0.6s; /* 閉じるときは遅延 */
}
.up.on2 {
  transform: translateY(0);
  opacity: 1.0;transition-delay: 0s; /* 開いたときは遅延なし */
}

.up.ntime.on2{ transition-delay:0.2s;}
.up.ntime2{ transition-delay:0.4s;}
.up.ntime3{ transition-delay:0.48s;}
.up.ntime4{ transition-delay:0.56s;}
.up.ntime5{ transition-delay:0.64s;}
.up.ntime6{ transition-delay:0.72s;}
.up.ntime7{ transition-delay:0.80s;}
.up.ntime8{ transition-delay:0.88s;}
.up.ntime9{ transition-delay:0.96s;}
.up.ntime10{ transition-delay:1.04s;}
.up.ntime11{ transition-delay:1.12s;}
.up.ntime12{ transition-delay:1.20s;}
.up.ntime13{ transition-delay:1.50s;}



/*============
メニュー（3本線）
.toggle_btn
=============*/
.toggle_btn {
  display: block;
  position: fixed;
  top:20px;
  right:20px;
  width:40px;
  height:40px;
  transition: all .5s;
  cursor: pointer;
  z-index:99;
}
.toggle_btn.on2{ 
  transition:1s;
  opacity:1;
  }
.toggle_btn span {
  display: block;
  position: absolute;
  left:0px;
  width:30px;
  height:3px;
  background:#333;
  border-radius:10px;
  transition: all .5s;
}
.toggle_btn span:nth-child(1) {
  top:0px;
}
.toggle_btn span:nth-child(2) {
  top:10px;
}
.toggle_btn span:nth-child(3) {
  top:20px;
}

.open .toggle_btn span {
}
.open .toggle_btn span:nth-child(1) {
  -webkit-transform: translateY(14px) rotate(-45deg);
  transform: translateY(14px) rotate(-45deg);
}
.open .toggle_btn span:nth-child(2) {
  opacity:0;
  -webkit-transform: translateX(20px);
  transform: translateX(20px);
  }
.open .toggle_btn span:nth-child(3) {
  -webkit-transform: translateY(-14px) rotate(45deg);
  transform: translateY(-14px) rotate(45deg);}

