@charset "UTF-8";

/* ============================= FOOTER STYLE4 ============================= */
.footer /*{position: absolute; bottom: 0; z-index: 1; */position:relative;z-index:1;width: 100%; border-top:1px solid var(--colorLightGray)}
.footer .container {}
.footer .ft_top { border-bottom: 1px solid var(--colorLightGray);border-top:1px solid var(--colorLightGray)}

.footer .ft_top .box {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display:flex;justify-content:space-between; align-items: center;}
.footer .ft_top .box .ft_list > .list {font-size: 0;}
.footer .ft_top .box .ft_list > .list > li {display: inline-block; position: relative; margin: 0 0 0 21px; padding: 0 0 0 21px; }
.footer .ft_top .box .ft_list > .list > li:before {content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 1px; height: 12px; background-color: #ccc;}
.footer .ft_top .box .ft_list > .list > li:first-child {margin: 0; padding: 0;}
.footer .ft_top .box .ft_list > .list > li:first-child:before {display: none;}
.footer .ft_top .box .ft_list > .list > li > a {display: block; font-weight: 400; font-size: 16px; line-height: 24px; color:var(--colorBlack2);}
.footer .ft_top .box .ft_list > .list > li > a > .fw {display: inline-block; font-weight: 400; color: var(--colorGreen);}

.footer .ft_top .box .fb_right {font-size:0}
.footer .ft_top .box .fb_right .site_box {display: inline-block; border-right: 1px solid var(--colorLightGray);}
.footer .ft_top .box .fb_right .site_box:first-child {border-left: 1px solid var(--colorLightGray);}
.footer .ft_top .box .fb_right .site_box .baro_box {position: relative; display: inline-block;}
.footer .ft_top .box .fb_right .site_box .baro_box .site_btn {overflow: hidden; position: relative; width: 246px; height: 50px; padding: 0 32px 0 20px; font-size: 15px; line-height: 50px; color: rgba(24, 24, 24, 0.7); text-align: left; outline: none;transition:0.2s; font-weight: 700;}
.footer .ft_top .box .fb_right .site_box .baro_box .site_btn .arr_btn {position: absolute; right: 23px; top: 50%; width: 8px; height: 6px; background-image: url('/images/footer/site_arrow.png'); background-position: center center; background-size: 100% 100%; background-repeat: no-repeat; transform: translateY(-50%) rotate(180deg); transition: 0.32s ease;}
.footer .ft_top .box .fb_right .site_box .baro_box .site_btn:not(.on):hover {color:var(--colorGreen);background-color:var(--colorBgGray)}
.footer .ft_top .box .fb_right .site_box .baro_box .site_btn.on {color:var(--colorGreen);font-weight:700}
.footer .ft_top .box .fb_right .site_box .baro_box .site_btn.on .arr_btn {transform: translateY(-50%) rotate(0deg);}
.footer .ft_top .box .fb_right .site_box .baro_box .site_link {display: none; position: absolute ; left: -1px; bottom: 54px; width:calc(100% + 2px); max-height: 120px; border: 1px solid #e1e1e1; background-color:var(--colorGreen); overflow-y: auto;}
.footer .ft_top .box .fb_right .site_box .baro_box .site_link > li {border-bottom: 1px solid var(--colorLightGray);}
.footer .ft_top .box .fb_right .site_box .baro_box .site_link > li:last-child {border-bottom: 0;}
.footer .ft_top .box .site_box .baro_box .site_link > li > a {display: block; padding:12px 15px; font-weight: 300; font-size: 15px; line-height:1.4; color:var(--colorWhite); word-break: keep-all;}
.footer .ft_top .box .site_box .baro_box .site_link > li > a:hover {text-decoration:underline;text-underline-offset:3px}

.footer .ft_btm { background: #424242; padding: 40px 0; font-size: 0;}
.footer .ft_btm .container { display: flex; justify-content:space-between; align-items: flex-start; }
.footer .ft_btm .box { display: flex; grid-gap: 40px; }
.footer .ft_btm .box .ft_logo_area {filter: grayscale(1);}
.footer .ft_btm .box .txt_box { padding: 5px 0; }
.footer .ft_btm .box .txt_box .list li {font-weight: 400; font-size: 16px; color: #9e9e9e;}
.footer .ft_btm .container .sns_area { display: flex; grid-gap: 16px; }
.footer .ft_btm .container .sns_area .mg_r { margin: 0 40px 0 0; }
/* ============================= FOOTER STYLE4 ============================= */