/*ALL CSS-----------------------------------------------------*/ .fs_12{font-size: 0.75rem;} .fs_13{font-size: 0.813rem;} .fs_14{font-size: 0.874rem;} .fs_15{font-size: 0.938rem;} .fs_18{font-size: 1.125rem;} .fs_20{font-size: 1.25rem;} .fs_22{font-size: 1.375rem;} .fs_24{font-size: 1.5rem;} .fs_25{font-size: 1.563rem;} .fs_26{font-size: 1.625rem;} .fs_28{font-size: 1.75rem;} .fs_30{font-size: 1.875rem;} .fs_36{font-size: 2.25rem;} .fs_40{font-size: 2.5rem;} .fw_m{font-weight: 400;} .fw_sb{font-weight: 500;} .fw_b{font-weight: bold;} .fw_bl{font-weight: 900;} .sec_bg{background-color: #f9fafc;} #b_header{position: fixed; left: 0; top: 0; width:100%; height: 70px ; background-color:#fff ; border-bottom:1px solid #ededed; z-index: 10;} #b_header .hd_inner{/*max-width:1920px; */width:100%; margin:0 auto; display: flex; justify-content: space-between; align-items: center; height:100%;} #b_header .b_logo{max-width: 230px; width:100%; height:100%; border-right:1px solid #ededed;} #b_header .b_logo a{display: flex; align-items: center; width:100%; height:100%; justify-content: center;} #b_header .hd_inner > div{height:100%; align-items: center;} #b_header .b_hd_left{display: flex; width: 70%;} #b_header .b_hd_left #b_gnb{display: flex; align-items: center; height:100%;} #b_header .b_hd_left #b_gnb li a{display: block;color:#091631; font-size: 0.9375rem; font-weight: 600; display: block; padding: 0 20px; word-break: keep-all; text-align: center;} #b_header .b_hd_right {display: flex; width: 30%; justify-content: flex-end;} #b_header .b_hd_right .b_util_menu{display: flex; align-items: center; height:100%;} #b_header .b_hd_right .b_util_menu{margin-right: 20px;} #b_header .b_hd_right .b_util_menu li a{ color: #373737; font-size: 0.875rem; font-weight: 400; display: block; opacity: .6; padding: 0 10px; border-right:1px solid #bbb; transition:opacity .2s;} #b_header .b_hd_right .b_util_menu li:hover a{opacity:1; transition:opacity .2s;} #b_header .b_hd_right .b_util_menu li:last-child a{border-right: 0;} #b_left_menu{position: fixed; left: 0; top: 70px; width: 230px; height:100%; background-color: #fff; border-right: 1px solid #ededed;z-index: 1000;} #b_left_menu .b_inner{display: flex; flex-direction: column; justify-content: space-between; width: 100%; height:100%; } #b_left_menu .b_top_box{display: flex; flex-direction: column; align-items: center; width: 100%;} #b_left_menu .b_top_box .member_info{ text-align: center; padding:25px 0; border-bottom: 1px solid #e3e9f2; width:100%; } #b_left_menu .member_info .mem_name{margin: 15px 0;margin-bottom: 8px;} #b_left_menu .member_info .b_logging{color:#aab0bf; display: block; margin-top: 15px;} #b_left_menu .b_top_box nav{width:100%; padding-top: 20px; } #b_left_menu #b_left_gnb {padding: 0 20px;} #b_left_menu #b_left_gnb li {margin-bottom: 15px; } #b_left_menu #b_left_gnb li a{color:#686f7e; font-weight: bold; display: flex; align-items: center ; padding:5px 0; transition:color .3s; } #b_left_menu #b_left_gnb li:hover a{color:#0051f7; transition:color .3s;} #b_left_menu #b_left_gnb li img{margin-right: 9px;} #b_left_menu #b_left_gnb li img.b_on{display: none;} #b_left_menu #b_left_gnb li:hover img.b_off{display: none;} #b_left_menu #b_left_gnb li:hover img.b_on{display: block;} #b_left_menu .b_logout_box{ margin: 0 auto; margin-bottom: 100px;} #b_left_menu .b_logout_box a{display: flex; align-items: center; justify-content:center; border-radius: 50px; color:#aab0bf; padding:4px 0; } #b_left_menu .b_logout_box span{margin-left:7px;} #b_left_menu .b_logout_box .b_circle{display: block; width:26px; border:1px solid #cdd3e2; height:13px; border-radius:50px; position:relative; } #b_left_menu .b_logout_box .b_circle:after{content:''; width:7.8px; height:7.8px; border-radius: 50%; background-color: #cdd3e2; position:absolute; right: 13px; top:50%; transform: translateY(-50%); transition:.2s;} #b_left_menu .b_logout_box:hover .b_circle{background: #f4f4f4;} #b_left_menu .b_logout_box:hover .b_circle:after{right: 3px; transition:.2s; background-color: #a2a9b9;} #b_header .b_toggle_btn{width:27px; flex-direction: column; align-items: flex-end; display: none;} #b_header .b_toggle_btn span{display: block; width: 100%; height: 2px; background-color: #021946; margin-bottom:4px;} #b_header .b_toggle_btn span:last-child{margin-bottom:0; } .b_bg_box{position:fixed; width:100%; height: 100%; background-color: rgba(0,0,0,.6); z-index: 10; display: none;} #b_site_map{position:fixed; right:-420px; top:0; background-color: #fff; z-index: 20; max-width: 360px; width:100%; height:100%; border-left: 1px solid #ededed; box-shadow: 0 -10px 25px rgba(0,0,0,.05); transition:.2s ease;} #b_site_map.open{right:0; transition:.5s ease;} #b_site_map .b_inner{width:90%; margin:0 auto; } #b_site_map .member_info{display: flex; padding:20px 0 15px; position: relative; } #b_site_map .member_info::before{content:''; width:360px; height:100% ; background-color: #f9fafc; position:absolute; top:0; left:50%; transform:translateX(-50%); z-index: -1;} #b_site_map .member_info::after{content:''; width:360px; height:1px ; background-color: #ededed; position:absolute; bottom:0; left:50%; transform:translateX(-50%); } #b_site_map .member_info figure{margin-right:10px;} #b_site_map .member_info .mem_id{margin:5px 0 8px;} #b_site_map .member_info .b_logging {color: #aab0bf; display: block; margin-top: 10px;} #b_site_map .b_util_menu {display: flex; } #b_site_map .b_util_menu li {margin-right: 8px; padding-right: 8px; border-right: 1px solid #e4e7ee;} #b_site_map .b_util_menu li:last-child {border-right: 0;} #b_site_map .b_util_menu li a {color: #aab0bf; font-size: 0.874rem; font-weight: 500; display: block; opacity: .6; transition: opacity .2s;} #b_site_map .b_util_menu li:hover a {opacity: 1; transition: opacity .2s;} #b_site_map #b_left_gnb .b_menu_1, #b_site_map #b_left_gnb .b_menu_4{display: none;} #b_site_map #b_left_gnb li img.b_on {display: none;} #b_site_map #b_left_gnb li:hover img.b_off {display: none;} #b_site_map #b_left_gnb li:hover img.b_on {display: block;} #b_site_map #b_left_gnb li a {color: #686f7e; font-weight: bold; display: flex; align-items: center; padding: 5px 0; transition: color .3s; } #b_site_map #b_gnb {display: flex; flex-wrap: wrap; margin-top:30px;} #b_site_map #b_gnb li {width:50%; margin-bottom:20px;} #b_site_map #b_gnb li a{color: #091631; font-size: 15px; font-weight: bold; display: block; padding: 0 20px; word-break: keep-all;} .b_close_btn{width:50px; height:50px; position: absolute; left: -51px;background-color:#0051f7 ; border-radius: 0 0 0 5px; top:0 ; display: flex; align-items: center; justify-content: center; flex-direction: column; z-index: 15;} .b_close_btn span{display: block; width: 25px; height:2px; background-color: #fff; } .b_close_btn span:first-child{margin-bottom: -2px; transform: rotate(45deg);} .b_close_btn span:last-child{transform: rotate(-45deg);} @media screen and (max-width: 1280px){ #b_header .b_logo{width: 140px; max-width:unset; } #b_header .b_logo img{width:100px;} #b_header .b_hd_left #b_gnb li a{padding: 0 10px;} #b_header .b_hd_right .b_util_menu li a{padding: 0 10px;} #b_left_menu{width: 140px; } } @media screen and (max-width: 1080px){ #b_header nav{display: none;} #b_header .b_toggle_btn{display: flex; } #b_left_menu{display: none;} #b_header .b_hd_left{width: auto;} #b_header .b_hd_right{width: auto; margin-right: 5%;} #b_header .b_hd_right .b_util_menu {margin-right: 10px;} } @media screen and (max-width: 720px){ #b_header .b_logo img{width:90px;} #b_header .b_hd_right .b_util_menu{display: none;} } .b_body_wrap{width: 100%; display: flex; justify-content: flex-end; padding-top: 70px; padding-bottom: 50px;} .b_body_wrap .b_inner{max-width: 1280px;width: 90%; margin: 0 auto; margin-top: 50px; } .b_body_wrap .b_section{border-radius: 30px; border:1px solid #ededed; padding:40px ; margin-bottom: 20px; box-shadow: 5px 10px 15px rgba(0,0,0,.03); -webkit-box-shadow: 5px 10px 15px rgba(0,0,0,.03); } .b_body_wrap .b_section:last-child{margin-bottom:0;} .b_body_wrap .b_tit_box{margin-bottom: 25px; display: flex; justify-content: space-between; align-items: flex-end;} .b_body_wrap .b_section .b_link_btn{color:#aab0bf; } .b_body_wrap .b_section .b_link_btn img{margin-left:3px; vertical-align: bottom;} .b_body_wrap .b_go_btn{height:50px; width:160px; border-radius: 5px; display: flex; align-items: center; justify-content: center; margin:0 auto; color:#fff; background-color: #0051f7; box-shadow: 0 0 25px rgba(0,0,0,.05); transition:background-color .3s;} .b_body_wrap .b_go_btn img{margin-left: 17px;} .b_body_wrap .b_go_btn:hover{background-color: #135ad7; transition:background-color .3s;} .b_index_wrap .b_inner{display: flex; flex-wrap: wrap; justify-content: space-between;} .b_index_wrap .b_left_sec{width:63%;} .b_index_wrap .b_right_sec{width:36%; } .b_index_wrap .b_right_sec .b_sec_02{margin-bottom: 20px; } @media screen and (min-width: 1921px){ .b_body_wrap{padding-left: 0;} } @media screen and (max-width: 1480px){ .b_body_wrap .b_section{padding:30px ;} } @media screen and (max-width: 1280px){ .b_body_wrap{padding-left: 140px;} } @media screen and (max-width: 1080px){ .b_body_wrap{padding-left: 0px;} .b_body_wrap .b_section{border-radius: 20px; padding: 20px; margin-bottom:20px; } .b_index_wrap .b_inner {margin-top: 35px;} .b_index_wrap .b_left_sec{width: 100%; height: unset;} .b_index_wrap .b_right_sec{width: 100%; margin-top:20px; } .b_index_wrap .b_right_sec .b_sec_02{margin-bottom:20px; } } @media screen and (max-width: 720px){ .b_body_wrap .b_section{border-radius: 15px; } .b_body_wrap .b_section .b_link_btn img{width: 10px;} .b_body_wrap .b_go_btn {height: 40px; width: 130px;} } /* 왼쪽 섹션 start ----- */ /* 자주묻는질문 섹션 */ .b_index_wrap .b_left_sec .b_sec_01 {height: 775px;} .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list{display: flex; align-items: center; margin-bottom: 30px; flex-wrap: wrap;} .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list li{margin-right:20px;} .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list li:last-child{margin-right:0;} .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list li p{display: flex; align-items: center; justify-content: center; color: #aab0bf; border-radius: 20px; padding:2.5px; cursor:pointer; } .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list li.on p{color:#021946; position: relative;} .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list li.on p{} .b_index_wrap .b_left_sec .b_tab_cont{background-color: #f9fafc; border-radius: 20px; padding: 10px 40px; display: none; } .b_index_wrap .b_left_sec .b_tab_cont.on{display: block;} .b_index_wrap .b_left_sec .b_faq_list li{height: 63px; border-bottom:1px solid #ebebeb; } .b_index_wrap .b_left_sec .b_faq_list li:last-child{ border-bottom:0} /* .b_index_wrap .b_left_sec .b_faq_list li:hover{background-color: #f9f9f9;} */ .b_index_wrap .b_left_sec .b_faq_list li a{height: 100%; display: flex; align-items: center; justify-content: space-between;} .b_index_wrap .b_left_sec .b_faq_list li p b{margin-right: 15px;} .b_index_wrap .b_left_sec .b_inq_btn{margin-top: 25px; } .b_faq_list .emptyFaq{text-align: center;padding: 20px 0;} @media screen and (max-width: 1480px){ .b_index_wrap .b_left_sec .b_tab_cont{padding: 0 20px;} } @media screen and (max-width: 1280px){ .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list li {margin-right: 10px;} } @media screen and (max-width: 1080px){ .b_index_wrap .b_left_sec .b_sec_01 {height: unset;} } @media screen and (max-width: 720px){ .b_index_wrap .b_left_sec .b_tab_cont{border-radius: 10px; padding: 0 7px;} .b_index_wrap .b_left_sec .b_faq_list li {height: 45px;} .b_index_wrap .b_left_sec .b_faq_list li p b {margin: 0 15px 0 5px;} .b_index_wrap .b_left_sec .b_faq_list li img{width: 7px;} .b_index_wrap .b_left_sec .b_sec_01 .b_tab_list{margin-bottom: 15px;} .b_index_wrap .b_left_sec .b_inq_btn {margin-top: 15px;} } @media screen and (max-width: 520px){ .b_index_wrap .b_left_sec .b_faq_list li p{text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-right: 10px;} } /* 부가 서비스 섹션 */ .b_index_wrap .b_left_sec .b_sec_02 {height: 400px;} .b_index_wrap .b_left_sec .b_svc_list{display: flex; flex-wrap: wrap; justify-content: space-between; } .b_index_wrap .b_left_sec .b_svc_list li{width:32%; border-radius:15px; background-color: #f9fafc;height:130px; overflow: hidden; transition:background-color .3s; position: relative;} .b_index_wrap .b_left_sec .b_svc_list li:hover{background-color: #eff2f7; transition:background-color .3s;} .b_index_wrap .b_left_sec .b_svc_list li.b_mg_bot{margin-bottom: 15px;} .b_index_wrap .b_left_sec .b_svc_list li a{width:100%; height:100%; display: flex; flex-wrap: wrap; flex-direction: column; align-items: flex-end; padding:30px 25px 15px 25px; } .b_index_wrap .b_left_sec .b_svc_list li p{width:100%; word-break: keep-all;} .b_index_wrap .b_left_sec .b_svc_list li img{max-width: 100%; position:absolute; right:20px; bottom:20px; } @media screen and (max-width: 1080px){ .b_index_wrap .b_left_sec .b_sec_02 {height: unset;} } @media screen and (max-width: 720px){ .b_index_wrap .b_left_sec .b_svc_list li{border-radius: 8px; height: 100px;} .b_index_wrap .b_left_sec .b_svc_list li.b_mg_bot {margin-bottom: 10px;} .b_index_wrap .b_left_sec .b_svc_list li a{padding: 15px; bottom: 10px;} .b_index_wrap .b_left_sec .b_svc_list li img{width: 35px; right: 10px; bottom: 10px;} } @media screen and (max-width: 520px){ .b_index_wrap .b_left_sec .b_svc_list li {width: 48%;} } /* ----- 왼쪽 섹션 end */ /* 오른쪽 섹션 start ----- */ /* 검색 섹션 */ .b_index_wrap .b_right_sec .b_sec_01 {height: 255px;} .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box{background-color: #fafafa; border-radius: 50px; display: flex; align-items: center; height: 53px; justify-content:space-between; } .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box input{width: 87%; display: block; height: 100%; background-color: #f9fafc; border:0; outline: 0; padding:0 20px; border-radius: 50px;} .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box button{width: 53px; display: block; background-color: #e4e7ee; border-radius: 50%; display: flex; align-items: center; justify-content: center; aspect-ratio: 1/1;} .b_index_wrap .b_right_sec .b_sec_01 .b_rec_list{display: flex; flex-wrap: wrap; margin-top: 30px;} .b_index_wrap .b_right_sec .b_sec_01 .b_rec_list li{margin-right: 13px; line-height: 1.5; color:#aab0bf; transition:color .3s;} .b_index_wrap .b_right_sec .b_sec_01 .b_rec_list li:hover a{color:#838a9d; transition:color .3s;} @media screen and (max-width: 1080px){ .b_index_wrap .b_right_sec .b_sec_01 {height: unset;} .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box input {width: calc(100% - 53px);} .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box button {width: 53px;} .b_index_wrap .b_right_sec .b_sec_01 .b_rec_list{margin-top: 15px;} } @media screen and (max-width: 720px){ .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box{height: 40px;} .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box button{width: 40px;} .b_index_wrap .b_right_sec .b_sec_01 .b_srh_box button img{width:16px; } } /* 공지사항 섹션 */ .b_index_wrap .b_right_sec .b_sec_02 {height: 500px;} .b_index_wrap .b_right_sec .b_sec_02 .b_news_list li{height: 63px; border-top:1px solid #ebebeb; } .b_index_wrap .b_right_sec .b_sec_02 .b_news_list li:last-child{border-bottom: none; } .b_index_wrap .b_right_sec .b_sec_02 .b_news_list li a{height: 100%; display: flex; align-items: center; justify-content: space-between;} .b_index_wrap .b_right_sec .b_sec_02 .b_news_list li p{text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-right:10px;font-weight: 500;} .b_index_wrap .b_right_sec .b_sec_02 .b_news_list li span{color: #878787;font-weight: 400;} @media screen and (max-width: 1080px){ .b_index_wrap .b_right_sec .b_sec_02 {height: unset;} } /* 고객센터 섹션 */ .b_index_wrap .b_right_sec .b_sec_03 {height: 400px;} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box {background-color: #f9fafc; border-radius: 15px; padding:25px; } .b_index_wrap .b_right_sec .b_sec_03 .b_num_box h3{font-weight: 900; font-size: 2.188rem; color: #021946;} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box{margin-top: 10px; display: flex; } .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p{word-break: keep-all;} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p:first-child{padding-right:20px; margin-right:20px; border-right:1px solid #ccc; display: flex; align-items: center;} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p img{margin-right: 5px;} .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list{margin-top: 15px;} .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list li{display: flex; justify-content: space-between; align-items: flex-start;} .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list li:first-child{padding-bottom:20px; border-bottom: 1px solid #ebebeb; ;} .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list li:last-child{padding-top:20px;} .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list .b_tit_txt{} .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list li p span{display: block; font-weight: 300; color:#aab0bf; margin-top:10px;} .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list .b_go_btn{margin:0; } @media screen and (max-width: 1350px){ .b_index_wrap .b_right_sec .b_sec_03 .b_num_box{padding: 20px 15px;} } @media screen and (max-width: 1280px){ .b_index_wrap .b_right_sec .b_sec_03 .b_cs_list .b_go_btn{width: 130px;} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p:first-child {padding-right: 10px;margin-right: 10px;} } @media screen and (max-width: 1150px){ .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box{flex-direction: column; } .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p:first-child{border-right:0} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p:last-child{margin-top:5px;} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box h3{font-size: 2rem;} } @media screen and (max-width: 1080px){ .b_index_wrap .b_right_sec .b_sec_03 {height: unset;} .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box{flex-direction: row; } .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p:first-child{border-right:1px solid #ccc; } .b_index_wrap .b_right_sec .b_sec_03 .b_num_box .b_txt_box p:last-child{margin-top:0;} } /* ----- 오른쪽 섹션 end */ #b_footer {/*border-top: 1px solid #e3e9f2;*/ background-color: #fafafc;} #b_footer .ft_inner{max-width: 1280px;width: 90%; margin: 0 auto; display: flex; flex-wrap: wrap; padding: 30px 0; } #b_footer .ft_inner > div{width:50%; } #b_footer .b_ft_left .b_policy_list{display: flex;/* margin-bottom: 25px; */} #b_footer .b_ft_left .b_policy_list li{border-radius: 50px; background-color: #e4e7ee;} #b_footer .b_ft_left .b_policy_list li {margin-right: 8px;} #b_footer .b_ft_left .b_policy_list li a{padding:7px 12px; display: block; color:#989eac; } #b_footer .b_ft_left address span{color:#989eac; line-height: 1.6;} #b_footer .b_ft_right .b_info_list{display: flex; flex-wrap: wrap;} #b_footer .b_ft_right .b_info_list li{width: 50%;} #b_footer .b_ft_right .b_info_list h5{margin-bottom: 25px;} #b_footer .b_ft_right .b_info_list .b_txt_box span{display: block; font-weight: 300; color: #989eac; margin-top: 10px;} #b_footer .b_ft_right .b_info_list .b_list_box {width: 250px; position: relative;} #b_footer .b_ft_right .b_info_list .b_list_box .b_box_area{height:50px; background-color: #fff; border-radius: 5px; box-shadow: 0 0 25px rgba(0,0,0,.05); display: flex; justify-content: space-between; align-items: center; padding:0 20px; color:#021946; cursor:pointer;} #b_footer .b_ft_right .b_info_list .b_list_box .b_box_area img{transform: rotate(-180deg); transition:.3s;} #b_footer .b_ft_right .b_info_list .b_list_box .b_box_area img.on{transform: rotate(0); transition:.3s;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list{position:absolute; left:0; bottom:55px; background-color: #fff; border-radius: 5px; box-shadow: 0 0 25px rgba(0,0,0,.05); width:100%; padding:10px 0; display: none;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list li{margin-bottom: 5px;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list li:last-child{margin-bottom: 0px;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list li a{display: flex; padding:3px 20px; color: #aab0bf; transition:color .3s; align-items: self-start;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list li:hover a{color:#091631; transition:color .3s;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list li img{margin-left:7px; width:11px; transition:filter .3s;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list li:hover img{filter: brightness(0.5); transition:filter .3s;} @media screen and (min-width: 1921px){ #b_footer {padding-left: 0;} } @media screen and (max-width: 1280px){ #b_footer .b_ft_right .b_info_list .b_list_box {width: 200px;} } @media screen and (max-width: 1080px){ #b_footer{padding-left:0; } #b_footer .ft_inner{flex-direction: column-reverse; align-items: center;} #b_footer .ft_inner > div {width: 100%;} #b_footer .b_ft_left {display: flex; flex-direction: column-reverse;} #b_footer .b_ft_right {padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid #e3e9f2; } #b_footer .b_ft_left .b_policy_list{margin-bottom:0; margin-top:20px;} } @media screen and (max-width: 720px){ #b_footer .b_ft_right .b_info_list .b_list_box .b_box_area {height: 40px; padding: 0 12px;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list {bottom: 45px;} #b_footer .b_ft_right .b_info_list .b_list_box .b_site_list li a{padding: 3px 12px;} } @media screen and (max-width: 630px){ #b_footer .b_ft_right .b_info_list .b_list_box {width: 160px;} } .br_520o{display: none;} @media screen and (max-width: 520px){ .br_520o{display: block;} #b_footer .b_ft_right .b_info_list .b_txt_box span {line-height: 1.5;} #b_footer .b_ft_right .b_info_list .b_txt_box span i{display: none; } } /* 서브페이지 > 유의사항 */ .b_caution{margin-top: 80px; } .b_caution h3{margin-bottom: 20px; } .b_caution .b_cat_list li{line-height: 1.7; padding-left: 10px; position: relative; word-break: keep-all;} .b_caution .b_cat_list li::after{content:''; width:3px; height:3px; background-color: #091631; border-radius: 50%; position:absolute; left:0; top:8px} @media screen and (max-width: 1480px){ } /*--- 2023.12.19 - KSH ---*/ .serviceList-01{background-color: #f0f8ff !important;} .serviceList-02{background-color: #fff9eb !important;} .serviceList-03{background-color: #f5ffec !important;} .serviceList-04{background-color: #f9f3ff !important;} .serviceList-05{background-color: #eff4f9 !important;} .serviceList-06{background-color: #fff7f7 !important;} /*-- 공통 --*/ .mbIdname{display: flex;justify-content: center;gap: 13px;} .mbIdname>i{position: relative;} .mbIdname>i::after{content: "";position: absolute;top: 2px;left: calc( 100% + 6px );width: 1px;height: 10px;background: #ccc;} .mbIdname>i:last-child::after{display: none;} .menuAlarm{background: #ff1b1b;color: #fff;font-weight: 500;font-size: 10px;line-height: 17px;width: 17px;text-align: center;border-radius: 20px;} /*알림바*/ .alarmBar{display: flex;align-items: center;justify-content: space-between;width: 100%;line-height: 55px;background: #e7fbe2;padding: 0 23px;border-radius: 5px;margin-bottom: 25px; /*background: linear-gradient(45deg, #fff, #EAFAF2);*/ } .alarmBar>div{display: flex;position: relative;padding-left: 65px;} .alarmBar>div img{position: absolute;bottom: 0;left: 0;} .alarmBar>div h4{color: #45830e;margin-right: 13px;} .alarmBar>i{margin-top: -2px;} /*회원이미지*/ .memberImg{display: flex;justify-content: center;} .memberImg span{position: relative;} .memberImg i{display: block;border-radius: 15px;overflow: hidden;} .memberImg img{display: block;} .memberImg a{ position: absolute;top: -6px;right: -6px;background: #ff1b1b;z-index: 1;color: #fff;font-weight: 500;font-size: .875rem;line-height: 20px;padding: 0 7px;border-radius: 20px;} /*체크박스*/ .memberCheck{position: relative;} .memberCheck input[type=checkbox], .memberCheck input[type=radio]{position: absolute;top: 0;left: 0;width: 0;height: 0;opacity: 0;outline: 0;z-index: -1;overflow: hidden;} .memberCheck input[type=checkbox] + label, .memberCheck input[type=radio] + label{display: flex;align-items: center;gap: 8px;color: #6f7383;cursor: pointer; justify-content: center;} .memberCheck input[type=checkbox] + label span, .memberCheck input[type=radio] + label span{width: 18px;height: 18px;border: 1px solid #b8c0cd;border-radius: 3px;overflow: hidden;background: #FFF;} .memberCheck input[type=checkbox]:checked + label span, .memberCheck input[type=radio]:checked + label span{background: url(/img/chk.png) no-repeat 50% 50% #0051f7;border-color: #0051f7;} .memberCheck.memberCheck-black input[type=checkbox] + label, .memberCheck.memberCheck-black input[type=radio] + label{color: #000;} @media screen and (max-width: 720px){ .memberCheck input[type=checkbox] + label, .memberCheck input[type=radio] + label{font-size: 13px;gap: 6px;} } /*header*/ #newHeader{position: fixed;top: 0;left: 0;width: 100%;height: 70px;border-bottom: 1px solid #ededed;background: #FFF;z-index: 1000;} .nhInner{width: 90%;max-width: 1280px;margin: 0 auto;height: 100%;} .nhLogo{position: absolute;top: 0;left: 0;width: 230px;height: 100%;border-right: 1px solid #ededed;z-index: 1;} .nhLogo>a{display: flex;align-items: center;justify-content: center;width: 100%;height: 100%;} .nhLogo img{display: block;} .nhMenu{display: block;height: 100%;width: 100%;} /*pc-gnb*/ .nhGnb{height: 100%;} .nhGnb>ul{display: flex;align-items: center;gap: 13px;height: 100%;position: relative;} .nhGnb>ul>li{height: 100%;position: relative;} .nhGnb>ul>li>a{display: flex;align-items: center;height: 100%;} .nhGnb>ul>li>a>span{display: flex;align-items: center;gap: 5px;font-weight: 700;border-radius: 5px;padding: 10px 15px;overflow: hidden;transition: background .2s ease;} .nhGnb>ul>li>ul{position: absolute;top: calc( 100% - 5px );left: 0;padding: 13px 15px;background: #FFF;min-width: 200px;border-radius: 8px;overflow: hidden;border: 1px solid #ededed;display: none; box-shadow: 0 4px 34px rgba(0,0,0,.1); -webkit-box-shadow: 0 4px 34px rgba(0,0,0,.1); } .nhGnb>ul>li>ul>li>a{display: flex;align-items: center;gap: 10px;width: 100%;height: 100%;font-size: .9375rem;font-weight: 500;color: #000;letter-spacing: -0.02em;padding: 18px 15px;border-radius: 3px;overflow: hidden;} .nhGnb>ul>li>ul>li>a img{display: block;margin-top: -2px;} .nhGnb>ul>li:hover>a>span{background: #F7F7F9;} .nhGnb>ul>li>ul>li:hover>a{background: #F7F7F9;} .nhGnb>ul>li.Menu07{position: absolute;top: 0;right: 0;z-index: 1;} .nhGnb>ul>li.Menu07>a>span{color: #FFF;background: #000;padding: 13px 28px;border-radius: 50px;} .nhGnb>ul>li.Menu07>ul{left: auto;right: 0;background: #2d3034;border-color: #2d3034;} .nhGnb>ul>li.Menu07>ul>li>a{color: #FFF;gap: 6px;} .nhGnb>ul>li.Menu07>ul>li:hover>a{background: #404347;} @media screen and (max-width: 1920px){ #newHeader{padding-left: 230px;} } /*---유지보수 - 비용안내---*/ .costTab{display: flex;gap: 25px;margin-top: 25px;} .costTab li{width: calc( ( 100% - 50px ) / 3 );} .costTab li a{display: block;width: 100%;height: 100%;padding: 35px 30px;border-radius: 15px;overflow: hidden;} .costTab li:nth-child(1) a{background: #f0f8ff;} .costTab li:nth-child(2) a{background: #eff4f9;} .costTab li:nth-child(3) a{background: #000;color: #FFF;} .costTab li h4{font-size: var(--size-24);font-weight: 800;margin-bottom: 20px;} .costTab li p{font-size: var(--size-18);font-weight: 500;line-height: 160%;} .costWrap{margin-top: 70px;} .costWrap>h4{margin-bottom: 25px;line-height: 150%;} .costTable{width: 100%;border-top: 1px solid #000;font-size: var(--size-15);} .costTable-fixed{table-layout: fixed;} .costTable td{text-align: center;padding: 20px 10px;border-bottom: 1px solid #eee;border-right: 1px solid #eee;line-height: 150%;font-weight: 400;} .costTable td:last-child{border-right: none;} .costTable td.costTd{font-weight: 500;background: #f9f9f9;font-size: var(--size-16);} .costTable tr:first-child td{font-weight: 600;background: #f9f9f9;font-size: var(--size-16);} .costTable td i{font-size: 2rem;font-weight: bold;display: inline-block;transform: rotate(45deg);color: #ddd;} .costTable td b{font-size: var(--size-20);font-weight: 700;} .costFaq a{display: flex;align-items: center;justify-content: space-between;padding: 32px 0;border-bottom: 1px solid #ededed;} .costFaq a b{display: none;} .costFaq a p span{font-size: var(--size-20);}