/* =========================
  FOOTER
========================= */
.footer{
position: relative;
overflow:hidden;
margin-top:15rem;
padding:10rem 0 10rem 0;
border:0px #0000FF solid;
background: url("../image/bg4.png") no-repeat center / cover;
}

.footer footer{
display: grid;
grid-template-columns: 3fr 7fr;
grid-template-areas: "col1 col2";
gap: 2.5rem;
width:85%;
margin:0 auto;
}

.footer .col1{ grid-area: col1; }
.footer .col2{ grid-area: col2; }

/* ============= */
@media (max-width: 767px){
.footer footer{
grid-template-columns: 1fr;
grid-template-areas:
"col2"
"col1";
}
}


/* =========================
  左カラム
========================= */
.footer .col1{
display: flex;
flex-direction: column;
}

.footer .col1 .logo{
width:70%;
}
.footer .col1 .address{
align-self: flex-start;  /* 上寄せ */
}

.footer .col1 .address{
padding:2rem 0 6rem 0;
border:0px #FF0000 solid;
}

.footer .col1 .sns{
margin-top: auto;  /* 下寄せ */
display: flex;
gap: 2rem;
	
opacity: 0;
pointer-events: none;
cursor: default;
visibility: hidden;
}

.footer .col1 .sns a{
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
}

.footer .col1 .sns img{
width: auto;
height: 2.2rem;
display: block;
}

/* ============= */
@media (max-width: 767px){
.footer .col1{
border:0px #FF0000 solid;
text-align:center;
}
.footer .col1 .logo{
width:50%;
margin:0 auto;
}
.footer .col1 .address{
padding:2rem 0 6rem 0;
width:100%;
}
.footer .col1 .sns{
margin:0 auto;
padding:0 0 3rem 0;
gap: 2rem;
}

}


/* =========================
  右カラム
========================= */
.footer .col2{
display: flex;
flex-direction: column;
}

.footer .col2 .nav{
padding: 2rem 0 3rem;
position: relative;
border:0px #FF0000 solid;
}

.footer .col2 .nav::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 2px;
background-image: radial-gradient(circle, #DFBE91 1px, transparent 1.5px);
background-size: 6px 2px;
background-repeat: repeat-x;
}

/* nav：横並び + 装飾なし */
.footer .col2 .nav ul{
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
gap: 1.2rem 3rem;
}

.footer .col2 .nav a{
color: inherit;
position: relative;
padding-left: 1.6rem; 
display: inline-flex;
align-items: center;
}

/* リンク文字の頭に丸チョボ */
.footer .col2 .nav a::before{
content: "";
width: .8rem;
height: .8rem;
border-radius: 999px;
background: #FDAAB2;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}

/* contact：tel と mail を横並び */
.footer .col2 .contact{
display: flex;
align-items: center;
gap:1.4rem;
flex-wrap: wrap;
padding:4rem 0 1rem 0;
}

/* tel */
.footer .col2 .tel a{
dispaly:block;
color: inherit;
text-decoration: none;
position: relative;
padding-left: 3rem;
border:0px #FF0000 solid;
font-family: "Inter", system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
font-weight: 700;
letter-spacing: .02em;
font-size:3rem;
line-height:1;
}

.footer .col2 .tel a::before{
content: "";
width: 2.5rem;
height: 2.5rem;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
background: url("../image/icon-tel.png") no-repeat center / contain;
border:0px #FF0000 solid;
}

.footer .col2 .tel p{
border:0px #FF0000 solid;
margin-top:1rem;
line-height:1;
}

.footer .tel .fax {
margin-left: 0.5em;
}

/* mail */
.footer .col2 .mail a{
display: inline-flex;
align-items: center;
gap: .6rem;
padding: 1.4rem 4rem 1.4rem 8rem;
margin-bottom:2rem;
border-radius: 999px;
background: #fff;
border: 2px solid #FDAAB2;
color: #FDAAB2;
text-decoration: none;
position: relative;
font-weight:700;
transition:.3s;
}

.footer .col2 .mail a::before{
content: "\e158";
font-family: 'Material Icons';
font-weight: 400;
font-style: normal;
font-size: 2.3rem;
line-height: 1;
position: absolute;
left: 4rem;
top: 50%;
transform: translateY(-50%);
}

/* hover */
.footer .col2 .mail a:hover {
background: #FEAAB2;
color: #FFF;
border:2px #FEAAB2 solid;
}

.footer .col2 .mail a:hover::after{
background: #FAABB1;
color:#FFF;
}

/* ============= */
@media (max-width: 767px){
.footer .col2{
text-align:center;
}
.footer  .col2 .nav{
padding-top: 0;
}
.footer .col2 .nav ul{
justify-content: center;
border:0px #FF0000 solid;
}
.footer .col2 .contact{
display: flex;
align-items: center;
justify-content: center;
padding:6rem 0 3rem 0;
}
.footer .col2 .mail{
padding-top:2rem;
}
}

/* ============= */
@media (max-width: 400px){
.footer .col2 .mail a{
padding: 1.4rem 2rem 1.4rem 4rem;
}
.footer .col2 .mail a::before{
left: 1.5rem;
}
}


/* =========================
  右copyright
========================= */
.footer .copyright{
display: grid;
grid-template-columns: 3fr 7fr;
gap: 2.5rem;
width:85%;
margin:-2rem auto 0 auto;
pointer-events:none;
}

.footer .copyright span{
opacity: .75;
font-size: 1.2rem;
border:0px #FF0000 solid;
}

/* ============= */
@media (max-width: 767px){
.footer .copyright{
grid-template-columns: 1fr;
text-align:center;
}
}


