@charset "utf-8";

/*
Theme Name: footer
*/

/* ************************************************ 
*	フッター
* ************************************************ */
#footer {
clear:both;
width:100%;
margin: 0;
padding: 200px 0 100px 0;
position : relative;
}
#footer .row{
margin-bottom: 0px;
}
.footer-inner {
margin: 0 auto;
width: 90%;
padding: 0;
position:relative;
z-index:0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.footer-logobox {
width: 30%;
margin: 0;
padding: 0;
}
.footer-logobox .footer-logo{
padding: 0 0 50px 0;
}
.footer-logobox .footer-logo img{
vertical-align: bottom;
width: 200px;
}

p.footer-tel{
font-size: min(2.7vw,24px);
color: #000;
margin: 0 0 0 5px;
padding: 0;
}
p.footer-tel::before{
position:relative;
top: -1px;
left: -5px;
content:"";
display:inline-block;
width:15px;
height:15px;
background:url("../od/images/icon_tel_bk.svg") no-repeat;
background-size:contain;
}
p.footer-name{
font-size: min(1.8vw,16px);
color: #000;
margin: 0 0 50px 0;
padding: 0;
}

#copyright {
width: 90%;
margin: 0 auto;
padding: 0;
font-size: min(1.3vw,13px);
line-height: 1.5;
color:#000;
}
#copyright a{
color:#000;
text-decoration:none;
}
#copyright a:hover {
color: #000;
}


.footer-navbox {
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: center;
}


ul.footer-nav-menu {
margin: 0;
padding: 0;
}

.footer-nav-menu li {
font-weight: 400;
display: inline-block;
position: relative;
margin: 0 0 0 30px;
padding: 0;
float: left; 
text-align:center;
letter-spacing: normal; /* 隙間を埋める追加 */
cursor: pointer;
cursor: hand;
}

.footer-nav-menu li a {
color: #656565;
display: block;
font-size: min(1.6vw,15px);
text-decoration: none;
margin: 0;
padding: 0;
letter-spacing: 0.1em;
}

.footer-nav-menu li a:after {
content: '';
width: 0;
transition: all 0.3s ease;
border-bottom: 1px solid #000;
display: block;
padding-bottom:15px;
}
.footer-nav-menu li a:hover:after {
width: 100%;
}

.footer-nav-menu li:hover > a,
.footer-nav-menu li a:hover {
color: #000;
}



/* ************************************************ 
*	レスポンシブ
* ************************************************ */
/* PC 画面の横幅が1160px以上 */
@media only screen and (min-width: 1160px) {
}


/* Tablet (Portrait) 画面の横幅が768px〜1159pxまで */
@media only screen and (min-width: 768px) and (max-width: 1159px) {
#footer {
padding: 125px 0 50px 0;
}
.footer-nav-menu li {
margin: 0 0 0 15px;
}
}


/* Mobile (Portrait) 画面の横幅が767pxまで */
@media only screen and (max-width: 767px) {
#footer { padding: 75px 0 50px 0; }
.footer-inner {
margin: 0 auto;
width: 90%;
}
.footer-logobox {
width: 100%;
margin: 0 0 30px 0;
padding: 0;
}
.footer-navbox-wrap { width: 100%; }
.footer-navbox {
display: none;
}
p.footer-name { font-size: 4.25vw; }
p.footer-tel { font-size: 5vw; }
#copyright {
font-size: 3vw;
}
}