@charset "utf-8";
#footer {box-sizing: border-box; position: relative; padding:0 !important;}
#footer .f_inform_wrap{position:relative; background-color: #111; padding: 35px 0; box-sizing: border-box;}

/* footer_logo */
.f_logo_wrap{padding: 40px 0 25px 0;}
.f_logo_wrap .box{display: flex; align-items: center;}
.f_logo_wrap .box1{margin-bottom: 30px;}
.f_logo_wrap .box .box_cont{display: flex; align-items: center; flex-wrap: wrap}
.f_logo_wrap .box .box_l{margin-right:70px}
.f_logo_wrap .box .tit{color:#111; font-size: 17px; font-weight: 600; display: inline-block; width: 70px;}
.f_logo_wrap .ico{display: inline-block; width: calc(100% - 70px);}
.f_logo_wrap .box .wd_tit { width: 130px; }

.f_logo_wrap .box2{align-items: flex-start;}
.f_logo_wrap .box2 .box_cont li{ width: 120px; padding: 0 23px 15px 0;}
.f_logo_wrap .box2 .box_cont li a{display: block;}
.f_logo_wrap .box2 .tit{padding-top: 14px;}

.f_logo_wrap .main_ico { width: 120px !important; }
.f_logo_wrap .main_wd_ico { width: 190px !important; }


/* f_logo */
#footer .f_logo {width: 230px; position:absolute; top:0; left:0;}
#footer .f_logo img {width: 100%;}


/* t_inform */
#footer .t_inform { box-sizing: border-box; margin-bottom: 15px;}
#footer .t_inform > .inner {padding: 15px 0;}
#footer .t_inform a{font-size: 13px; color: #fff; display: inline-block; margin: 0 15px; transition:all .3s ease-in-out; opacity: 0.8;}
#footer .t_inform a:hover {opacity:1; transition:all .3s ease-in-out;}
#footer .t_inform a:first-child {margin-left: 0;}
#footer .t_inform a:last-child {margin-right: 0;}


/* f_inform */
#footer .f_inform {color: #ddd; box-sizing: border-box; padding: 0 210px 0 300px;}
#footer .f_inform:after {content: ""; clear: both; display: block;}
#footer .f_inform a {color: #fff; position: relative;}
#footer .f_inform a::before{position: absolute; content: ""; top: 50%; right: -15px; transform: translateY(-50%); width: 1px; height: 80%; background: #f7f7f7; opacity: .5;}
#footer .f_inform a:last-child:before{opacity: 0;}
#footer .f_inform p {display: inline-block; position: relative; font-size: 13px;}
#footer .f_inform p:last-child:after {display: none;}
#footer .f_inform p span {display: inline-block; line-height: 1.4;}
#footer .f_inform p span.bold {font-weight: 600; display: inline-block; margin-right: 5px;}
#footer .f_inform p span.txt{padding-right: 10px;}


/* copyright */
#footer .copy {font-size: 13px; color: #aaa; margin-top: 40px; text-transform: uppercase;}


/* f_sns_box */
#footer .f_sns_box {position:absolute; top:0; right:0;}
#footer .f_sns_box.list {font-size: 0;}
#footer .f_sns_box .list li {display: inline-block; margin: 0 4px 0 0;}
#footer .f_sns_box .list li:last-child {margin: 0;}
#footer .f_sns_box .list li a {display: block; width: 34px; height: 34px; background-color: rgba(153, 153, 204, 0.1); border-radius: 50%; text-align: center;}
#footer .f_sns_box .list li a:hover, .footer .foot_btm .container .sns_list .list li a:focus {background-color: #ffffff;}
#footer .f_sns_box .list li.fb a:hover i, .footer .foot_btm .container .sns_list .list li.fb a:focus i {color: #3b5998;} 
#footer .f_sns_box .list li.nb a:hover i, .footer .foot_btm .container .sns_list .list li.nb a:focus i {color: #00c73c;}
#footer .f_sns_box .list li.yt a:hover i, .footer .foot_btm .container .sns_list .list li.yt a:focus i {color: #ff0000;} 
#footer .f_sns_box.list li.tw a:hover i, .footer .foot_btm .container .sns_list .list li.tw a:focus i {color: #1da1f2;}
#footer .f_sns_box .list li.in a:hover i, .footer .foot_btm .container .sns_list .list li.in a:focus i {color: #0a66c2;}
#footer .f_sns_box .list li a i {font-size: 18px; line-height: 34px; color: rgba(153, 153, 204, 0.5);}


/* top_btn */
#footer .top_btn {position: absolute; bottom: 40px; right: 40px; border: 1px solid #fff; border-radius: 100%; opacity: 1; cursor: pointer; background: none; width: 50px; height: 50px; transition:all .4s ease-in-out;}
#footer .top_btn .ico {display:block; background:url(/images/2022/user/main/top_btn.png)no-repeat top center/cover; width: 8px; height: 15px; margin: 0 auto; position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); transition:all .5s ease-in-out;}
#footer .top_btn:hover{background:#fff;}
#footer .top_btn:hover .ico{background:url(/images/2022/user/main/top_btn_h.png)no-repeat top center/cover;}


@media print, screen and (max-width:1024px){
   #footer .f_inform p {display: block; margin-top: 10px;}
   #footer .f_inform p:after {display: none;}

   #footer .f_logo{position: static; margin: 0 auto;}
   #footer .f_inform{text-align: center; margin-top: 20px; padding: 0;}
   #footer .f_sns_box{position: static; margin: 30px auto 0; text-align: center;}
   #footer .copy{margin-top: 20px;}
}



@media print, screen and (max-width:768px){
   .f_logo_wrap .box .tit{width: 60px; font-size: 15px;}
   .f_logo_wrap .ico{width: calc(100% - 60px);}
   .f_logo_wrap .box2 .box_cont { justify-content: space-around }
   .f_logo_wrap .box2 .box_cont li{padding-right: 10px;}
}
@media print, screen and (max-width:600px) {
	.f_logo_wrap .main_ico { width: 80px !important; }
}
@media print, screen and (max-width:500px){
   .f_logo_wrap .box .box_l{margin-right: 30px;}
   .f_logo_wrap .box2 .box_cont li{padding-right: 5px;}

   #footer .f_inform .f_if {float: none; width: 100%;}
   #footer .t_inform a{margin: 0 5px;}
   #footer .f_inform a::before{right: -9px; height: 60%;}
   #footer .f_inform p  {margin-top: 0;}
   #footer .f_inform p span {margin-top: 5px;}

   #footer .top_btn{width: 35px; height: 35px; bottom: 20px; right: 20px;}
}

@media print, screen and (max-width:360px){
   #footer .t_inform a:first-child {margin-top: 0;}
}

