/* reset */ 
@charset "utf-8";
@import url('https://googleapis.com');
html {overflow-y:scroll}
body { margin:0; padding:0;
	font-size:14px;
    font-family: -apple-system,BlinkMacSystemFont,Pretendard Variable,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    overflow-wrap: break-word;
}
body.dogdict { margin:0; padding:0;
	font-size:14px;	
    font-family: -apple-system,BlinkMacSystemFont,Pretendard Variable,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    overflow-wrap: break-word;
	background-color:#f2f4f7;
}
a {color:#000;text-decoration:none;}
*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
fieldset { border:0; margin:0; padding:0; }
li { list-style:none; margin:0; padding:0; border:0; 
    font-family: -apple-system,BlinkMacSystemFont,Pretendard Variable,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    overflow-wrap: break-word;
}
ul { margin:0; padding:0; }
h1,h2,h3,h4,h5,h6 { margin:0; padding:0; border:0; 
    font-family: -apple-system,BlinkMacSystemFont,Pretendard Variable,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    overflow-wrap: break-word;
}
em { font-style:normal; } 
button { background-color:transparent; border:0; cursor: pointer; }
input[type=text],input[type=password],input[type=date], textarea { outline:none; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.d-flex { display: flex; }
.d-block { display: block; }
.d-none { display: none; }
.empty { min-height:120px; display:flex; justify-content: center; align-items: center; }

.gap-8 { gap: 8px; }
.gap-10 { gap: 10px; }
.gap-12 { gap: 12px; }
.gap-16 { gap: 16px; }
.gap-20 { gap: 20px; }
.gap-24 { gap: 24px; }

.mt-0 { margin-top: 0; }
.mt-8 { margin-top: 8px; }
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.mt-32 { margin-top: 32px; }

.mb-0 { margin-bottom: 0; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }
.mb-24 { margin-bottom: 24px; }
.mb-32 { margin-bottom: 32px; }

.p-0 { padding: 0; }
.p-8 { padding: 8px; }
.p-16 { padding: 16px; }
.p-20 { padding: 20px; }
.p-24 { padding: 24px; }

.pt-10 { padding-top:10px; }
.pt-20 { padding-top:20px; }
.pt-30 { padding-top:30px; }
.pt-40 { padding-top:40px; }
.pt-50 { padding-top:50px; }
.pt-60 { padding-top:60px; }
.pt-70 { padding-top:70px; }
.pt-80 { padding-top:80px; }
.pt-90 { padding-top:90px; }

.pb-10 { padding-bottom:10px; }
.pb-20 { padding-bottom:20px; }
.pb-30 { padding-bottom:30px; }
.pb-40 { padding-bottom:40px; }
.pb-50 { padding-bottom:50px; }
.pb-60 { padding-bottom:60px; }
.pb-70 { padding-bottom:70px; }
.pb-80 { padding-bottom:80px; }
.pb-90 { padding-bottom:90px; }

.pl-10 { padding-left:10px; }
.pl-20 { padding-left:20px; }
.pl-30 { padding-left:30px; }
.pl-40 { padding-left:40px; }
.pl-50 { padding-left:50px; }
.pl-60 { padding-left:60px; }
.pl-70 { padding-left:70px; }
.pl-80 { padding-left:80px; }
.pl-90 { padding-left:90px; }

.pr-10 { padding-right:10px; }
.pr-20 { padding-right:20px; }
.pr-30 { padding-right:30px; }
.pr-40 { padding-right:40px; }
.pr-50 { padding-right:50px; }
.pr-60 { padding-right:60px; }
.pr-70 { padding-right:70px; }
.pr-80 { padding-right:80px; }
.pr-90 { padding-right:90px; }

.radius-5 { border-radius:5px; }
.radius-10 { border-radius:10px; }
.w-100 { width: 100%; }
.h-100 { height: 100%; }

@media (min-width: 1024px) {
/* Custom css */
.bg-white { background:#fff; }
.bg-blue { background:#1778bc; }
.bg-gold { background:#aa7736; }
.black { color: #000; }
#hamburgerBtn,.mobile-drawer { display:none; }
/* Layout */
header { padding:10px; }
header .header-wrap { width:1320px;  margin-left:auto; margin-right:auto; }
header .header-wrap .logo { display:flex; }
header .header-wrap .logo img { height:35px; }
header .header-wrap .top-menu { display:flex; }
header .header-wrap .top-menu .member-menu { width:100%; display:flex; justify-content: flex-end; align-items: center; gap: 15px; }
header .header-wrap .top-menu .member-menu li { display:flex; justify-content: space-between; margin-right:0px; padding:8px 12px 8px 12px; font-size:13px; }
header .header-wrap .top-menu .member-menu i { position:relative; top:1px; margin-right:5px; }
header .header-wrap .top-menu .member-menu svg { position:relative; top:0px; left:0px; }
header .header-wrap .top-menu .member-menu a { color:#fff; }
header .header-wrap .top-menu .member-menu li a { color:#111; }
header .header-wrap .top-menu .member-menu li:last-child { margin-right:0px; }
header .header-wrap .top-menu .member-menu li.register { font-weight:500; }
.main-wrap { height:450px; margin-top:100px; }
.main-visual { text-align:center; }
.main-visual h1 { font-size:25px; font-weight:400; }
nav { width:800px; margin-left:auto; margin-right:auto; }
nav ul { margin-left:auto; margin-right:auto; margin-top:20px; display:flex; justify-content: center; gap:40px; }
nav .main-menu-item {  }
nav li { display:flex; justify-content: space-between; width:60px; height:60px; background:#fff; display:flex; gap:20px; cursor:pointer; transition: transform 0.2s ease; }
nav li.dogdict { background-image: url('../images/dogdict_ico.png'); background-size: 60px 60px; background-repeat: no-repeat; background-position: center; }
nav li.dogmarket { background-image: url('../images/dogmarket_ico.png'); background-size: 60px 60px; background-repeat: no-repeat; background-position: center; }
nav li.dogshop { background-image: url('../images/dogshop_ico.png'); background-size: 60px 60px; background-repeat: no-repeat; background-position: center; }
nav li.usedtrade { background-image: url('../images/usedtrade_ico.png'); background-size: 60px 60px; background-repeat: no-repeat; background-position: center; }
nav li.lifeinfo { background-image: url('../images/lifeinfo_ico.png'); background-size: 60px 60px; background-repeat: no-repeat; background-position: center; }
nav li.community { background-image: url('../images/community_ico.png'); background-size: 60px 60px; background-repeat: no-repeat; background-position: center; }
nav p { font-size:12px; margin-top:10px; font-weight:400; } 
.main-search-wrap { }
.main-search { height:150px;  }
.main-search ul { display:flex; flex-wrap: wrap; justify-content: center; margin-left:auto; margin-right:auto; }
.main-search .search-input { width:900px; height:50px; border:1px solid #ddd; border-radius:30px; padding-left:25px; margin-top:20px; }
.main-search #search-submit { position:relative; right:55px; background:transparent; border:1px solid transparent; font-size:18px;  }
.main-search p { width:900px; margin-top:20px; margin-left:auto; margin-right:auto; font-weight:600; font-size:12px; font-weight:500; }

#container { width:1320px; margin-left:auto; margin-right:auto; }

#login_wrap { display:flex; justify-content: center; align-items: center; width:1240px; margin-left:auto; margin-right:auto; height:720px; } 
#login_wrap h1 { font-size:25px; } 
#login_wrap h2 { font-size:14px; text-align:center; }
#login_wrap .login-field { display: flex; flex-direction: column; gap: 15px; width:350px; }
#login_wrap .login-field label { margin-top:30px; font-size:14px; font-weight:700; }
#login_wrap .login-field input { height:45px; border:1px solid #ccc; border-radius:10px; outline:none; }
#login_wrap .login-field input:focus { border:1px solid #1778bc; }
#login_wrap .login-field input.login-hp { padding-left:10px; }
#login_wrap .login-field .login-btn { border:0; border-radius:10px; background:#aa7736; color:#fff; font-size:16px; cursor:pointer; }
#login_wrap .login-field .login-btn:focus { border:1px solid #aa7736; }
#login_wrap .login-field .etc-btn { border:0; border-radius:10px; background:#fff; color:#111; border:1px solid #ccc; font-size:16px; }
#login_wrap .member-field { display:flex; justify-content: space-between;  }
#login_wrap .member-field p { display:flex; width:70%; font-size:14px; } 
#login_wrap .member-field strong { display:flex; align-content: flex-end; line-height:55px; font-size:14px; } 

#register-wrap { margin-left:auto; margin-right:auto; max-width: 390px; background: #fff; padding: 24px 20px 32px; }
#register-wrap h1 { padding-top:0px; padding-bottom:20px; } 
#register-wrap .step { font-size: 12px; color: #999; margin-bottom: 12px; background:#efefef; width:35px; height:25px; border-radius:10px; line-height:25px; text-align:center; }
#register-wrap .all-row { display: flex; align-items: center; gap: 12px; padding: 4px 0 20px; border-bottom: 1px solid #eee; margin-bottom: 8px; cursor: pointer; }
#register-wrap .all-label { font-size: 16px; font-weight: 500; color: #111;  }
#register-wrap .desc { font-size: 14px; color: #888; line-height: 1.6; margin: 12px 0 16px; padding-bottom: 16px; border-bottom: 1px solid #eee; }
#register-wrap .item-row { display: flex; align-items: center; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid #f0f0f0; cursor: pointer; }
#register-wrap .item-row:last-of-type { border-bottom: none; }
#register-wrap .item-left { display: flex; align-items: center; gap: 10px; }
#register-wrap .item-label { font-size: 14px; color: #222; }
#register-wrap .chevron { font-size: 16px; color: #bbb; }
#register-wrap .chk-icon { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
#register-wrap .chk-icon i { font-size: 18px; color: #ccc; transition: color .15s; }
#register-wrap .chk-icon.on i { color: #aa7736; }
#register-wrap .all-chk { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; border:1px solid #eee; border-radius:3px; }
#register-wrap .all-chk i { font-size: 20px; color: #ccc; transition: color .15s; }
#register-wrap .all-chk.on i { color: #aa7736; border:2px solid #aa7736; border-radius:3px; }
#register-wrap .next_btn { display: block; width: 100%; margin-top: 28px; padding: 16px; background: #e5e5e5; border: none; border-radius: 8px; font-size: 16px; font-weight: 500; color: #999; cursor:pointer; transition: background .2s, color .2s; }
#register-wrap .next_btn.active { background: #aa7736; color: #fff; cursor: pointer; }

#register-joinform-wrap { margin-left:auto; margin-right:auto; max-width: 390px; background: #fff; padding: 24px 20px 32px; }
#register-joinform-wrap h1 { padding-top:0px; padding-bottom:20px; }
#register-joinform-wrap .desc { font-size:14px; } 
#register-joinform-wrap label { display:block; font-size:14px; padding-top:10px; padding-bottom:10px; }
#register-joinform-wrap label#textred { color:#ff0000 }
#register-joinform-wrap .pw-strength-wrap { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
#register-joinform-wrap .pw-strength-bar { display: flex; gap: 4px; flex: 1; }
#register-joinform-wrap .pw-bar-segment { height: 4px; flex: 1; border-radius: 2px; background: #e0e0e0; transition: background .3s; }
#register-joinform-wrap .pw-strength-label { font-size: 12px; min-width: 30px; font-weight: 500; }
#register-joinform-wrap .pw-rule { font-size: 11px; color: #aaa; margin-top: 5px; }
#register-joinform-wrap .pw-match-msg { font-size: 12px; margin-top: 5px; }
#register-joinform-wrap button.zipsearch { background:#333; height:35px; line-height:35px; border:0; color:#fff; font-size:12px; border-radius:5px; padding-left:15px; padding-right:16.333333px; margin-right:5px; }
#register-joinform-wrap input.register-form { border-radius:5px; width:100%; height:40px; border:1px solid #ddd; padding:0px 0px 0px 5px; outline:none; } 
#register-joinform-wrap input.register-form:focus { border:1px solid #1778bc; }
#register-joinform-wrap input.register-date { border-radius:5px; width:100%; height:40px; border:1px solid #ddd; padding:0px 0px 0px 5px; } 
#register-joinform-wrap input.register-date:hover { border:1px solid #1778bc; }
#register-joinform-wrap input.register-date:focus { border:1px solid #1778bc; }
#register-joinform-wrap input.register-form-address { width:100%; height:38px; margin-bottom:5px; border:1px solid #ddd; border-radius:5px; }
#register-joinform-wrap input.register-form-addressdetail { width:100%; height:38px; margin-bottom:20px; border:1px solid #ddd; border-radius:5px; }
#register-joinform-wrap input.register-form-zipcode { width:33%; height:38px; margin-bottom:5px; border:1px solid #ddd; border-radius:5px; }
#register-joinform-wrap .register-complete-message { padding:10px; display:flex; justify-content: center; align-items: center; background:#e8e8e8; width:100%; height:100px; border-radius:10px; margin-bottom:50px; }
#register-joinform-wrap .dogselect { width:30%; height:40px; border:1px solid #ddd; }
#register-joinform-wrap .register-form-select { width:100%; height:40px; line-height:40px; border:1px solid #ddd; }
#register-joinform-wrap .dog-form-group { border-top: 1px solid #f0f0f0; padding-top: 16px; margin-top: 8px; }
#register-joinform-wrap .dog-form-group .dog-title { font-size: 14px; font-weight: 600; color: #1a73e8; margin-bottom: 12px; }
#register-joinform-wrap .dog-form-group .register-request-item { margin-bottom: 12px; }
#register-joinform-wrap .step { font-size: 14px; color: #999; margin-bottom: 12px; background:#efefef; width:35px; height:25px; border-radius:10px; line-height:25px; text-align:center; }
#register-joinform-wrap .next_btn { display:flex; justify-content: center; width: 100%; margin-top: 28px; padding: 16px; background: #aa7736; color: #fff; cursor: pointer; 
border: none; border-radius: 8px; font-size: 16px; font-weight: 500; color: #fff; cursor: pointer; transition: background .2s, color .2s; }

#register-joincomplete-wrap { margin-left:auto; margin-right:auto; max-width: 390px; background: #fff; padding: 24px 20px 32px; }
#register-joincomplete-wrap .register-complete-message { background:#f0f0f0; margin:30px 0; padding:30px; }
#register-joincomplete-wrap .next_btn { display: block; width: 100%; margin-top: 28px; padding: 16px; background: #aa7736; color:#fff; border: none; border-radius: 8px; font-size: 16px; font-weight: 500; color: #fff; cursor:pointer; transition: background .2s, color .2s; text-align:center; }

.phone-auth-wrap { display:flex; gap:8px; }
.phone-auth-wrap input { flex:1; }
.phone-auth-wrap button { flex-shrink:0; white-space:nowrap; padding:0 16px; background:#9b1515; color:#fff; border:none; border-radius:5px; cursor:pointer; }
.phone-auth-code-wrap { display:flex; gap:8px; margin-top:8px; }
.phone-auth-code-wrap input { flex:1; }
.phone-auth-code-wrap button { flex-shrink:0; white-space:nowrap; padding:0 16px; background:#00bfa5; color:#fff; border:none; border-radius:5px; cursor:pointer; }
#authResultMsg { display:block; font-size:12px; margin-top:6px; }

#mypage-wrap { margin-top:20px; }
#mypage-wrap .mypage-header { display:flex; width:100%; height:60px;  }
#mypage-wrap .mypage-title { width:180px; line-height:60px; height:60px; background:#aa7736; text-align:center; border-radius:10px 0px 0px 10px; }
#mypage-wrap .mypage-title h1 { font-size:18px; color:#fff; font-weight:bold;  }
#mypage-wrap .mypage-count { display:flex; justify-content:flex-end; padding-right:20px; width:1140px; line-height:60px; height:60px; background:#aa7736; border-radius:0px 10px 10px 0px; gap:15px; }
#mypage-wrap .mypage-count ul { display:flex; gap:0px; }
#mypage-wrap .mypage-count li { display:flex; color:#fff; height:40px; line-height:40px; margin-top:11px; padding-left:20px; padding-right:8px;  }
#mypage-wrap .mypage-count li h2 { color:#111; padding-right:10px; font-weight:800; width:35px; height:35px; border-radius:50%; background:#eee; text-align:center; padding:0px; }
#mypage-wrap .mypage-count li span.title { padding-left:10px; padding-right:10px; font-size:15px; }
#mypage-wrap .mypage-count li span.won { padding-left:10px; padding-right:10px; position:relative; top:1px; font-size:15px; } 
#mypage-wrap .mypage-count li em { color:#fff; font-style: normal; font-size:20px; font-weight:700; }
#mypage-wrap .mypage-count dl { width:1px; height:20px; background:#bd9b6f; position:relative; top:22px; }
#mypage-wrap .mypage-inner { display:flex; gap:40px; }
#mypage-wrap .mypage-inner aside { width:220px; height:auto; background:#f9f9f9; border-radius:10px; margin-top:30px; border:1px solid #e8e8e8; padding:30px 20px 30px 20px; }
#mypage-wrap .mypage-inner aside h1 { border-bottom:1px solid #ddd; padding-bottom:10px; margin-top:10px; margin-bottom:15px; }
#mypage-wrap .mypage-inner aside li { padding-top:0px; padding-left:8px; padding-bottom:15px; }
#mypage-wrap .mypage-inner aside li::before { content:"-"; padding-right:5px; }
#mypage-wrap .mypage-inner aside h1 { font-size:15px; padding-left:5px; }
#mypage-wrap .mypage-contents { width:1060px; margin-top:30px; }
#mypage-wrap .mypage-contents-userinfo { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #dedede; height:auto; margin-bottom:20px; }
#mypage-wrap .mypage-contents-userinfo ul { }
#mypage-wrap .mypage-contents-userinfo ul .userinfo-base { display:flex; align-items: center;}
#mypage-wrap .mypage-contents-userinfo ul .nickname-change { background:#ca4caf; padding:10px 25px 10px 25px; border-radius:10px; color:#fff; }
#mypage-wrap .mypage-contents-userinfo ul .base-profile { display:flex; align-items:center; justify-content:center; background:#dedede; width:80px; height:80px; min-height:80px; border-radius:50%; text-align:center; margin:0px 20px 0px 0px; } 
#mypage-wrap .mypage-contents-userinfo ul .base-profile img { width:80px; height:80px; object-fit:cover; border-radius:50%; }
#mypage-wrap .mypage-contents-userinfo ul .base-profile { position:relative; }
#mypage-wrap .mypage-contents-userinfo ul .base-profile label { position:absolute; bottom:25px; right:0px; background:transparent; width:25px; height:25px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; }
#mypage-wrap .mypage-contents-userinfo ul .base-profile label i { font-size:12px; color:#fff; }
#mypage-wrap .mypage-contents-userinfo #profile-delete-btn { position:relative; top:5px; right:30px; background:#999; width:25px; height:25px; border-radius:50%; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; }
#mypage-wrap .mypage-contents-userinfo #profile-delete-btn i { font-size:11px; color:#fff; }
#mypage-wrap .mypage-contents-userinfo ul .base-profile h2 {  }
#mypage-wrap .mypage-contents-userinfo ul .base-profile .fa-user { position:relative; left:0.5px; top:-2px; font-size:33px; color:#f6f6f6; } 
#mypage-wrap .mypage-contents-userinfo ul .base-profile .fa-pen { font-size:12px; position:relative; top:-28px; left:15px; background:#c9378f; color:#fff; width:25px; height:25px; line-height:25px; border-radius:50%; }
#mypage-wrap .mypage-contents-userinfo .userinfo-member-addlinfo { display:flex; margin-top:15px; margin-bottom:15px; }
#mypage-wrap .mypage-contents-userinfo .cert { display:flex; }
#mypage-wrap .mypage-contents-userinfo svg { width:25px; height:25px; color:#0db981; margin-right:5px; }
#mypage-wrap .mypage-contents-userinfo .userinfo-member-addlinfo li { line-height:25px; padding-right:15px; }
#mypage-wrap .mypage-contents-userinfo ul .account-manage { background:#1d4ed8; color:#fff; border-radius:5px; padding:10px 20px 10px 20px; }
#mypage-wrap .mypage-contents-userinfo ul .account-manage i {  }
#mypage-wrap .mypage-contents-userinfo ul .account-manage span { padding-left:5px; font-weight:500; }

#nickname-modal-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; z-index:1000; }
#nickname-modal { background:#fff; width:320px; padding:30px; border-radius:10px; }
#nickname-modal h3 { font-size:18px; margin-bottom:20px; text-align:center; }
#nickname-modal #nickname-input { width:100%; height:40px; border:1px solid #ddd; border-radius:5px; padding:0px 10px; box-sizing:border-box; }
#nickname-modal #nickname-input:focus { border:1px solid #346aff; }
#nickname-modal-error { color:#e14444; font-size:13px; margin-top:8px; min-height:16px; }
#nickname-modal-buttons { display:flex; gap:10px; margin-top:15px; }
#nickname-modal-buttons button { flex:1; height:40px; border-radius:5px; border:none; cursor:pointer; font-weight:500; }
#nickname-confirm-btn { background:#1d4ed8; color:#fff; }
#nickname-cancel-btn { background:#f0f0f0; color:#111; }

#mypage-wrap .mypage-contents-count { height:180px;  }
#mypage-wrap .mypage-contents-count ul { display:flex; gap:30px; }
#mypage-wrap .mypage-contents-count dd { margin:0; width:48px; height:48px; line-height:48px; padding:0px; color:#fff; border-radius:50%; } 
#mypage-wrap .mypage-contents-count dd.archive { background:#edf2fa; color:#111; }
#mypage-wrap .mypage-contents-count dd.comment { background:#0db981; }
#mypage-wrap .mypage-contents-count dd.activity { background:#e47e18; }
#mypage-wrap .mypage-contents-count p.archive { color:#97afcb; }
#mypage-wrap .mypage-contents-count p.comment { color:#0db981; }
#mypage-wrap .mypage-contents-count p.activity { color:#e47e18; }
#mypage-wrap .mypage-contents-count i { font-size:20px; position:relative; top:1.5px; }
#mypage-wrap .mypage-contents-count p { font-size:20px; font-weight:bold; margin:0; padding-top:5px; padding-bottom:5px; } 
#mypage-wrap .mypage-contents-count div { display:flex;justify-content: center; align-items:center; width:333.3333px; height:150px; box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04); text-align:center; border:1px solid #eee; border-radius:5px; 
transition: box-shadow 0.25s ease, transform 0.25s ease; }
#mypage-wrap .mypage-contents-count div:hover { box-shadow: 0 1px 10px rgba(0,0,0,0.15), 0 1px 2px rgba(0,0,0,0.04); transform: translateY(-3px); }
#mypage-wrap .mypage-contents-count div.archive {  }
#mypage-wrap .mypage-contents-count div.comment { }
#mypage-wrap .mypage-contents-count div.activity-statistics { }
#mypage-wrap .mypage-contents-activity { display:flex; flex-direction: column; padding-top:12px; padding-bottom:20px; }
#mypage-wrap .mypage-contents-activity ul { margin-top:20px; } 
#mypage-wrap .mypage-contents-activity h3 { font-size:18px; padding-bottom:5px; border-bottom:1px solid #ddd; padding-bottom:20px; }
#mypage-wrap .mypage-contents-activity li { line-height:30px; font-size:14px; }
#mypage-wrap .mypage-contents-ordersearch { display:flex; flex-direction: column; padding-top:20px; height:170px; border-bottom:1px solid #dedede; }
#mypage-wrap .mypage-contents-ordersearch h3 { font-size:18px; padding-bottom:5px; }
#mypage-wrap .mypage-contents-ordersearch { display:flex; }
#mypage-wrap .mypage-contents-ordersearch ul { display:flex; }
#mypage-wrap .mypage-contents-ordersearch li { border-radius:20px; background:#fff; color:#111; padding:0px 15px 0px 15px; margin:12px 15px 0px 0px; line-height:30px; text-align:center; border:1px solid #ddd; }
#mypage-wrap .mypage-contents-ordersearch li.active { background:#1d4ed8; color:#fff; }
#mypage-wrap .mypage-contents-ordersearch .mypage-contents-search {  }
#mypage-wrap .mypage-contents-ordersearch .order-search { border:1px solid #ddd; width:400px; height:40px; margin-top:10px; padding:10px; border-radius:5px; }
#mypage-wrap .mypage-contents-ordersearch .order-search:focus { border:1px solid #346aff; }
#mypage-wrap .mypage-contents-ordersearch .search-btn { width:30px; font-size:18px; position:relative; right:42px; top:2px; }

#mypage-wrap .mypage-contents-orderlist { width:1060px; height:auto;  margin-top:20px; border-radius:5px; }
#mypage-wrap .mypage-contents-orderlist > ul { border-radius:5px; border:1px solid #ddd; box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04); padding:20px 0px 0px 0px; }
#mypage-wrap .mypage-contents-orderlist h2 { padding-bottom:20px; font-size:18px; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-deliveryinfo { display:flex; gap:20px; border-bottom:1px solid #dedede; padding:0px 0px 0px 20px; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-deliveryinfo h2 { font-size:20px; font-weight:600; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-deliveryinfo h3 { font-size:20px; font-weight:400; color:#999; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-iteminfo-wrap { display:flex; justify-content: space-between; padding:0px;  }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-iteminfo-wrap img { position:relative; top:30px; left:20px; margin:20px; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-iteminfo { width:630px; border-right:1px solid #dedede; padding:40px 0px 20px 40px; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-iteminfo h4 { display:flex; padding:0px 0px 15px 0px; font-size:16px; font-weight:400; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-button { width:400px; padding:20px; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-button > ul { display:flex; flex-wrap:wrap; gap:10px; width:100%; padding:10px; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-button > ul li { width:calc(50% - 5px); box-sizing:border-box; border:1px solid #dedede; line-height:40px; text-align:center; }
#mypage-wrap .mypage-contents-orderlist .mypage-contents-orderlist-button > ul li:hover { background:#e2f0fa; color:#111; }

#notice-view-wrap { margin-top:20px;  }
#notice-view-wrap h1 { font-size:16px; padding-bottom:20px; }
#notice-view-wrap .post-meta { border-bottom:1px solid #ddd; padding-bottom:20px; }
#notice-view-wrap .post-meta span { padding-right:20px; }

#notice-view-wrap .btn-list { padding:10px 25px; background:#3a8afd; color:#fff; border-radius:4px; font-size:14px; text-decoration:none; }
#notice-view-wrap .btn-list:hover { background:#2979e8; }
#notice-view-wrap .post-buttons { display:flex; justify-content:flex-end; display:flex; justify-content:flex-end; gap:10px; padding-top:30px; border-top:1px solid #ddd; padding-top:30px; border-top:1px solid #ddd; }

#notice-view-wrap .post-content { padding-bottom:30px; }

footer { width:1320px; margin-top:0px; margin-left:auto; margin-right:auto; border-top:1px solid #eee; margin-top:30px; clear:both; }
footer em { font-style:normal; margin:0; padding:0; position:relative; top:-1px; } 
footer .footer-container { display:flex; margin-top:0px; font-size:14px; }
footer .footer-company-info { font-size:14px; margin-bottom:20px; }
footer .footer-company-info .footer-gap-1-base { padding-top:2px; padding-bottom:2px; }
footer .footer-company-info strong { padding-bottom:10px; display:block; }
footer .footer-company-info span.footer-company-info-title { font-weight:600; color:#888; }
footer .footer-company-info span.footer-company-info-title:after { content:":"; padding-left:3px; padding-right:3px; }
footer .footer-company-info span.footer-company-info-text { padding-right:5px; } 
footer .footer-menu { display:flex; width:75%; margin-top:0px; gap:25px; padding-bottom:20px; }
footer .footer-menu li { font-weight:500; font-size:14px; }
footer#member { display:flex;  line-height:60px; } 
footer#member .copyright { display:flex; justify-content: flex-end; width:30%; }
}
@media (max-width: 1024px) {
/* Layout */
header { height:60px;  }
header .header-wrap { width:100%; line-height:15px; margin-left:auto; margin-right:auto; }
header .header-wrap .logo { display:flex; height:60px; align-items:center; padding-top:10px; padding-left:13px; }
header .header-wrap .logo img { height:35px;  }
header .header-wrap .top-menu { display:flex; }
header .header-wrap .top-menu .member-menu { width:100%; display:flex; justify-content: flex-end; align-items: center; gap: 15px; }
header .header-wrap .top-menu .member-menu li { display:flex; justify-content: space-between; margin-right:0px; padding:8px 12px 8px 12px; font-size:13px; }
header .header-wrap .top-menu .member-menu svg { position:relative; top:2px; left:0px; }
header .header-wrap .top-menu .member-menu a { color:#fff; }
header .header-wrap .top-menu .member-menu li a { color:#111; }
header .header-wrap .top-menu .member-menu li:last-child { margin-right:0px; }
header .header-wrap .top-menu .member-menu li.register { font-weight:500; }
header .header-wrap { width:100%; padding:0 0px; box-sizing:border-box; }
header .header-wrap .top-menu .member-menu { display:none; }

.main-visual { text-align:center; }
.main-visual h1 { font-size:25px; font-weight:400; }

nav { width:100%; display:flex; align-content: center; justify-content: center; }
nav ul {margin-top:10px;display:flex;flex-wrap: wrap;justify-content: center;gap: 30px;padding:0;}
nav li { display:flex; justify-content: space-between; width:45px; height:45px; background:#fff; box-shadow:0px 3px 10px 0px rgba(31, 31, 31, 0.08); display:flex; gap:20px; }
nav li.dogdict { background-image: url('../images/dogdict_ico.png'); background-size: 45px 45px; background-repeat: no-repeat; background-position: center; }
nav li.dogmarket { background-image: url('../images/dogmarket_ico.png'); background-size: 45px 45px; background-repeat: no-repeat; background-position: center; }
nav li.dogshop { background-image: url('../images/dogshop_ico.png'); background-size: 45px 45px; background-repeat: no-repeat; background-position: center; }
nav li.usedtrade { background-image: url('../images/usedtrade_ico.png'); background-size: 45px 45px; background-repeat: no-repeat; background-position: center; }
nav li.lifeinfo { background-image: url('../images/lifeinfo_ico.png'); background-size: 45px 45px; background-repeat: no-repeat; background-position: center; }
nav li.community { background-image: url('../images/community_ico.png'); background-size: 45px 45px; background-repeat: no-repeat; background-position: center; }
nav p { font-size:12px; margin-top:10px; font-weight:400; }

/* main-wrap */
.main-wrap { height: auto; margin-top: 30px; }
.main-visual h1 { font-size: 16px; padding: 30px 20px 15px; }

.main-search { width:95%; margin-left:auto; margin-right:auto;  height: auto;  box-sizing: border-box; margin-top:30px; }
.main-search ul { }
.main-search .search-input { width:100%; height:50px; border:1px solid #ddd; border-radius:30px; padding-left:25px; }
.main-search #search-submit { position:absolute; right:40px; margin-top:15px; background-color:transparent; border:1px solid transparent; font-size:18px; }
.main-search p { margin-top:15px; margin-left:auto; margin-right:auto; font-weight:600; font-size:12px; }

#container { width:95%; box-sizing:border-box; margin-left:auto; margin-right:auto; margin-top:20px; }

#login_wrap { width:100%; height:450px; display:flex; align-content: center; justify-content: center; align-items: center; }
#login_wrap h1 { font-size:25px; }
#login_wrap h2 { font-size:14px; text-align:center; }
#login_wrap .login-field { display: flex; flex-direction: column; gap: 15px; }
#login_wrap .login-field label { margin-top:30px; font-size:14px; font-weight:700; }
#login_wrap .login-field input { height:45px; border:1px solid #ccc; border-radius:10px; }
#login_wrap .login-field input:focus { border:1px solid #1778bc }
#login_wrap .login-field input.login-hp { padding-left:10px; }
#login_wrap .login-field .login-btn { border:0; border-radius:10px; background:#aa7736; color:#fff; font-size:16px; cursor:pointer; }
#login_wrap .login-field .etc-btn { border:0; border-radius:10px; background:#fff; color:#111; border:1px solid #ccc; font-size:16px; }
#login_wrap .member-field { display:flex; justify-content: space-between; }
#login_wrap .member-field p { display:flex; width:70%; font-size:12px; }
#login_wrap .member-field strong { display:flex; align-content: flex-end; line-height:37px; font-size:12px; }
 
#register-wrap { margin-left:auto; margin-right:auto; max-width: 390px; background: #fff; padding: 24px 20px 32px; }
#register-wrap h1 { padding-top:0px; padding-bottom:20px; }
#register-wrap .step { font-size: 14px; color: #999; margin-bottom: 12px; background:#efefef; width:35px; height:25px; border-radius:10px; line-height:25px; text-align:center; }
#register-wrap .all-row { display: flex; align-items: center; gap: 12px; padding: 4px 0 20px; border-bottom: 1px solid #eee; margin-bottom: 8px; cursor: pointer; }
#register-wrap .all-label { font-size: 16px; font-weight: 500; color: #111; }
#register-wrap .desc { font-size: 14px; color: #888; line-height: 1.6; margin: 12px 0 16px; padding-bottom: 16px; border-bottom: 1px solid #eee; }
#register-wrap .item-row { display: flex; align-items: center; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid #f0f0f0; cursor: pointer; }
#register-wrap .item-row:last-of-type { border-bottom: none; }
#register-wrap .item-left { display: flex; align-items: center; gap: 10px; }
#register-wrap .item-label { font-size: 14px; color: #222; }
#register-wrap .chevron { font-size: 16px; color: #bbb; }
#register-wrap .chk-icon { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
#register-wrap .chk-icon i { font-size: 18px; color: #ccc; transition: color .15s; }
#register-wrap .chk-icon.on i { color: #aa7736; }
#register-wrap .all-chk { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; border:1px solid #eee; border-radius:3px; }
#register-wrap .all-chk i { font-size: 20px; color: #ccc; transition: color .15s; }
#register-wrap .all-chk.on i { color: #aa7736; border:2px solid #aa7736; border-radius:3px; }
#register-wrap .next_btn { display: block; width: 100%; margin-top: 28px; padding: 16px; background: #e5e5e5; border: none; border-radius: 8px; font-size: 16px; font-weight: 500; color: #999; cursor:pointer; transition: background .2s, color .2s; }
#register-wrap .next_btn.active { background: #aa7736; color: #fff; cursor: pointer; }
.phone-auth-wrap { display:flex; gap:10px; }
.phone-auth-code-wrap { display:flex; gap:10px; margin-top:10px; } 
.hpauthbtn { color:#fff; background:#000; border-radius:5px; padding:8px 15px; margin-top:0px; height:40px; } 
.verify-AuthBtn { padding:0px 25px; background:#1a73e8; border-radius:5px; white-space:nowrap; color:#fff; }
.phone-auth-code-wrap { display:flex; }
#register-joinform-wrap { margin-left:auto; margin-right:auto; max-width: 390px; background: #fff; padding: 24px 20px 32px; }
#register-joinform-wrap h1 { padding-top:0px; padding-bottom:20px; }
#register-joinform-wrap .desc { font-size:14px; }
#register-joinform-wrap label { display:block; font-size:14px; padding-top:10px; padding-bottom:10px; }
#register-joinform-wrap label#textred { color:#ff0000 }
#register-joinform-wrap .pw-strength-wrap { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
#register-joinform-wrap .pw-strength-bar { display: flex; gap: 4px; flex: 1; }
#register-joinform-wrap .pw-bar-segment { height: 4px; flex: 1; border-radius: 2px; background: #e0e0e0; transition: background .3s; }
#register-joinform-wrap .pw-strength-label { font-size: 12px; min-width: 30px; font-weight: 500; }
#register-joinform-wrap .pw-rule { font-size: 11px; color: #aaa; margin-top: 5px; }
#register-joinform-wrap .pw-match-msg { font-size: 12px; margin-top: 5px; }
#register-joinform-wrap button.zipsearch { background:#333; height:35px; line-height:35px; border:0; color:#fff; font-size:12px; border-radius:5px; padding-left:15px; padding-right:16px; margin-right:5px; }
#register-joinform-wrap input.register-form { border-radius:5px; width:100%; height:40px; border:1px solid #ddd; padding:0px 0px 0px 5px; }
#register-joinform-wrap input.register-form:focus { border:1px solid #1a73e8; outline:none; }
#register-joinform-wrap input.register-date { border-radius:5px; width:100%; height:40px; border:1px solid #ddd; padding:0px 0px 0px 5px; }
#register-joinform-wrap input.register-form-address { width:100%; height:38px; margin-bottom:5px; border:1px solid #ddd; border-radius:5px; }
#register-joinform-wrap input.register-form-addressdetail { width:100%; height:38px; margin-bottom:20px; border:1px solid #ddd; border-radius:5px; }
#register-joinform-wrap input.register-form-zipcode { width:32%; height:38px; margin-bottom:5px; border:1px solid #ddd; border-radius:5px; }
#register-joinform-wrap .register-complete-message { padding:10px; display:flex; justify-content: center; align-items: center; background:#e8e8e8; width:100%; height:100px; border-radius:10px; margin-bottom:50px; }
#register-joinform-wrap .dogselect { width:30%; height:40px; border:1px solid #ddd; }
#register-joinform-wrap .register-form-select { width:100%; height:40px; line-height:40px; border:1px solid #ddd; }
#register-joinform-wrap .dog-form-group { border-top: 1px solid #f0f0f0; padding-top: 16px; margin-top: 8px; }
#register-joinform-wrap .dog-form-group .dog-title { font-size: 14px; font-weight: 600; color: #1a73e8; margin-bottom: 12px; }
#register-joinform-wrap .dog-form-group .register-request-item { margin-bottom: 12px; }
#register-joinform-wrap .step { font-size: 14px; color: #999; margin-bottom: 12px; background:#efefef; width:35px; height:25px; border-radius:10px; line-height:25px; text-align:center; }
#register-joinform-wrap .next_btn { display:flex; justify-content: center; width: 100%; margin-top: 28px; padding: 16px; background: #aa7736; color: #fff; cursor: pointer; border: none; border-radius: 8px; font-size: 16px; font-weight: 500; transition: background .2s, color .2s; }
#register-joincomplete-wrap { margin-left:auto; margin-right:auto; max-width: 390px; background: #fff; padding: 24px 20px 32px; }
#register-joincomplete-wrap .register-complete-message { background:#f0f0f0; margin:30px 0; padding:30px; }
#register-joincomplete-wrap .next_btn { display: block; width: 100%; margin-top: 28px; padding: 16px; background: #aa7736; color:#fff; border: none; border-radius: 8px; font-size: 16px; font-weight: 500; color: #fff; cursor:pointer; transition: background .2s, color .2s; text-align:center; } 


#notice-view-wrap { margin-top:20px; padding:0px 10px; }
#notice-view-wrap h1 { font-size:16px; padding-bottom:20px; border-bottom:1px solid #ddd; margin-bottom:20px; }
#notice-view-wrap .post-meta { border-bottom:1px solid #ddd; padding-bottom:20px; display:flex; flex-direction: column; padding-bottom:20px; line-height:23px; }
#notice-view-wrap .post-meta span { padding-right:5px; }

#notice-view-wrap .btn-list { padding:8px 18px; background:#000; color:#fff; border-radius:4px; font-size:14px; text-decoration:none; }
#notice-view-wrap .btn-list:hover { background:#2979e8; }
#notice-view-wrap .post-buttons { display:flex; justify-content:flex-end; display:flex; justify-content:flex-end; gap:10px; padding-top:30px; border-top:1px solid #ddd; padding-top:30px; border-top:1px solid #ddd; }

#notice-view-wrap .post-content { padding-bottom:30px; }

footer { width:1240px; margin-left:auto; margin-right:auto; margin-top:50px; clear:both; }
footer em { font-style:normal; margin:0; padding:0; position:relative; top:0px; font-weight:200; }
footer .footer-container { display:flex; margin-top:20px; font-size:14px; }
footer .footer-company-info { font-size:12px; margin-bottom:20px; }
footer .footer-company-info .footer-gap-1-base { padding-top:2px; padding-bottom:2px; }
footer .footer-company-info strong { padding-bottom:10px; display:block; }
footer .footer-company-info span.footer-company-info-title { font-weight:400; color:#888; }
footer .footer-company-info span.footer-company-info-title:after { content:":"; padding-left:3px; padding-right:3px; }
footer .footer-company-info span.footer-company-info-text {  padding-right:5px; }
footer .footer-menu { display:flex; flex-wrap: wrap; gap:12px; border-top:1px solid #ddd; padding-top:20px; }
footer .footer-menu li { font-weight:400; font-size:12px; }
footer#member { flex-wrap: wrap; line-height:40px; }
footer#member .copyright { width:73.9%; display:flex; justify-content: flex-end; }


footer { width:100%; padding:0 16px; box-sizing:border-box; }
footer .footer-container { flex-direction:column; gap:16px; }
}
/* 공사중페이지 */
.notice { background:#fffee2; height:40px; position:relative; z-index:999999; }
.notice h2 { font-size:12px; line-height:40px; text-align:center; }
.overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 9999;
    pointer-events: all;
}
.construction { text-align:center; margin-top:50px; }
.construction img { width:300px; height:300px; }
footer p.copyright { text-align:center; font-size:13px; margin-top:50px; }