@charset "utf-8";

/* フッター部分
------------------------------- */
/* 小見出し */	

h6 {font-family: "M PLUS 1p";
    position: relative;
    padding: 5px 5px 3px 10px;
	border-width: 0px 0px 1px 0px;
	border-style: solid;
	border-color: #4C4948;
	font-weight: 800;
    font-size: 24px;
	letter-spacing: 0.12rem;
	margin-top: 0px;
	margin-bottom: 40px;
	margin-left: auto;
	margin-right: auto;
	color: #000;
	max-width: 1100px;
	text-align: left;
	line-height: 1.2;
	padding-bottom: 10px
}

h6:before,
h6:after {
    position: absolute;
    top: 100%;
    left: 30px;
    height: 0;
    width: 0;
    border: solid transparent;
    content: "";
}

h6:before {
    margin-left: -12px;
    border-color: transparent;
    border-top-color: #4C4948;
    border-width: 8px;
}

h6:after {
    margin-left: -10px;
    border-color: transparent;
    border-top-color: white;
    border-width: 6px;
}

footer {
    background-color: #06B4EA;
	font-family: "M PLUS 1p";
}
.f_wrapper {
    margin: 0 auto; 
	position: relative
}
.footlogo {
	width: 230px;
    text-align: left;
    padding-bottom:30px;
}
.foot {
margin-bottom: 0;
}
.foot p{
text-align: left;
color: #fff;
font-weight: 400;
font-size: 15px;
letter-spacing: 0.25em;
line-height: 1.8
}
.more{margin-bottom: 0;
}
.more a{
display: inline-block;
font-family: 'Oswald', sans-serif;
font-size: 14px;
color: #fff;
letter-spacing: 0.25em;
background-color:  rgba(76, 73, 62, 1.0);
padding: 3px 0px 3px 15px;
margin: 10px 0px 0px 0px; 
	width: 90px
}
.more a::after{
content: '\f061';
font-family: "Font Awesome 5 Free";
padding-left: 5px;
font-weight: 600;
/*アニメーションの指定*/
transition: all .3s;
}
.more a:hover::after{
padding-left: 20px;
transition: all .3s;
}
.more a:hover{
transition: all .3s; 
background-color: crimson
}

.tel-f{
display: inline-block;
font-size: 15px;
color: #fff;
letter-spacing: 0.25em;
}

.tel-f:hover{
transition: all .3s; 
color: #fff;
}

/* ©部分 */
.copy {
    color: #fff;
    font-size: 15px;
	text-align: left;
	padding-top: 50px;
	margin-bottom: 0;
	letter-spacing: 0.1em
}
/* ########### 666px以下 ########### */
@media screen and (max-width: 666px) {
/* SNSナビ部分 */		
.sns{
	position: absolute;
    margin: 0 auto; 
	background-color:  rgba(76, 73, 62, 0.85);
	width: 100%;
	height: 75px;
	top:-125px
}
.sns ul{display: flex;
justify-content: space-between;
line-height: 70px; 
padding-left: 4%;
padding-right: 4%;
margin: 0 auto;	
}
.sns li{ width: 200px; 
	margin: 0 auto;	
}
.sns a{
font-family: 'Oswald', sans-serif;
font-size: 16px;
color: #fff;
letter-spacing:0.05rem    
}
.sns img{
width: 30px;
margin-right: 12px
}
.sns a::after {
content: '\f061';
font-family: "Font Awesome 5 Free";
padding-left: 5px;
font-weight: 600;
transform: rotate(45deg);
/*アニメーションの指定*/
transition: all .3s;
}
.sns a:hover::after{
padding-left: 20px;
transition: all .3s;
}
.sns a:hover{
opacity: 0.6;
transition: all .3s;
}		
}
/* ########### 833px以下 ########### */
@media screen and (max-width: 833px) {
footer {
	padding-top:80px;
	padding-bottom:75px;
}
.f_wrapper
	{max-width: 92%;}
.f-contents{
	display: block;
	margin-bottom: 0px;
	}
.foot01{width: 100%;}
.foot02{width: 100%;
}
/* 個人情報・サイトマップ部分 */
.other{
margin-top: 20px
}
.other ul{
display: flex;
justify-content: flex-start;
}
.other li{
margin-right: 50px
}
.other li a{
font-size: 14px;
color: #fff;
letter-spacing:0.1rem
}
.other li a:hover{
transition: all .3s; 
color: crimson
}
}
/* ########### 667pxから834pxまで ########### */
@media screen and (min-width: 667px) and (max-width: 833px) {

/* SNSナビ部分 */	
.sns{
	position: absolute;
    margin: 0 auto; 
	background-color:  rgba(76, 73, 62, 0.85);
	width: 100%;
	height: 75px;
	top:-125px
}
.sns ul{display: flex;
justify-content: space-between;
line-height: 70px; 

padding-left: 6%;
padding-right: 6%;
margin: 0 auto;	
}
.sns li{ width: 300px; 
	margin: 0 auto;	
}
.sns a{
font-family: 'Oswald', sans-serif;
font-size: 22px;
color: #fff;
letter-spacing:0.2rem    
}
.sns img{
width: 50px;
margin-right: 16px
}
.sns a::after {
content: '\f061';
font-family: "Font Awesome 5 Free";
padding-left: 5px;
font-weight: 600;
transform: rotate(45deg);
/*アニメーションの指定*/
transition: all .3s;
}
.sns a:hover::after{
padding-left: 30px;
transition: all .3s;
}
.sns a:hover{
opacity: 0.8;
transition: all .3s;
}	
}	 

/* ###########834px以上########### */
@media screen and (min-width:834px) { 
footer {
	padding-top:80px;
	padding-bottom:10px;
}
.f-contents{
	display: flex;
    justify-content: space-between;
	margin-bottom: 0px;
	}
.foot01{width: 50%;}
.foot02{width: 50%;}
/* 個人情報・サイトマップ部分 */
.other ul{
display: flex;
justify-content: flex-end;
text-align: right;}

.other li{
margin-left: 50px
}

.other li a{
font-size: 14px;
color: #fff;
letter-spacing:0.1rem
}
.other li a:hover{
transition: all .3s; 
color: crimson
}
/* SNSナビ部分 */	
.sns{
	position: absolute;
    margin: 0 auto; 
	background-color:  rgba(76, 73, 62, 0.85);
	width: 100%;
	height: 90px;
	top:-125px
}
.sns ul{display: flex;
justify-content: space-between;
line-height: 90px; 
padding-left: 6%;
padding-right: 6%;
margin: 0 auto;	
}
.sns li{ width: 300px; 
margin: 0 auto;	
}
.sub-nav a{
padding-top: 10px;
padding-bottom: 10px;
}
.sns a{
font-family: 'Oswald', sans-serif;
font-size: 22px;
color: #fff;
letter-spacing:0.2rem    
}
.sns img{
width: 50px;
margin-right: 16px
}
.sns a::after {
content: '\f061';
font-family: "Font Awesome 5 Free";
padding-left: 5px;
font-weight: 600;
transform: rotate(45deg);
/*アニメーションの指定*/
transition: all .3s;
}
.sns a:hover::after{
padding-left: 30px;
transition: all .3s;
}
.sns a:hover{
opacity: 0.8;
transition: all .3s;
}	
}
/* ########### 834pxから1199pxまで ########### */
@media screen and (min-width: 834px) and (max-width: 1199px) {
.f_wrapper
	{max-width: 90%;}
}
/* ########### 1200px 以上 ########### */
@media screen and (min-width:1200px) {
.f_wrapper
	{max-width: 1100px;}
}