@charset 'utf-8';

/* 공통 */
body{
    color:#4b4b4b;
    font-family:'NanumSquare', sans-serif;
}
img{vertical-align: top;}
a{text-decoration: none; color:#333;}
.br_span{display: block;}
.align_center{text-align: center;}
.font_red{color: #0071da;}
.red_btn{width:200px; font-size:19px; color: #fff; background:#000000; border:none; border-radius:3px; line-height: 45px; text-align: center;}
.btn_wrap{text-align:center; margin-top:50px;}
.btn_wrap a{display:inline-block;}
.font_noto {font-family: 'Noto Sans KR', sans-serif; letter-spacing:-1px;}

/* 헤더 */
.l_center{width: 1500px; margin: 0 auto; }
.clear_fix:after{content:''; display: block; clear: both;}
.pc_none{display: none;}

header{position: relative;}
header>nav{
	position: absolute;
	right: 30px;
	top:60px;
}
header>nav>p{margin-bottom:15px;}
.logo_wrap{text-align: center;}

.btn_nav{z-index:999; position: relative; cursor: pointer;}
.gnb{
    position:fixed;
    top:0;
    right:-305px;
    z-index:99;
    width:300px;
    height:100%;
    background-color:#0071da;
    padding-top:100px;
    box-shadow:-1px 0px 1px rgba(0,0,0,0.2);
}
.gnb>li>a{
    display:block;
    color:#fff;
	font-size:17px;
    padding:15px 0 15px 20px;
}
.overlay{
	display: none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.5);
    z-index:9;
}

/* 풋터 */
.footer_wrap{background:#f2f2f2; margin-top:90px; font-family: 'Noto Sans KR', sans-serif; letter-spacing:-1px;}
footer{text-align: center; padding:50px 0px; font-size:0.9em; color:#959595; line-height:1.5;}
toptext{text-align: center; padding:50px 0px; font-size:4.0em; color:#959595; line-height:5.0;}
.foot_term{background: #0071da; box-sizing: border-box; padding: 30px 50px; font-size:0.9em;}
.foot_term div{display: inline-block;}
.footer_wrap a{color: #fff;}
.footer_wrap a:hover, .footer_wrap a:active{color: #9ed0ff;}
.foot_term div a{display:inline-block; margin-right: 30px;}
.foot_term p{float: right;}
.foot_term p span{color: #9ed0ff; display: inline-block; margin-left:15px;}



/* 서브공통 */
/* sub_top */
aside{
	background-image:url(../../_images/sub_top1.jpg);
	background-repeat:no-repeat;
	background-size: cover;
	background-position:center;
	padding-top:60px;
	margin-bottom:80px;
}
.sub_top2{background-image:url(../../_images/sub_top2.jpg);}
.sub_top3{background-image:url(../../_images/sub_top3.jpg);}
aside>div>a{width: 115px; display:inline-block; vertical-align: top;}
aside>div>a>img{width: 100%; margin-bottom: 5px;}
.sub_top_text{display: inline-block; margin-left:20px;}
.sub_top_text h2{color:#bababa; margin-bottom: 5px;}
.cs_num_wrap{color: #fff; margin-bottom:30px;}
.cs_num_wrap>p{float:left;}
.cs_num_wrap>p:first-child{font-size:1.6em; font-weight:600;}
.cs_num_wrap>p:last-child{font-size:0.8em; padding-left:20px; margin-left: 20px; border-left:1px solid rgba(255,255,255,0.6); color:rgba(255,255,255,0.8);}
.lnb{
	width:950px;
	margin: 60px auto 0;
	border-top:1px solid #0071da;
	border-bottom:1px solid #0071da;
}
.lnb>li{
	background: #fff;
	box-sizing: border-box;
	float:left;
	width: 50%;
	/* width: 33.333%; */
	border-right:1px solid #0071da;
	padding: 20px 25px;
}
.lnb>li:first-child{border-left:1px solid #0071da;}
.lnb>li:hover, .lnb>li:active{background: #0071da;}
.lnb>li:hover a, .lnb>li:active a:visited{color: #fff;}
.lnb>li:hover a span, .lnb>li:active a:visited span{color: #9ed0ff;}
.lnb .on{background: #0071da;}
.lnb .on a, .lnb .on a:visited{color: #fff;}
.lnb .on a, .lnb .on a:visited span{color: #9ed0ff;}
.lnb span{font-size:13px; display: block; margin-bottom:5px; color: #777;}
.lnb p{font-size:19px;  background:#fff url('../../_images/gray_arrow.png') no-repeat 96% center;}
.lnb .on p{background:#0071da url('../../_images/white_arrow.png') no-repeat 96% center;}
.lnb li:hover p, .lnb li:active p{background:#0071da url('../../_images/white_arrow.png') no-repeat 96% center;}

/* title_wrap */
.title_wrap{text-align: center; margin-bottom:70px;}
.title_wrap h5{font-size:2em; margin-bottom:30px; color:#000;}
.title_wrap>p{line-height:1.5; color:#666; font-family: 'Noto Sans KR', sans-serif; letter-spacing:-1px;}




/* waybill */
.barcode_wrap{max-width: 800px;}
.barcode_wrap input{width:700px; border:none; font-size:23px; padding:10px 20px; border-bottom:2px solid #000; color:#000;  box-sizing: border-box; background:url('../../_images/barcode.gif') no-repeat 98% center;}
.barcode_wrap input::placeholder{color: #000;}
p.notice{ margin-top:18px; font-size:0.87em; color:#666; line-height:1.6; font-family: 'Noto Sans KR', sans-serif;}
.barcode_wrap button{margin-top:25px;}


/* waybill_view */
.way_view_wrap{width:800px;}
/* .delivery_info li{float:left; width:30.6%; margin:7px 0px;}
.delivery_info .mar_li{margin:7px 4%;} */
.delivery_info li{float:left; width:47%; margin:7px 0px;}
.delivery_info li:nth-child(2n){margin-left:6%;}
.delivery_info li span{display: block; color: #666; font-family: 'Noto Sans KR', sans-serif; letter-spacing:-1px;}
.delivery_info li p{border-bottom:2px solid #000; padding:8px 0px; font-weight:600; font-size:17px; min-height:18px;}
.delivery_process{margin-top:50px;}
.delivery_process strong{font-size:24px; display: block; text-align: center; background:url('../../_images/box.gif') no-repeat top center; padding-top:110px; color:#000;}
.delivery_process table{width: 100%; text-align:center; margin-top:10px;}
.delivery_process th{border-top:2px solid #000; padding:5px; line-height: 30px;}
.delivery_process td{border-top:2px solid #f0f0f0; border-bottom:2px solid #f0f0f0; padding:5px; font-size:15px; line-height:40px;}
.delivery_process td:nth-child(1){width:25%; border-left:2px solid #f0f0f0; font-weight:600;}
.delivery_process td:nth-child(2){width:25%;}
.delivery_process td:nth-child(3){width:25%;}
.delivery_process td:nth-child(4){width:25%; border-right:2px solid #f0f0f0;}
.delivery_chk{display:inline-block; cursor:pointer; background: #333; color:#fff; padding:0px 15px; border-radius:3px;}
.pop_overlay{display: none;  position:fixed; top:0;   left:0;  width:100%;  height:100%;  background-color:rgba(0,0,0,0.5);  z-index:9;}
.pop_wrap{position: fixed; width:800px; top:5vw; left:calc(50% - 400px); background: #fff; border: 3px solid #000; box-sizing:border-box; padding:70px 30px 10px; text-align:center; display:none; z-index:99; overflow-y:auto;}
.pop_wrap span{color: #666; font-size:0.85em;}
.pop_wrap strong{color: #0071da; font-size:1.5em;}
.pop_info p{color:#000; font-size:1.3em;}
.pop_info ul{margin-top:15px;}
.pop_info li{float:left; width:25%; box-sizing:border-box; border:1px solid #999; border-left:none; padding:20px 0px;}
.pop_info li:first-child{border-left:1px solid #999;}
.pop_info li p{margin-top:10px; font-size:1.15em;}
.pop_process{margin-top:50px;}
.pop_process strong{display: block; margin-bottom:10px;}
.pop_process ul{border-top:2px solid #000;}
.pop_process li{padding:15px; border-bottom:1px solid #bbb;}
.pop_process li:after{content:''; display: block; clear: both;}
.pop_process li p{float: left; color:#000;}
.pop_process li p:nth-child(1){width:30%;}
.pop_process li p:nth-child(2){width:50%;}
.pop_process li p:nth-child(3){width:20%; font-weight:600;}
.pop_process li .font_red{color: #0071da;}
.pop_process .notice{text-align:left; line-height:1.3; font-size:0.8em;}
.pop_process+p{background: #0071da; color:#fff; font-size:1.1em; padding: 20px 0px; margin-top:60px;}

/* customer */
.customer_wrap input{margin-bottom:15px;} 
.customer_wrap .name_input{background: url(../../_images/name_icon.gif) no-repeat 98% center;}
.customer_wrap .num_input{background: url(../../_images/number_icon.gif) no-repeat 98% center;}



/* cs 고객센터 list*/
.cs_wrap .cs_num_wrap{color:#000; width:400px; margin:30px auto 0;} 
.cs_wrap .cs_num_wrap>p:last-child{color: #666; border-left:1px solid #666;}
.board_page .search_area {text-align:right; padding:0px 0 20px;}
.board_page .search_area p {font-size:37px; color:#333; font-weight:400; margin-bottom:40px;}
.board_page .search_area form.bg {padding:13px 0; background:#f3f6f9; border-top:1px solid #b0b1b2; border-bottom:1px solid #b0b1b2;}
.board_page .search_area form select {height:42px; line-height:42px; font-size:16px; border:1px solid #c2c2c2; color:#555; background:#fff url('../../_images/gray_arrow.png') no-repeat 96% center; padding:0 10px; max-width:130px; width:100%;  -webkit-appearance: none; -moz-appearance: none;appearance: none;}
.board_page select::-ms-expand { display:none; }
.board_page .search_area form input[type=text] {height:42px; padding:0 10px; font-size:16px; border:1px solid #c2c2c2; max-width:300px; width:100%;}
.board_page .search_area form .btn {display:inline-block; height:42px; line-height:42px; font-size:16px; background:#666; font-size:15px; color:#fff; font-weight:400; border:none; border-radius:3px; width:100%; max-width:100px; vertical-align:middle; text-align:center; }
.board_page .search_area form .btn>span {background:url('../../_images/board_search_ico.png') no-repeat left center; padding-left:20px; }
.board_page .search_area form .btn.excel {background:#fff; border:1px solid #3f9514; color:#3e9414;}
.board_page .notice_list {border-top:2px solid #222;}
.board_page .notice_list li {overflow:hidden; border-bottom:1px solid #e5e5e5; transition:.3s ease-out;}
.board_page .notice_list li.notice,
.board_page .notice_list li.notice:hover {background-color:#f4f4f4;}
.board_page .notice_list li.notice .date,
.board_page .notice_list li.notice .date p {color:#cacaca;}
.board_page .notice_list li>a {display:block; padding:7px 0; overflow:hidden;}
.board_page .notice_list li:hover .date,
.board_page .notice_list li:hover .date p {color:#9ed0ff;}
.board_page .notice_list li>a div {float:left;}
.board_page .notice_list li .date {font-size:16px; color:#ddd; text-align:center;  width:150px; transition:.3s ease-out; margin-top:7px;}
.board_page .notice_list li .date p {font-size:28px; color:#ddd; font-weight:500; transition:.3s ease-out; margin:0; }
.board_page .notice_list li .text_wrapper {width:calc(100% - 150px); margin:10px 0;}
.board_page .notice_list li .text_wrapper .text_wrap .label {float:left; display:inline-block; margin:0 5px 5px 0; padding:0 10px; min-width:65px; height:28px; line-height:28px; text-align:center; font-size:15px; font-weight:600;}
.board_page .notice_list li .text_wrapper .text_wrap .label:last-child {margin-right:10px;}
.board_page .notice_list li .text_wrapper .text_wrap .label.notice {border:1px solid #0071da; color:#0071da;}
.board_page .notice_list li .text_wrapper .text_wrap .label.new {border:1px solid #de1a51; color:#de1a51;}
.board_page .notice_list li .text_wrapper .text_wrap {float:left; width:90%; margin-left:10px;}
.board_page .notice_list li .text_wrapper .text_wrap .subject {font-size:18px; color:#333; font-weight:400; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:90%;}
.board_page .notice_list li .text_wrapper .text_wrap .txt {font-size:15px; color:#777; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:90%;}
.board_page{font-family: 'Noto Sans KR', sans-serif; letter-spacing:-1px;}

/*공지사항 view*/
.board_page .notice_view {border-top:2px solid #222;}
.board_page .notice_view .subject {padding:20px 0px; border-bottom:1px solid #e5e5e5; display:table; width:100%;}
.board_page .notice_view .subject:after {display:block; overflow:hidden; clear:both; content:'';}
.board_page .notice_view .subject p {display:table-cell; font-size:24px; color:#333; font-weight:400; vertical-align:middle; line-height:30px;}
.board_page .notice_view .subject span {display:table-cell; font-size:17px; color:#767676; text-align:right; vertical-align:middle; padding-left:20px;}
.board_page .notice_view .text {padding:40px 0; min-height:300px; border-bottom:0px solid #e5e5e5;}
.board_page .notice_view .text img {width:100%; }

/*pagination*/
.paging {margin:20px auto 0;}
.paging ul {text-align:center;}
.paging ul li {display:inline-block;  padding:0; background:#fff; }
.paging ul li.prev {background:#fff url('../../_images/prev_ico.png') no-repeat center center; text-indent:-99999px;}
.paging ul li.next {background:#fff url('../../_images/next_ico.png') no-repeat center center; text-indent:-99999px;}
.paging ul li a {display:block; color:#9c9c9c;width:40px; height:40px; line-height:40px;border:1px solid #c8d0d6;}
.paging ul li a.current {background:#333; color:#fff; font-weight:500;  height:40px; line-height:42px; border:0px solid #c8d0d6;}







@media screen and (max-width:1550px) {
	.l_center{width: 90%;}
	
}




@media screen and (max-width:1024px) {
	.foot_term div{display: block; text-align:center;}
	.foot_term div a{margin-right:10px;}
	.foot_term div a:last-child{margin-right:0px;}
	.foot_term p{float:none; text-align: center; margin-top:10px;}
	
	
	.sub_top_text{margin-top:50px;}
	.sub_top_text>img{display: none;}
	.lnb{width:90%;}
	.lnb li{padding: 12px;}
	.lnb p{font-size:19px;  background:#fff;}
	.lnb .on p{background:#0071da;}
	.lnb li:hover p, .lnb li:active p{background:#0071da;}
	
	.barcode_wrap input {width:100%;}
	
	/* waybill_view */
	/* .delivery_info li{width:48%;}
	.delivery_info .mar_li{margin:7px 0px;}
	.delivery_info li:nth-child(2n-1){margin-right:4%;} */
	.delivery_process strong{border-bottom:2px solid #000; padding-bottom: 20px;}
	.delivery_process table{table-layout: fixed; margin-top:0px;}
	.delivery_process th{display: none;} 
	.delivery_process td{display:table-row; border:none; text-align: left; line-height:normal; font-size:17px; box-sizing:border-box;}
	.delivery_process td:nth-child(1){display: block; width:100%; border:none; font-weight:500;}
	.delivery_process td:nth-child(2){display: block; width:100%;}
	.delivery_process td:nth-child(3){display: block; width:100%;}
	.delivery_process td:nth-child(4){display: block; width:100%; border:none; border-bottom:1px solid #ddd; padding-bottom:10px;}
	.delivery_process table p{width:calc(100% - 95px); display: inline-block;}
	.delivery_process p.delivery_chk{padding:5px 15px; width: auto;}
	.delivery_process td:before{display:inline-block; font-size:15px; color:#0071da; margin-bottom:3px; font-weight:600; width:80px;}
	.delivery_process td:nth-child(1):before{content: '취급점'; margin-top: 10px;}
	.delivery_process td:nth-child(2):before{content: '처리일시'; }
	.delivery_process td:nth-child(3):before{content: '담당자'; }
	.delivery_process td:nth-child(4):before{content: '배송상황'; vertical-align: top;}
	
	.pop_wrap{width:700px; left:calc(50% - 350px); top:9vw; max-height: 80%;}
	
}



@media screen and (max-width:720px) {
	.br_span{display: inline;}
	
	header>nav{top:30px;}
	
	aside{padding-top: 30px;}
	aside>div>a{display: block; width:80px; margin: 0 auto;}
	.sub_top_text{margin-top:0px;}
	.lnb{display: none;}
	.sub_top_text>img{display: none;}
	
	footer{padding:30px 10px;}
	.foot_term{width: 100%;}
	.foot_term p{display: none;}
	
	
	/* 고객센터 */
	.board_page .search_area form select { max-width:100%; margin-bottom:3px; background-position:99%;}
	.board_page .search_area form input[type=text] {max-width:100%; margin-bottom:3px; box-sizing: border-box;}
	.board_page .search_area form .btn  {max-width:100%; }
	.board_page .search_area form .btn  {max-width:100%; }
	.date{display: none;}
	.board_page .notice_list li .text_wrapper{width: 100%;}
	.board_page .notice_list li .text_wrapper .text_wrap{width: 100%;}
	
	
	
	/* 운송장번호 */
	.barcode_wrap input{width:100%; font-size:1.1em; padding: 9px 10px;}
	
	/*	waybill_view */
	.pop_wrap{width:90%; left:5%; top:10px; padding:70px 15px 10px; height: 95%; overflow:hidden;  overflow-y:auto;  -webkit-overflow-scrolling:touch;}
	.pop_info li{width:50%;}
	.pop_info li:nth-child(3){border-left: 1px solid #999; border-top:none;}
	.pop_info li:nth-child(4){border-top:none;}
	.pop_process {margin-top: 30px;}
	.pop_process li {padding: 7px;}
	.pop_process li p{margin-bottom:5px;}
	.pop_process li p:nth-child(1) {width:100%;}
	.pop_process li p:nth-child(2) {width:100%;}
	.pop_process li p:nth-child(3) {width:100%; margin-bottom:0px;}
	.pop_process+p{margin-top:30px;}
	
}



@media screen and (max-width:480px) {
	
	header{padding-top:0px;}
	header>nav {right: 20px;top: 20px;}
	nav img{width: 25px;}
	aside{padding-bottom:30px; margin-bottom:50px;}
	.gnb{padding-top:50px;}
	aside>div>a {width: 70px;}
	
	.sub_top_text{display: none;}
	.title_wrap h5{font-size:1.8em;}
	.title_wrap h5 span{display: none;}
	.title_wrap>p{font-size:0.8em;}
	
	footer{font-size:0.6em;}
	.foot_term {width:100%; padding: 20px 10px;}
	.foot_term p{display: block;}
	
	
	/* 고객센터 */
	.cs_wrap .cs_num_wrap{width: auto;}
	.cs_num_wrap>p{float: none;}
	.cs_wrap .cs_num_wrap>p:last-child{border:none; padding-left:0px; margin-left:0px}
	.board_page .notice_list li .text_wrapper .text_wrap .subject {font-size:17px;}
	
	
	/* waybill_view */
	.pop_wrap strong {font-size:1.3em;}
	.pop_info li{width:100%; padding:5px 0px;}
	.pop_info li:first-child{border-bottom:none;}
	.pop_info li:nth-child(2n){border-left:1px solid #999;}
	.delivery_info li{width:100%; margin:8px 0px;}
	.delivery_info li:nth-child(2n) {margin-left:0%;}
	/* .delivery_info li:nth-child(2n-1){margin-right:0%;} */
	.delivery_info li p {padding: 4px 0px;}
	.pop_wrap .notice{display: none;}
	
	
}