@charset "UTF-8";


/* discription */

#container footer h2.discription .discription.company{
	display: block;
	margin-bottom: 12px;
	font-size: 0.8rem; 
	font-family: var(--font-got-jp);
	font-family: var(--font-sub-alp);
}

#mainContents footer h2.discription .works{
	display: block;
	margin-bottom: 8px;
}

#mainContents footer h2.discription .address{
	text-decoration:none;
	font-style:normal;

}

#mainContents footer h2.discription{
	margin-bottom: 12px;
	text-align: center;
	font-size: 0.7rem; 
	line-height: 0.84rem;
	font-weight: 100;
}

#mainContents>footer {
	padding: 8px  0 12px;
	width: 100%;
	box-sizing: border-box; 
}

#mainContents>footer>nav {
	margin-bottom: 12px;
}

#mainContents footer nav a em{
	font-style: normal;
	font-size: 12px;
}


#mainContents>footer p.cp {
  text-align: center;
  font-size: 10px; 
  line-height: 14px;
}

#mainContents #footerNav {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	margin-bottom: 0; 
}

#mainContents #footerNav li {
	margin-right: 0;
	padding: 0px 4px;
	height: 18px;
	border-right: #999999 solid 1px; 
}
	
#mainContents #footerNav li:last-child {
	margin: 0;
	padding: 0;
	border: 0; 
  }

#mainContents #footerNav a{
    
	display: block;
	margin-bottom: 12px;
	padding: 0px 4px;
	height: 100%;
	font-family: var(--font-sub-alp);
	font-size: var(--fontsize-1);
	font-size: 12px;
	line-height: 1.6;
}
	
	
#mainContents #footerNav a, 
#mainContents #footerNav a:link, 
#mainContents #footerNav a:visited 
{
	color: #f3f3f3;
}
	
#mainContents #footerNav li:last-child{
	border: none;
}

#mainContents #footerNav a:hover{
	color: #fff;
	border-radius: 2px;
	background: rgba(212, 218, 225, 0.6);
}

#snsBox {
  display: flex;
  flex-flow: row wrap;
  /*並びの方向　折り返しのありなし*/
  -webkit-justify-content: center;
  /*並び方の配置規則*/
  justify-content: center;
  /*並び方の配置規則*/
  margin-bottom: 20px; 
  
  }

#mainContents>footer #snsBox a {
  display: table;
  margin-right: 8px;
  width: 28px;
  height: 28px;
  color: #fff;
  border-radius: 50%; 
  box-sizing: content-box;
  box-shadow: 0 0px 4px 2px rgba(255,255,255,0.2);
 }

#mainContents>footer #snsBox a i {
  display: table-cell;
  vertical-align: middle;
  text-align: center; }


#mainContents>footer #snsBox a:last-child {
  margin-right: 0; }

/* SNS +++++++++++++++++++++++++++++++++++++++ */
#mainContents>footer #snsBox a {
  position: relative;
  z-index: 8;
  display: table;
  width: 20px;
  height: 20px;
  background: #8d8d8d;
  border-radius: 50%; }

#mainContents>footer #snsBox a.facebook {
  background-image: url("/assets/svg/facebook.svg");
  background-size: 32%;
  background-position: center;
  background-repeat: no-repeat; 
  }

#mainContents>footer #snsBox a.twitter {
  background-image: url("/assets/svg/twitter.svg");
  background-size: 56%;
  background-position: center;
  background-repeat: no-repeat; }

#mainContents>footer #snsBox a.instagram {
  background-image: url("/assets/svg/instagram.svg");
  background-size: 56%;
  background-position: center;
  background-repeat: no-repeat; }

#mainContents>footer #snsBox a.line {
  background-image: url("/assets/svg/line.svg");
  background-size: 64%;
  background-position: center;
  background-repeat: no-repeat; }

#mainContents>footer p {
  font-size: 0.7rem; }
  
 #mainContents>footer #snsBox.mono a {
  background-color: #424251;
 }

/* Coloring */
#mainContents>footer #snsBox.color a#fb {
  background-color: #1877f2; }

#mainContents>footer #snsBox.color a#tw {
  background-color: #1DA1F2; }

#mainContents>footer #snsBox.color a#in {
  background-color: #f50000;
  background-image: linear-gradient(-135deg, #1400c8, #b900b4, #f50000); }

#mainContents>footer #snsBox.color a#li {
  background: #00b900 url("https://cdn.studio-happyvalley.com/svg/line.svg") no-repeat center; }


@media only screen and (max-width: 768px) {
	
	#mainContents #footerNav li {
		display: inline-block;
		margin-right: 0;
		padding: 0;
		height: .8rem;
		margin-bottom: 0;
		box-sizing: content-box;
	}
	
	#mainContents footer h2.discription .discription.company {
		margin-bottom: 8px;
	}	
	
	#mainContents footer h2.discription .discription.company i.kana{
		font-size: .9rem;
	}	
	
	#mainContents footer h2.discription .works {
		margin-bottom: 16px;
	}	

	#mainContents>footer{
		padding: 8px;
		box-sizing: border-box;
	}
	
	#mainContents #footerNav a {
		display: block;
		font-size: .7rem;
		line-height: .8rem;
	}

	#mainContents>footer ul{
		flex: 0 0 auto;
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-content: center;
		align-items: center;
	}

	#mainContents>footer p a,
	#mainContents>footer p a:visited,
	#mainContents>footer p a:link 
	{
		margin: 0 auto;
		width: auto;
		font-size: 10px;
		line-height: 12px; 
	}

	#mainContents footer h2.discription .address {
		text-decoration: none;
		font-style: normal;
		font-size: .7rem;
		line-height: .88rem;
	}

	#mainContents>footer p.cp
	{
		font-size: 10px;
		margin: 0 auto;
		text-align: center;
		width: 100%; 
	}

	#mainContents>footer ul,
	#mainContents>footer p 
	{
		margin: 0 auto;
		text-align: center;
		width: 100%; 
	} 

	#mainContents #footerNav {
		margin-bottom: 0; 
	 }

	#mainContents>footer nav,
	#mainContents>footer h2.discription{
		margin-bottom: 20px;
	}
	
}

  

@media only screen and (max-width: 374px) {
	
#mainContents>footer {
	padding: 8px  8px 12px;
	width: 100%;
	box-sizing: border-box; 
}

#mainContents footer h2.discription .discription.company {
	margin-bottom: 24px;
}

}