@charset "utf-8";
body{font-weight:400;font-family:'Noto Sans KR', sans-serif;}
/*        헤더 시작    */
.header{position:relative;width:100%;height:53px;border-bottom:1px solid #ddd;background-color:#fff;box-sizing:border-box;}
.header .basket{position:relative;width:53px;height:100%;cursor:pointer;}
.header .basket::after{display:inline-block;position:absolute;top:14%;right:20%;width:14px;height:14px;border-radius:50%;background-color:red;content:"0";color:#fff;font-size:10px;text-align:center;line-height:14px;}
.header .basket i.fas{position:relative;top:50%;left:50%;font-size:18px;transform:translate(-50%, -50%);}
.header .logo{position:absolute;top:0;left:50%;width:53px;height:53px;transform:translateX(-50%);}
.header .logo a img{position:relative;top:50%;left:50%;width:100%;transform:translate(-50%, -50%);}
.header .search{position:absolute;top:0;right:53px;width:53px;height:53px;cursor:pointer;}
.header .search i.fas{position:relative;top:50%;left:50%;font-size:16px;transform:translate(-50%, -50%);}
.header .ham-btn{position:absolute;top:0;right:0;width:53px;height:53px;cursor:pointer;}
.header .ham-btn i.fas{position:relative;top:50%;left:50%;font-size:16px;transform:translate(-50%, -50%);}
/*        헤더 끝    */
/*        햄버거 버튼 누르면 나오는 사이드 네비 시작    */
.side-nav{position:fixed;z-index:9999;top:0;right:-100%;width:100%;height:558px;transition:all .3s;}
.side-nav.active{right:0;}
.side-nav .side-header{position:relative;width:100%;height:53px;background-color:#000;}
.side-nav .side-header .logo-white{position:absolute;top:0;left:50%;width:53px;height:53px;transform:translateX(-50%);}
.side-nav .side-header .logo-white a img{position:relative;top:50%;left:50%;width:100%;transform:translate(-50%, -50%);}
.side-nav .side-header .cancel{position:absolute;top:0;right:0;width:53px;height:53px;cursor:pointer;}
.side-nav .side-header .cancel i.fas{width:100%;color:#fff;font-size:14px;text-align:center;line-height:53px;}
.side-nav .account-box{width:100%;height:53px;}
.side-nav .account-box ul{width:100%;height:100%;background-color:#fff;}
.side-nav .account-box ul li{float:left;width:50%;text-align:center;line-height:53px;}
.side-nav .account-box ul li:nth-child(1){border-right:1px solid #ddd;box-sizing:border-box;}
.side-nav .sort-box{width:100%;height:371px;background-color:firebrick;font-size:30px;font-weight:900;}
.side-nav .sort-box ul{width:100%;height:100%;overflow:hidden;}
.side-nav .sort-box ul li{width:100%;height:53px;border-bottom:1px solid #ddd;background-color:#fff;text-align:center;line-height:53px;box-sizing:border-box;}
.side-nav .sort-box ul li:first-child{border-top:1px solid #ddd;box-sizing:border-box;}
.side-nav .service-box{width:100%;height:53px;background-color:#fff;}
.side-nav .service-box ul{width:100%;height:100%;}
.side-nav .service-box ul li{float:left;width:50%;height:100%;text-align:center;line-height:53px;}
.side-nav .service-box ul li:nth-child(1){border-right:1px solid #ddd;box-sizing:border-box;}
.side-nav .account-box ul li a{display:inline-block;width:100%;height:100%;}
.side-nav .side-footer{width:100%;height:28px;background-color:#000000;}
/*        햄버거 버튼 누르면 나오는 사이드 네비 끝    */
/*        돋보기 누르면 나오는 서치패널 시작    */
.search-pannel{display:none;position:fixed;z-index:10;top:0;width:100%;height:558px;background-color:#fff;}
.search-pannel .search-header{position:relative;width:100%;height:53px;border-bottom:1px solid #ddd;background-color:#fff;box-sizing:border-box;}
.search-pannel .search-header .search-icon{position:absolute;top:0;left:0;width:53px;height:53px;}
.search-pannel .search-header .search-icon i.fas{position:relative;top:50%;left:50%;font-size:18px;transform:translate(-50%, -50%);}
.search-pannel .search-header input.search{position:absolute;top:50%;left:56px;border:0;transform:translateY(-50%);text-indent:4px}
.search-pannel .search-header span{float:right;margin-right:10px;font-size:12px;line-height:53px;cursor:pointer;}
.search-pannel .recommend-keyword{width:100%;height:53px;margin-bottom:20px;}
.search-pannel .recommend-keyword p{font-weight:500;text-indent:30px;line-height:53px;}
.search-pannel p.keyword{height:50px;font-size:12px;text-indent:30px;}
/*        돋보기 누르면 나오는 서치패널 끝    */
.page-indicator{height:50px;border-bottom:1px solid #ddd;box-sizing:border-box;letter-spacing:1px;}
.page-indicator p{text-align:center;text-indent:14px;line-height:50px;}
/*        스크롤탑 버튼 시작    */
.to-the-top{width:100%;height:60px;margin:0 auto;margin-top:60px;text-align:center;}
.to-the-top i.fas{font-size:30px;line-height:36px;cursor:pointer;}
.to-the-top p{height:30px;font-weight:bold;line-height:20px;}
.bottom-logo-wrap{position:relative;width:100%;height:162px;border-top:1px dashed #ddd;box-sizing:border-box;}
.bottom-logo-wrap img{position:absolute;top:50%;left:50%;width:26%;transform:translate(-50%, -50%);}
/*        스크롤탑 버튼 끝    */
/*        서비스 영역 시작    */
.service{width:100%;height:53px;background-color:#505050;}
.service ul li{float:left;width:50%;height:100%;color:#fff;font-size:11px;text-align:center;line-height:53px;}
.service ul li:nth-child(1){border-right:1px solid #000;box-sizing:border-box;}
.service ul li a{display:inline-block;width:100%;color:#fff;}
.sns{width:100%;height:105px;background-color:#222222;}
.sns ul{width:100%;height:100%;font-weight:300;}
.sns ul li{width:90%;height:calc(100% / 3);margin:0 auto;}
.sns ul li a{color:#fff;line-height:32px;}
.sns ul li a:nth-of-type(1){display:inline-block;width:10%;text-align:center;}
.sns ul li a:nth-of-type(2){font-size:10px;}
.sns ul li a:nth-of-type(3){float:right;line-height:32px;}
/*        서비스 영역 끝    */
/*        풋터 영역 시작    */
.footer{width:100%;background-color:#505050;}
.footer .footer-top{width:100%;height:38px;box-sizing:border-box;border-bottom:1px solid #000}
.footer .footer-top ul{width:100%;height:100%;}
.footer .footer-top ul li{float:left;width:50%;font-size:10px;text-align:center;line-height:38px;}
.footer .footer-top ul li a{color:#b2b2b2;}
.footer .footer-bottom{width:100%;padding:12px 30px;box-sizing:border-box;}
.footer .footer-bottom p{color:#b2b2b2;font-size:10px;line-height:20px;}
.footer .footer-bottom p:nth-of-type(4){margin-top:2px;line-height:12px;}
.footer .footer-bottom p:nth-of-type(5){margin-top:4px;line-height:12px;}
.footer .footer-bottom p:nth-of-type(6){margin-top:2px;}
/*        풋터 영역 끝    */
/*        스크롤 탑 되는 어사이드 버튼 시작    */
.aside{display:none;position:fixed;z-index:10;right:10px;bottom:10px;border-radius:6px;}
.aside::before{position:fixed;z-index:-1;right:11px;bottom:15px;width:20px;height:16px;border-radius:50%;background-color:#fff;content:"";}
.aside i.fas{color:#7b7b7b;font-size:30px;}
/*        스크롤 탑 되는 어사이드 버튼 끝    */
/*        로그인 폼 양식 시작    */
legend.screen_out{display:none;}
form{width:100%;height:600px;padding:10px;background-color:#ededed;box-sizing:border-box;}
.inp_text{position:relative;height:60px;border-bottom:1px solid #ddd;}
input, label{height:30px;/* background-color:#acc;*/}
input{position:absolute;top:50%;right:4%;transform:translateY(-50%);}
label{position:absolute;top:50%;padding:0;line-height:30px;transform:translateY(-50%);}
#phone1{right:40.5%;}
#phone2{right:22%;}
#phone1,#phone2,#phone3{width:40px;}
select{position:absolute;top:50%;right:4%;height:30px;transform:translateY(-50%);}
select.year{right:34.5%;}
select.month{right:19.1%;}
select.day{right:4%;}
input#male{right:36%;}
input#female{right:13%;}
label.male{right:45%;}
label.female{right:22%;}
.btn_register{width:99%;height:40px;margin-bottom:10px;border:0;border-radius:3px;background-color:#313131;color:#fff;font-size:13px;font-weight:bold;}