@charset "utf-8";

/**
FOOTER
**/
#footer {
	position: relative;
	z-index: 1;
    .footer_contact {
        .footer_contact_inner {
            width:100%;
            max-width:1300px;
            margin:0 auto;
            padding:20px;
            background: #F47325;
            background: linear-gradient(to right bottom ,rgba(244, 115, 37, 1) 0%, rgba(251, 194, 38, 1) 70%, rgba(246, 169, 77, 1) 100%);
            .contact_box {
                background-color:rgba(255,255,255,.9);
                box-shadow:0 3px 6px rgba(0,0,0,.15);
                padding:50px 70px 70px;
				display:grid;
				justify-items:center;
                h2 {
                    font-size:2.0rem;
                    margin-bottom:1.5em;
                    display:grid;
                    grid-template-columns:repeat(3,auto);
                    grid-column-gap:1em;
                    align-items:center;
                    justify-content:start;
                    .font_en {
                        font-size:6.0rem;
                        letter-spacing:.05em;
                    }
                    .txt {
                        color:#999999;
                        &::before {
                            content:'ー';
                            margin-right:.25em;
                        }
                    }
                    img {
                        width:8em;
                    }
                }
                p {
                    line-height:1.5;
                    margin-bottom:3em;
                }
                ul {
                    display:grid;
                    grid-template-columns:1fr;
					width:100%;
                    li {
                        display:grid;
                        justify-items:center;
                        align-content:start;
                        h3 {
                            font-size:2.0rem;
                            font-weight:600;
                            text-align:center;
                            margin-bottom:1em;
                        }
                        &.tel {
                            a {
                                font-size:6.0rem;
                                font-weight:600;
                                display:grid;
                                grid-template-columns:.8em auto;
                                justify-content:center;
                                align-items:center;
                                grid-column-gap:.33em;
                            }
                            & > span {
                                font-size:2.0rem;
                                padding-top:1em;
                            }
                        }
                        &.mail {
            				a {
                                width:100%;
            					max-width:400px;
            					height:100px;
            					font-size:1.6rem;
            					font-weight:600;
            					color:#FFFFFF;
            					display:grid;
            					grid-template-columns:2.4em auto;
            					grid-column-gap:1em;
            					align-items:center;
            					justify-content:center;
            					border-radius:50px;
            					background: #F47325;
            					background: linear-gradient(to right ,rgba(244, 115, 37, 1) 0%, rgba(251, 194, 38, 1) 70%, rgba(246, 169, 77, 1) 100%);
            					& > span {
            						display:grid;
            						grid-row-gap:.4em;
            						.font_en {
            							font-size:3.0rem;
            							letter-spacing:.05em;
            						}
            					}
                            }
                        }
                    }
                }
            }
        }
    }
    .footer {
        padding-top:90px;
        background:url(../img/common/footer.png) no-repeat center bottom/100% 5px;
        margin-bottom:30px;
        .footer_inner {
            width:calc(100% - 60px);
            max-width:1100px;
            margin:0 auto;
            .logo {
                margin-bottom:50px;
                img {
                    display:block;
                    max-width:145px;
                }
            }
            .menu-fmenu-container {
                padding-bottom:90px;
                .menu {
                    display:grid;
                    font-size:1.2rem;
                    grid-template-columns:repeat(6,auto);
                    align-items:start;
                    justify-content:space-between;
                    & > li {
                        & > a {                            
							position:relative;
							display:grid;
							grid-row-gap:.5em;
							font-weight:600;
                            color:#777777;
							.font_en {
								font-size:1.6rem;
								letter-spacing:.05em;
                                color:#333333;
							}
							&::after {
								content:'';
								width:5px;
								height:5px;
								background-color:var(--color_active);
								border-radius:50%;
								display:block;
								position:absolute;
								left:50%;
								bottom:-1em;
								transform:translate(-50%,.0);
								transition:.3s;
								opacity:0;
								pointer-events:none;
							}
						}
						&.current-menu-item {
							& > a {
								color:var(--color_active);
                                .font_en {
    								color:var(--color_active);
                                }
								&::after {
									opacity:1;
								}
							}
                        }
                        &:last-child {
                            grid-area: 2/6/3/7;
                            margin-top:-6em;
                        }
                    }
                    .sub-menu {
                        padding-top: 1.25em;
                        padding-left:.25em;
                        display:grid;
                        grid-row-gap:.5em;
                        font-size:1.4rem;
                        li {
                            a {
                                color:#999999;
                                font-weight:500;
                                &::before {
                                    content:'-';
                                    margin:0 .33em;
                                }
                            }
                        }
                    }
                }
            }
            .footer_menu {
                display:grid;
                grid-template-columns:1fr auto 1fr;
                align-items:center;
                padding:40px 0;
                border-top:1px solid #CCCCCC;
                .menu-fmenu2-container {
                    .menu {
                        display:flex;
                        font-size:1.2rem;
                        align-items:center;
                        li {
                            &:not(:last-child) {
                                margin-right:.5em;
                                padding-right:.5em;
                                border-right:1px solid #333333;
                            }
                        }
                    }
                }
    			.sns {
    				display:grid;
    				grid-template-columns:repeat(2,auto);
    				align-items:center;
    				justify-content:center;
    				grid-column-gap:20px;
    				a {
    					img {
    						display:block;
    						width:20px;
    					}
    				}
    			}
                .copy {
                    font-size:1.2rem;
                    justify-self:end;
                }
            }
        }
    }
}

@media (hover:hover) {

	#footer {
	    .footer_contact {
	        .footer_contact_inner { .contact_box {
	                ul {
	                    li {
	                        &.mail {
	            				a {
									&:hover {
										opacity:1;
										filter:brightness(1.2);
									}
	                            }
	                        }
	                    }
	                }
	            }
	        }
	    }
	    .footer {
	        .footer_inner {
	            .menu-fmenu-container {
	                .menu {
	                    & > li {
	                        & > a {
								&:hover {
									opacity:1;
									color:var(--color_active);
									transition:.3s;
									.font_en {
										color:var(--color_active);
										transition:.3s;
									}
									&::after {
										opacity:1;
									}
								}
							}
	                    }
	                }
	            }
			}
	    }
	}
    
}

@media screen and (max-width:1200px) {

}

@media screen and (max-width:1024px) {

    /**
    FOOTER
    **/
	#footer {
	    .footer_contact {
	        .footer_contact_inner {
	            .contact_box {
	                padding:50px 50px 70px;
	            }
	        }
	    }
	    .footer {
	        .footer_inner {
	            width:calc(100% - 50px);
	            .menu-fmenu-container {
	                padding-bottom:90px;
	                .menu {
	                    font-size:1.1rem;
	                    & > li {
	                        & > a {
								.font_en {
									font-size:1.5rem;
								}
							}
	                    }
	                    .sub-menu {
	                        font-size:1.3rem;
	                    }
	                }
	            }
	            .footer_menu {
	                grid-template-columns:1fr;
					grid-row-gap:30px;
					.menu-fmenu2-container {
						justify-self:center;
						order:1;
					}
	                .copy {
	                    justify-self:center;
						order:2;
	                }
	            }
	        }
	    }
	}
    
}

@media screen and (max-width:768px) {

	/**
	FOOTER
	**/
	#footer {
	    .footer_contact {
	        .footer_contact_inner {
					.contact_box {
	                padding:30px 20px;
	                h2 {
	                    font-size:1.6rem;
						width:100%;
						max-width:18em;
	                    grid-template-columns:1fr;
	                    .font_en {
	                        font-size:4.0rem;
	                    }
	                    .txt {
							justify-self:end;
	                    }
	                    img {
	                        width:10em;
	                    }
	                }
	                p {
						font-size:1.5rem;
	                    margin-bottom:2em;
	                }
	                ul {
	                    li {
	                        h3 {
	                            font-size:min(4.8vw,1.6rem);
	                            font-weight:600;
	                            text-align:center;
	                            margin-bottom:1em;
	                        }
	                        /* &.tel {
	                            a {
	                                font-size:6.0rem;
	                                font-weight:600;
	                                display:grid;
	                                grid-template-columns:.8em auto;
	                                justify-content:center;
	                                align-items:center;
	                                grid-column-gap:.33em;
	                            }
	                            & > span {
	                                font-size:2.0rem;
	                                padding-top:1em;
	                            }
	                        } */
	                        &.mail {
	            				a {
	            					height:80px;
	            					border-radius:40px;
	                            }
	                        }
	                    }
	                }
	            }
	        }
	    }
	    .footer {
	        padding-top:60px;
	        margin-bottom:6px;
	        .footer_inner {
	            width:calc(100% - 40px);
	            .logo {
	                img {
						margin:0 auto;
	                }
	            }
	            .menu-fmenu-container {
	                padding-bottom:30px;
					max-width:400px;
					margin:0 auto;
	                .menu {
	                    grid-template-columns:repeat(2,auto);
	                    justify-content:space-around;
						grid-row-gap:3em;
	                    & > li {
	                        & > a {
								.font_en {
									font-size:1.6rem;
								}
								&::after {
									left:2.5em;
									transform:translate(0);
								}
							}
	                        &:last-child {
	                            grid-area:4/2/5/3;
								margin-top:-9em;
	                        }
	                    }
	                    .sub-menu {
	                        font-size:1.4rem;
	                    }
	                }
	            }
	            .footer_menu {
	                padding:30px 0 50px;
	                .menu-fmenu2-container {
	                    .menu {
	                        font-size:min(3vw,1.1rem);
	                    }
	                }
	                .copy {
	                    font-size:1.2rem;
	                }
	            }
	        }
	    }
	}

}