/* 헤더, 푸터만 디자인하는 css */

html, body {width:100%;}

/* 띠배너 */
#line_banner {
    background:#F8DF7D;
    width:100%; height:46px;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
}
#line_banner .contents {display:flex; align-items:center;}
#line_banner .contents img {/* 쿠폰 이미지 */
    width:30px; height:20px; margin-right:10px;
}
#line_banner .contents p {font-size:0.875rem;}
#line_banner .contents p em {color:#FF0000;}
#line_banner > img {/* close버튼 */
    width:24px; height:24px;
    position:absolute; right:251px; top:11px;
}
/* ----------------------------header 시작 */
header {
    width:100%; height:152px;
    min-width:320px;
    position:relative;/* lnb_bg의 부모위치기준 */
}
header .top_wrap {
    display:flex;
    padding:20px 250px;
    justify-content:space-between;
    align-items:center;
}
header .top_wrap h1 {
    /* position:absolute; left:50%; */
}
header .top_wrap h1 a {}
header .top_wrap h1 a img {}
header .top_wrap #search_bar {
    position:relative;/* 검색버튼의 부모위치기준 */
}
header .top_wrap #search_bar #search {/* 인풋태그 */
    width:480px; height:55px;
    padding:0 22px;
    border:2px solid #6CC0C9;
    border-radius:30px;
}
header .top_wrap #search_bar #search::placeholder {
    color:#aaa; font-size:0.875rem;
}
header .top_wrap #search_bar a {/* 검색버튼 */
    position:absolute; top:12.5px; right:22px;
}
header .top_wrap #search_bar a img {}
header .top_wrap #user_menu {}
header .top_wrap #user_menu #user_top {
    display:flex; gap:10px; align-items:center;
    margin-bottom:10px;
}
header .top_wrap #user_menu #user_top > a {font-size:0.938rem;}
header .top_wrap #user_menu #user_top #login {}
header .top_wrap #user_menu #user_top img {/* 구분선 */}
header .top_wrap #user_menu #user_top #join {}
header .top_wrap #user_menu #user_top #cs_center {
    margin-right:none;
}
header .top_wrap #user_menu #user_bottom {
    display:flex; align-items:center; height:32px;
    float:right;
}
header .top_wrap #user_menu #user_bottom a {
    margin-right:20px;
}
header .top_wrap #user_menu #user_bottom a:last-child {
    margin-right:0;
}
header .top_wrap #user_menu #user_bottom a img {}
header nav {
    border-top:1px solid #eee;
    border-bottom:1px solid #eee;
    display:flex; justify-content:space-between;
    padding:14px 250px;
}
header nav .gnb_left {
    display:flex; align-items:center;
    gap:30px; 
}
header nav .gnb_left li {}
header nav .gnb_left li a {}
header nav .gnb_left li a img {}
header nav .gnb_right {
    display:flex; align-items:center;
    gap:30px; 
}
header nav .gnb_right li {}
header nav .gnb_right li a {
    display:flex; align-items:center;
}
header nav .gnb_right li a img {margin-right:8px;}
/* nav 호버시 나오는 디자인 */
header .lnb_bg {
    opacity:0; overflow:hidden;/* 초기숨기기 */
    pointer-events:none;/* 영역선택X */
    transition:opacity 0.2s ease;
    z-index:20;
    position:absolute;/* header에 위치설정 */
    top:100%; left:0;
    width:100%; height:274px;
    background-color:#fff;
}
header nav:hover + .lnb_bg, .lnb_bg:hover {
    opacity:1;/* nav와 .lnb_bg에 hover시 .lnb_bg보이기 */
    pointer-events:all;/* 보이는상태일때 영역선택O */
}
header .lnb_bg .lnb_container {
    display:flex; justify-content:space-between;
    padding:30px 250px;
}
header .lnb_bg .lnb_container .left {
    width:361px; display:flex;
    position:relative;
}
header .lnb_bg .lnb_container .left::after {
    content:''; display:block;
    background:#ddd; width:1px; height:150px;
    position:absolute; left:519px; top:32px;
}
header .lnb_bg .lnb_container .left .lnb1 {margin-right:137px;}
header .lnb_bg .lnb_container .left .lnb1 li {margin-bottom:15px;}
header .lnb_bg .lnb_container .left .lnb1 li:last-child {margin-bottom:0;}
header .lnb_bg .lnb_container .left .lnb1 li a {}
header .lnb_bg .lnb_container .left .lnb2 {}
header .lnb_bg .lnb_container .left .lnb2 li {margin-bottom:15px;}
header .lnb_bg .lnb_container .left .lnb2 li:last-child {margin-bottom:0;}
header .lnb_bg .lnb_container .left .lnb2 li a {}
header .lnb_bg .lnb_container .right {display:flex;}
header .lnb_bg .lnb_container .right .img_wrap {
    display:flex; gap:20px;
    margin-right:62px;
}
header .lnb_bg .lnb_container .right .img_wrap * img {margin-bottom:14px;}
header .lnb_bg .lnb_container .right .img_wrap * p:nth-of-type(2) {
    color:#999; font-size:0.875rem; margin-top:5px;}
header .lnb_bg .lnb_container .right .img_wrap .lnb3 {}
header .lnb_bg .lnb_container .right .img_wrap .lnb3 li {}
header .lnb_bg .lnb_container .right .img_wrap .lnb3 li a {}
header .lnb_bg .lnb_container .right .img_wrap .lnb3 li a img {}
header .lnb_bg .lnb_container .right .img_wrap .lnb3 li a p:nth-child(1) {}
header .lnb_bg .lnb_container .right .img_wrap .lnb3 li a p:nth-child(2) {}
header .lnb_bg .lnb_container .right .img_wrap .lnb4 {}
header .lnb_bg .lnb_container .right .img_wrap .lnb4 li {}
header .lnb_bg .lnb_container .right .img_wrap .lnb4 li a {}
header .lnb_bg .lnb_container .right .img_wrap .lnb4 li a img {}
header .lnb_bg .lnb_container .right .img_wrap .lnb4 li a p:nth-child(1) {}
header .lnb_bg .lnb_container .right .img_wrap .lnb4 li a p:nth-child(2) {}
header .lnb_bg .lnb_container .right .img_wrap .lnb5 {}
header .lnb_bg .lnb_container .right .img_wrap .lnb5 li {}
header .lnb_bg .lnb_container .right .img_wrap .lnb5 li a {}
header .lnb_bg .lnb_container .right .img_wrap .lnb5 li a img {}
header .lnb_bg .lnb_container .right .img_wrap .lnb5 li a p:nth-child(1) {}
header .lnb_bg .lnb_container .right .img_wrap .lnb5 li a p:nth-child(2) {}
header .lnb_bg .lnb_container .right .lnb6 {}
header .lnb_bg .lnb_container .right .lnb6 li {margin-bottom:15px;}
header .lnb_bg .lnb_container .right .lnb6 li:last-child {margin-bottom:0;}
header .lnb_bg .lnb_container .right .lnb6 li a {}
/* ----------------------------header 끝 */

/* ----------------------------footer 시작 */
footer {}
footer .footer_top {
    display:flex; justify-content:space-between;
    padding:20px 250px;
    border-top:1px solid #eee;
    border-bottom:1px solid #eee;
}
footer .footer_top .left {}
footer .footer_top .left a {
    margin-right:40px; font-weight:500;
}
footer .footer_top .left a:last-child {margin-right:0;}
footer .footer_top .right {display:flex;}
footer .footer_top .right p {
    margin-right:30px;
    font-weight:500;
}
footer .footer_top .right span {
    font-size:0.875rem; color:#444;
}
footer .footer_bottom {
    padding:30px 250px 100px 250px;
    display:flex; justify-content:space-between;
}
footer .footer_bottom .company_info {}
footer .footer_bottom .company_info > p {margin-bottom:10px;}
footer .footer_bottom .company_info > p em {font-weight:500;}

/* 모든 글자 속성 동일하게 맞추기 */
footer .footer_bottom .company_info_top, footer .footer_bottom .company_info_bottom {color:#444; font-size:0.75rem;}
footer .footer_bottom .company_info_top *, footer .footer_bottom .company_info_bottom * {color:inherit; font-size:inherit;}

footer .footer_bottom .company_info .company_info_top {margin-bottom:40px;}
footer .footer_bottom .company_info .company_info_top .row1 {margin-bottom:10px;}
/* 모든 글자 사이 간격 설정 */
footer .footer_bottom .company_info .company_info_top .row1 * {margin-right:20px;}
footer .footer_bottom .company_info .company_info_top .row1 *:last-child {margin-right:0;}
footer .footer_bottom .company_info .company_info_top .row1 span {}
footer .footer_bottom .company_info .company_info_top .row1 a {text-decoration:underline;}
footer .footer_bottom .company_info .company_info_top .row2 {margin-bottom:10px;}
footer .footer_bottom .company_info .company_info_top .row2 * {margin-right:20px;}
footer .footer_bottom .company_info .company_info_top .row2 *:last-child {margin-right:0;}
footer .footer_bottom .company_info .company_info_top .row2 span {}
footer .footer_bottom .company_info .company_info_top .row3 {margin-bottom:10px;}
footer .footer_bottom .company_info .company_info_top .row3 span {}
footer .footer_bottom .company_info .company_info_top .row4 {}
footer .footer_bottom .company_info .company_info_top .row4 span {}
footer .footer_bottom .company_info .company_info_bottom {}
footer .footer_bottom .company_info .company_info_bottom span {margin-right:20px;}
footer .footer_bottom .company_info .company_info_bottom a {text-decoration:underline;}
footer .footer_bottom .company_info .company_info_bottom p {margin-top:10px;}
footer .footer_bottom .notice_sns {}
footer .footer_bottom .notice_sns .notice {
    text-align:right;
}
footer .footer_bottom .notice_sns .notice a {
    display:block; margin-bottom:10px; color:#444; font-size:0.875rem;
}
footer .footer_bottom .notice_sns .notice a:first-child {
    font-weight:500; font-size:1rem; color:#000;
}
footer .footer_bottom .notice_sns .notice a:last-child {
    margin-bottom:0;
}
footer .footer_bottom .notice_sns .sns {
    margin-top:20px; text-align:right;
}
footer .footer_bottom .notice_sns .sns a {margin-right:10px;}
footer .footer_bottom .notice_sns .sns a:last-child {margin-right:0;}
footer .footer_bottom .notice_sns .sns a img {}


/* ----------------------------footer 끝 */