﻿@charset "utf-8";

div.mask-wrap{
width: 100%;
height: 100%;
background: #8c8c8c;
}

div.address-wrap{
font-family: "Pretendard";
width: 714px;
position: absolute;
top:50%;
left: 50%;
transform: translate(-50%, -50%);
}

div.address-wrap div.address-box-only{
width: 100%;
background: #fff;
border-radius: 10px;
}

div.address-box-only div.top-box{
display: flex;
justify-content: space-between;
padding: 29px 0;
}

div.address-box-only div.top-box h2.h2-address-tit{
padding: 0 0 0 24px;
font-size:20px;
font-weight: 800;
color:#111927;
}

div.address-box-only div.top-box a.address-close-btn{
display: block;
margin: 3px 24px 0 0;
width: 15px;
height: 16px;
background: url("../images/common/address-close-btn.png") no-repeat center;
text-indent: -9999px;
}

div.address-box-only div.address-contents{
padding: 24px 24px;
border-top:solid 1px #dfe4e9;
border-bottom:solid 1px #dfe4e9;
/* max-height:calc(100vh - 844px) ; */
overflow-y:auto;
}

div.address-box-only div.address-contents::-webkit-scrollbar {
width: 3px;
height: 100%;
/* 스크롤바 너비 */
}

div.address-box-only div.address-contents::-webkit-scrollbar-thumb {
background-color: #999999;
/* 스크롤바 색상 */
border-radius: 10px;
/* 스크롤바 라운딩 설정 */
}

div.address-box-only div.address-contents::-webkit-scrollbar-track {
background-color: #bbbbbb;
/* 스크롤바 트랙 색상 */
}

/* 스크롤바를 숨기지 않음 */
div.address-box-only div.address-contents:hover::-webkit-scrollbar-thumb {
background-color: #999999;
}

div.address-contents p.about-txt{
background: #f2f5f9;
border-radius: 20px;
padding: 10px 14px;
margin-bottom: 28px;
}

div.address-contents p.about-txt span{
display: inline-block;
position: relative;
padding: 0 0 0 16px;
font-size:13px;
font-weight: 400;
color:#3e4449;
}

div.address-contents p.about-txt span:before{
content: "";
width: 4px;
height: 4px;
background: #3e4449;
border-radius: 100%;
position: absolute;
top:6px;
left:0;
}

div.address-contents div.search-box{
width: 100%;
position: relative;
}

div.address-contents div.search-box input[type="text"].address-search-input{
padding: 9px 24px;
width: 100%;
border-radius: 25px;
border:solid 1px #dfe4e9;
font-size:14px;
font-weight: 400;
color:#222222;
}

div.address-contents div.search-box input[type="text"].address-search-input:focus{
border-color:#0c419a;
}

div.address-contents div.search-box input[type="text"].address-search-input::placeholder{
font-family: "Pretendard";
font-weight: 400;
color:#bbbbbb;
}

div.address-contents div.search-box button.address-search-btn{
position: absolute;
top:0;
right:0;
padding: 9px 17px;
background: #0c419a;
border-radius: 25px;
height: 100%;
}

div.address-contents div.search-box button.address-search-btn span{
font-family: "Pretendard";
display: block;
color:#fff;
font-size:13px;
font-weight: 600;
position: relative;
padding: 0 0 0 21px;
}

div.address-contents div.search-box button.address-search-btn span:before{
content: "";
width: 14px;
height: 14px;
background: url("../images/common/address-search-ico.png") no-repeat;
position: absolute;
top:1px;
left:0;
}

div.address-contents div.address-choose-box{
margin-top: 18px;
border-radius: 5px;
border:solid 1px #dfe4e9;
}

div.address-contents div.address-choose-box div.address-choose-tit{
width: 100%;
background: #f2f5f9;
border-radius: 5px 5px 0 0;
padding: 15px 23px;
border-bottom:solid 1px #e7eaf3;
}

div.address-contents div.address-choose-box div.address-choose-tit.flex-between{
display: flex;
justify-content: space-between;
}

div.address-contents div.address-choose-box div.address-choose-tit span{
font-size:12px;
font-weight: 800;
color: #222222;
}

div.address-contents div.address-choose-box div.address-choose-tit h3{
font-size:12px;
font-weight: 800;
color:#222222;
}

div.address-contents div.address-choose-box ul.address-choose-list.no-data{
height: 289px;
}

div.address-contents div.address-choose-box ul.address-choose-list.no-data li{
width: 100%;
height: 100%;
border-bottom:none;
position: relative;
}

div.address-contents div.address-choose-box ul.address-choose-list.no-data li span{
display: block;
font-size:14px;
font-weight: 400;
color: #222222;
position: absolute;
top:50%;
left: 50%;
transform: translate(-50%, -50%);
}

div.address-contents div.address-choose-box ul.address-choose-list li{
border-bottom:solid 1px #f2f4f7;
}
div.address-contents div.address-choose-box ul.address-choose-list li a{
display: block;
}

div.address-contents div.address-choose-box ul.address-choose-list li a:hover{
background: #edf2fe;
}

div.address-contents div.address-choose-box ul.address-choose-list li div.box{
padding: 18px 24px;
}

div.address-contents div.address-choose-box ul.address-choose-list li div.box span{
display: block;
padding-bottom: 4px;
}
div.address-contents div.address-choose-box ul.address-choose-list li div.box span:last-child{
padding-bottom: 0;
}

div.address-contents div.address-choose-box ul.address-choose-list li div.box span i{
font-style: normal;
font-size:13px;
font-weight: 700;
color:#0c419a;
padding: 0 2px 0 0;
}

div.address-contents div.address-choose-box ul.address-choose-list li div.box span.number{
color:#9a9a9a;
font-weight: 400;
}

div.address-contents div.address-choose-box ul.address-choose-list li div.box span.adress-txt{
font-size: 15px;
font-weight: 500;
color:#222222;
}

div.address-contents div.address-choose-box ul.address-choose-list li div.box span.adress-detail-txt{
font-size: 15px;
font-weight: 400;
color:#777777;
}

/* 페이지네이션 */
div.pagenation-wrap{
width: 100%;
display: flex;
justify-content: flex-end;
padding: 10px 0 0 0;
}

div.pagenation-wrap div.page-left{
display: flex;
justify-content: flex-start;
padding-right: 60px;
}

div.pagenation-wrap div.page-left span.pagerow{
font-family: 'Pretendard Variable';
font-weight: 400;
display: inline-block;
font-size:12px;
color:#111927;
padding: 7px 9px 0 0;
}

div.pagenation-wrap div.number-dropdown-box.pagenation{
width: 60px;
}

div.number-dropdown-box.pagenation button.dropdown-button{
padding: 6px 12px;
}

div.pagenation-wrap div.page-left span.page-number{
font-family: 'Pretendard Variable';
font-size:12px;
display: inline-block;
padding: 8px 0 0 20px;
color:#111927;
}

div.pagenation-wrap div.page-left span.page-number i{
font-style: normal;
}

div.pagenation-wrap div.page-right{
width: 137px;
display: flex;
justify-content: space-between;
}

div.pagenation-wrap div.page-right a{
display: inline-block;
text-indent: -9999px;
width: 7px;
height: 11px;
margin: 10px 0 0 0;
}

div.pagenation-wrap div.page-right a.first-prev{
background: url("../images/common/page-first-ico.png") no-repeat center;
}

div.pagenation-wrap div.page-right a.prev{
width: 6px;
background: url("../images/common/page-prev-ico.png") no-repeat center;
}

div.pagenation-wrap div.page-right a.next{
width: 6px;
background: url("../images/common/page-next-ico.png") no-repeat center;
}

div.pagenation-wrap div.page-right a.last-next{
background: url("../images/common/page-last-ico.png") no-repeat center;
}

/* 셀렉트 드롭다운 */
div.number-dropdown-box{
width: 80px;
height: 30px;
position: relative;
}

div.number-dropdown-box.email{
width: 152px;
}

div.number-dropdown-box button.dropdown-button{
width: 100%;
height: 100%;
padding: 5px 12px;
border:solid 1px #d2d6db;
border-radius: 8px;
font-size:14px;
font-weight: 400;
color:#111927;
text-align: left;
cursor: pointer;
position: relative;
}

div.number-dropdown-box button.dropdown-button span{
display: block;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
width: 92%;
}

div.number-dropdown-box button.dropdown-button:after{
content: "";
width: 10px;
height: 5px;
background: url('../images/common/dropdown-arrorw.png') no-repeat;
position: absolute;
top:12px;
right:10px;
transition: all .3s ease-in-out;
}

div.number-dropdown-box button.dropdown-button.on:after{
transform: rotate(180deg);
}

div.dropdown-scroll{
width: 100%;
height: 138px;
display: none;
position: absolute;
top:-142px;
left:0;
z-index: 1;
background: #fff;
border:solid 1px #d2d6db;
border-radius: 10px;
padding: 4px 3px 4px 4px ;
overflow: hidden;
}

div.number-dropdown-box div.dropdown-content{
height: 128px;
overflow-y: auto;
padding: 0 4px 0 0;
text-align: left;
position: relative;
}

div.number-dropdown-box div.dropdown-content::-webkit-scrollbar {
width: 4px;
height: 100%;
/* 스크롤바 너비 */
}

div.number-dropdown-box div.dropdown-content::-webkit-scrollbar-thumb {
background-color: #6c737f;
/* 스크롤바 색상 */
border-radius: 10px;
/* 스크롤바 라운딩 설정 */
}

div.number-dropdown-box div.dropdown-content::-webkit-scrollbar-track {
background-color: #e9eaec;
border-radius: 10px;
/* 스크롤바 트랙 색상 */
}

/* 스크롤바를 숨기지 않음 */
div.number-dropdown-box div.dropdown-content:hover::-webkit-scrollbar-thumb {
background-color: #999999;
}

div.number-dropdown-box div.dropdown-content a{
display: block;
padding: 5px 6px;
text-overflow: ellipsis;
white-space: nowrap;
width: 98%;
overflow: hidden;
color:#6c737f;
}

div.number-dropdown-box div.dropdown-content a:hover{
background: #e8eafe;
border-radius: 8px;
color:#111927;
}

div.address-btn-wrap{
padding: 16px 24px;
display: flex;
justify-content: flex-end;
}

div.address-btn-wrap a{
padding: 10px 28px;
display: inline-block;
border-radius: 20px;
font-weight: 600;
}

div.address-btn-wrap a.cancel{
border:solid 1px #dfe4e9;
color:#818fae;
margin-right: 10px;
}

div.address-btn-wrap a.re-search{
border:solid 1px #dfe4e9;
color:#818fae;
margin-right: 10px;
}

div.address-btn-wrap a.confirm{
background: #4a80f6;
color: #fff;
border:solid 1px #4a80f6;
}

div.address-contents p.address-search-confirm-box{
background: #f2f5f9;
padding: 25px 20px;
text-align: center;
border-radius: 30px;
}

div.address-contents p.address-search-confirm-box span{
font-size:13px;
font-weight: 400;
color:#3e4449;
}

div.address-contents p.address-search-confirm-box span i{
font-style: normal;
color:#4a80f6;
font-weight: 700;
}