@charset "utf-8";
/* CSS Document */
/* ================================
   モバイルファースト化された header スタイル
================================== */
:root {
  --header-height-mobile: 70px;
  --header-height-pc: 70px;
  --primary-color: #000;
  --font-color: #333;
}
.contents{
	max-width: 600px;
	margin: auto;
}
.pt{
  font-family: "Poppins", sans-serif;
}
/*
main{
    margin: 70px auto 0 !important;
}
*/
.logo-b {
	display: none;
}
/* 基本構造（モバイル基準） */
/*
header{
  position: fixed;
  left: 50%;
  top: 0%;
  transform: translateX(-50%)
}
*/

header #outer {
  width: 100%;
  height: var(--header-height-mobile);
  /*position: fixed;
  top: 0;*/
  z-index: 1000;
  background: #000;
}

header #outer .logo {
  width: 100%;
  height: var(--header-height-mobile);
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

header #outer .logo .logo-title {
	width: 40%;
	padding: 10px;
}
header #outer .logo .logo-title img{
	width: 90%;
}
header #outer .logo .line-t{
	width: 60%;
}
header #outer .logo .line-t a{
	background: #A3FF34;
	padding: 27px;
}
header #outer .logo .line-t img{
	width: 70%;
}

header #outer .TelContact {
  display: none;
}

header #outer .menuOpener {
  display: none;
}

/* メニュー開閉ボタン（スマホ） */
#navToggle {
  position: absolute;
  right: 0;
  top: 0;
  width: 70px;
  height: 70px;
  cursor: pointer;
  z-index: 101;
  background: var(--primary-color);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#navToggle span {
  display: block;
  height: 3px;
  width: 30px;
  background: #fff;
  margin: 7px 0;
  transition: 0.35s ease-in-out;
}

#navToggle .menu-label {
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  color: #fff;
  margin: 3px 0 0; 
  line-height: 1;
}

#navToggle.active span:nth-child(1) {
  transform: translateY(14px) rotate(-45deg);
}

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

#navToggle.active span:nth-child(3) {
  transform: translateY(-6px) rotate(45deg);
}

/* メニュー展開アニメーション */
header #outer .menuOpener.active {
  display: block;
  animation: zoomin 0.5s ease;
  width: 100%;
  height: 100vh;
  background: var(--primary-color);
  position: absolute;
  top: var(--header-height-mobile);
  left: 0;
  padding: 6vw 4vw 0;
  font-weight: bold;
}

header #outer .menuOpener ul li {
  font-size: 1.6rem;
  border-bottom: 1px solid #fff;
}
header #outer .menuOpener ul li:last-child{
  border-bottom: none;	
}

header #outer .menuOpener ul li a {
  width: 100%;
  padding: 14px;
  color: #fff;
  text-align: center;
  font-weight: bold;
}
.arrow{
}

.arrow::after{
  content: '';/*何も入れない*/
  display: inline-block;
  width: 20px;/*画像の幅*/
  height: 20px;/*画像の高さ*/
  background-image: url(../img/icon.png);
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 20px;
  right: 10%;
}


/*
header #outer .menuOpener ul li a:hover {
  background: #fff;
  width: 100%;
  padding: 14px;
  color: var(--font-color);
}
*/
/* アニメーション */
@keyframes zoomin {
  0% {
    opacity: 0;
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.footer{
    background: #fff;
}
.footer_menu p{
	text-align: center;
	padding: 20px 0;
	font-size: 20px;
}
.footer .sns li{
	width: 40px;
	margin: 0 14px;
}
#copyright{
	text-align: center;
	margin: 20px 0 0;
	padding: 0 0 20px;
	font-size: 15px;
}


/* ===============================
   レスポンシブ：768px以上（タブレット）
================================== */
@media (min-width: 768px) {
	header #outer .logo .line-t a{
		padding: 24px;
	}
}
/* ===============================
   レスポンシブ：992px以上（ノートPC以上）
================================== */
@media (min-width: 1100px) {
	.logo-b {
		display:block; 
		position: fixed;
		top: 10px;
		left: 10px;
		width: 200px;  
	}
header #outer .menuOpener ul li {
  font-size: 1.8rem;
}

}