@charset "UTF-8";
/* @font-face {
    font-family: 'sw';
    font-style: normal;
    font-weight: 400;
    src: url(../font/Subway-Footlong.eot);
    src: url(../font/Subway-Footlong.eot?#iefix) format('embedded-opentype'),
         url(../font/Subway-Footlong.woff) format('woff'),
         url(../font/Subway-Footlong.ttf) format('truetype');
} */

/* font-face사용법
1. 서체명을 굵기별로 다르게 지정하는 방법
2. 서체명은 동일하게 하고 굵기를 다르게 지정하는 방법(일반적인 방식)
normal 400, mediun 500, bold 700, extra_bold 800 */

/* 모든요소 box-sizing: border-box; 적용 */
/* *, :before, :after { box-sizing: border-box; } */

/* 내용없어도 세로 스크롤바 나오게 */
/* html {overflow-y: scroll;} */

*, :before, :after {box-sizing: border-box;}

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,address,code,em,img,strong,sub,sup,b,u,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figure,figcaption,footer,header,hgroup,menu,nav,section,main,audio,video {margin: 0; padding: 0; -webkit-tab-highlight-color: rgba(0,0,0,0.1); }

/*html5추가 시멘틱엘리먼트를 익스하위버전에서 블럭으로 인식되도록함*/
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display: block}

/* button태그에 손모양 커서 */
button {cursor:pointer}
/* 익스하위버전에서 이미지 선없애기 */
fieldset,img {border: 0; vertical-align: top}
/* 리스트 기호 빼기 */
ol,ul,li {list-style: none}
/* 태그 기본 기울임꼴 제거 */
address,em {font-style: normal}
/* 페이지안에서 가장 많은 링크색 지정 */
/* a태그컬러는 디자인시안상에 가장 많은 컬러로 변경해야함 */
a {text-decoration: none; color: #666;}
/* iframe으로 외부컨텐츠를 연결했을때
외부컨텐츠안쪽내용이 우리페이지에 영향을 주지못하도록 가려줌
*/
iframe {overflow: hidden; border: 0}
/* 칸의 선을 합치기, 칸의 간격없애기, 가로를 늘려줌 */
table {border-collapse: collapse; border-spacing: 0; width: 100%}
/* 굵기 빼고 헤딩태그 폰트크기를 body에 선언한 크기와 일치시킴 */
h1,h2,h3,h4,h5,h6 {font-weight: normal; font-size: 100%}
/* 폼요소의 높이가 다를때 요소끼리 세로정렬시킴 */
input,select,textarea,button {
    vertical-align: middle;
    margin: 0;
    padding: 0;
    border-radius: 0;
    -webkit-tab-highlight-color: rgba(0,0,0,0.1);
    /* ios 에서 폼요소에 선이 있을경우 그림자생성 방지 */
    -webkit-appearance: none;
    appearance: none;
}

/* textarea 리사이즈기능 빼기 */
textarea {resize: none}
/* 페이지안의 모든 폰트의 줄간격을 1.5로 통일시킴
모바일 크롬, 모바일 사파리 브라우져의 텍스트 자동확대 방지
*/
/* 벤더프리픽스(제조사접두어) 를 이용하여 적용해야 하는 브라우저별 특수 속성에 사용
 -webkit- : 크롬, 사파리
 -moz- : 파이어폭스
 -ms- : 익스플로러
 -o- : 오페라 (모바일만 사용중, pc망함) */
body {line-height: 1.5; -webkit-text-size-adjust:none}





/* ***************공통스타일*************** */

/* 폼요소는 폰트가 브라우저마다 지정되어있으므로 따로선언 */
body,input,button,select,textarea,table {
    font-family: 'Noto Sans KR','맑은 고딕','malgun gothic','돋움','dotum',sans-serif;
    font-size: 18px;
    color: #000;
    letter-spacing: -0.025em;
}

/* 스킵네비게이션 */
#skipNavi {position: relative;}
#skipNavi a { position: absolute; top: -9999px; left: 0; line-height: 40px; background: #ddd; text-align: center; width: 100%; font-size: 14px; }
#skipNavi a:hover, 
#skipNavi a:active, 
#skipNavi a:focus { top: 0; }

/* 글자선택시 배경색, 글자색 변경 */
/* ::-moz-selection{ background-color: #ef151e; color: #ffffff;}
::selection{ background-color: #ef151e; color: #ffffff;} */

/* legend,caption,메뉴제목,섹션제목 블라인드 */
/* legend(폼 제목), caption(표 제목)을 시각적으로 보이지 않게 처리 */
legend,caption,.blind, input[type="checkbox"], input[type="radio"], input[type="file"] {position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px}

/* overlow:hidden 으로 float해제 못할경우 사용 */
.clearfix:after {
    content: '';
    display: block;
    clear: both;
}

/* 폰트컬러 공통 */
/* .orange {color: #eb6242 !important;} */

/* 버튼스타일 공통 */
button {
    outline: none;
}

.btn_point {
    display: inline-block;
    line-height: 50px;
    background: #009223;
    border-radius: 50px;
    padding: 0 20px;
    font-size: 18px;
    color: #fff;
    font-weight: 700;
    box-sizing: border-box;
    text-align: center;
    margin: 0 4px;
}
.btn_point:after {
    content: '';
    display: inline-block;
    width: 21px;
    height: 16px;
    background: url(../images/icon_reg.png) no-repeat;
    margin-left: 5px;
}

.btn_red {
    background: #e41937;
    border: none;
    color: #fff;
    box-sizing: border-box;
}
.btn_white {
    border: 2px solid #e41937;
    color: #e41937;
    box-sizing: border-box;
    background: #fff;
}
.btn_brown {
    background: #635a5b;
    width: 100px;
    height: 40px;
    font-size: 14px;
    color: #fff;
    border: none;
    /* margin-left: 10px; */
}


/* 폼요소 공통 */
/* placehold 컬러 */
/* 앞에 태그 제거시 input,textarea 동시적용 */
input::-webkit-input-placeholder {color:#bbb;}
input:-moz-placeholder {color:#bbb;}
input::-moz-placeholder {color:#bbb; opacity:1;}
/* 익스는 우선순위를 높여야 색이 나옴 */
input:-ms-input-placeholder {color:#bbb !important;}

textarea::-webkit-input-placeholder {color:#bbb;}
textarea:-moz-placeholder {color:#bbb;}
textarea::-moz-placeholder {color:#bbb; opacity:1;}
textarea:-ms-input-placeholder {color:#bbb;}

/* ie10, ie11 input x버튼 가리기 */
input[type="text"]::-ms-clear {
    display: none;
}
/* ie10, ie11 password 눈버튼 가리기 */
input[type="password"]::-ms-reveal {
    display: none;
}

/* 제목스타일 공통 */


/* input 스타일 공통 */
/* 인접형제선택자로 checkbox다음에 오는label선택 */
input[type="checkbox"] + label {
    position: relative;
    padding-left: 30px;
    line-height: 20px;
    cursor: pointer;
    font-size: 14px;
    color: #999;
}
input[type="checkbox"] + label em {  color: #009223; }
input[type="checkbox"] + label:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #999;
    background: #f8f8f8;
    box-sizing: border-box;
}
input[type="checkbox"] + label:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0px;
    height: 20px;
    background: url(../images/main_sprite.png) no-repeat -346px -153px;
    /* transition: all 0.2s; */
}
input[type="checkbox"]:checked + label:after {
    width: 20px;
}

/* input text 공통 */
input,select,textarea { outline: none; }
input[type="text"] {
    height: 40px;
    background: #f8f8f8;
    width: 250px;
    border: 1px solid #635a5b;
    padding: 0 15px;
    /* color: #292929; */
    box-sizing: border-box;
    font-size: 16px;
}

input.input_small {
    width: 200px;
}

/* select 공통 */
.select_wrap {
    /* 테이블 안에서 좌우는 inline-block */
    display: inline-block;
    width: 250px;
    border: 1px solid #635a5b;
    box-sizing: border-box;
    position: relative;
}

.select_wrap select {
    width: 100%;
    height: 40px;
    border: none;
    padding-left: 15px;
    color: #635a5b;
    font-size: 14px;
    background: #f8f8f8;
    cursor: pointer;;
    vertical-align: top;
}

.select_wrap:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 15px;
    width: 7px;
    height: 6px;
    margin-top: -3px;
    background: url(../images/sub_inquiry_select_arr.png) no-repeat;
    pointer-events: none;
}

/* 익스 화살표제거 */
select::-ms-expand {
    display: none;
}

/* textarea 공통 */
textarea {
    background: #f8f8f8;
    border: 1px solid #635a5b;
    width: 100%;
    padding: 15px;
    color: #000;
    font-size: 14px;
    box-sizing: border-box;
}

/* input file 공통 */
.file_wrap + .file_wrap {margin-top: 20px;}

.file_wrap input[type="text"] {
    display: inline-block;
}
.file_wrap .btn_file {display: inline-block;}

/* .file_wrap label {
    position: absolute;
    top: 0;
    right: 0;
    width: 98px;
    height: 41px;
    cursor: pointer;
    color: #009223;
    line-height: 41px;
    text-align: center;
    font-weight: 500;
    background: #fff;
}
.file_wrap label:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    height: 16px;
    width: 2px;
    margin-top: -8px;
    background: #ddd;
} */


/* 테이블 공통 */
.table_wrap {
    border-top: 1px solid #000;
}
/* 표 안의 데이터가 길 경우 칸이 자동으로 늘어나지 못하게함 */
.table_wrap table { table-layout: fixed; }
.table_wrap table th { font-weight: 500; color: #635a5b; padding-left: 30px;}
/* .table_wrap table .th01,.th03 { width: 10%;} */
/* .table_wrap table .th03 { width: 10%;} */
.table_wrap table th,
.table_wrap table td {
    border-bottom: 1px solid #e4e4e4;
    font-size: 16px;
    padding: 18px 0 18px 30px;
    text-align: left;
}
.table_wrap table tbody td { color: #555; padding: 11px 80px 11px 0;}
.table_wrap table tr:last-child th,
.table_wrap table tr:last-child td { border-bottom: 1px solid #000;}


/* 게시판 테이블 공통 */
.tbl_wrap {border-top: 2px solid #635a5b;}
.tbl_wrap table {table-layout: fixed;}
.tbl_wrap table thead th {border-bottom: 1px solid #635a5b;}
.tbl_wrap table thead th,
.tbl_wrap table tr td {
    text-align: center;
    color: #555;
    height: 64px;
    font-size: 16px;
}

.tbl_wrap table tr td {
    border-bottom: 1px solid #e4e4e4;
}
.tbl_wrap table tr td:nth-child(2) {
    text-align: left;
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.tbl_wrap table tr td:nth-child(2) a {
    display: block;
    line-height: 64px;
    color: #555;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    /* padding: 11px 20px; */
}
.tbl_wrap table tr:last-child td {
    border-bottom: 1px solid #635a5b;
}
/* 게시판 pagination 공통 */
.icon { position: relative; }
.icon:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    transform: translate(-50%, -50%);
    background: url(../images/sub_notice_first.png) no-repeat ;
}

.tbl_wrap .pagination_wrap {
    text-align: center;
    padding-top: 50px;
}
.tbl_wrap .pagination_wrap .pagination {
    display: inline-block;
    /* 인라인블럭 하단에 간격생길경우 사용 */
    vertical-align: top;
}
.tbl_wrap .pagination .btn_page {
    float: left;
    font-size: 16px;
    color: #777;
    line-height: 20px;
    height: 20px;
}
.tbl_wrap .pagination .btn_page {
    margin: 0 5px;
}
.tbl_wrap .pagination .first,
.tbl_wrap .pagination .prev,
.tbl_wrap .pagination .next,
.tbl_wrap .pagination .last {
    width: 20px;
    text-indent: -9999px;
    position: relative;
    background: #f8f8f8;
    border: 1px solid #635a5b;
    box-sizing: border-box;
}
.tbl_wrap .pagination .prev.icon:after {
    background-image: url(../images/sub_notice_prev.png);
}
.tbl_wrap .pagination .next.icon:after {
    background-image: url(../images/sub_notice_next.png);
}
.tbl_wrap .pagination .last.icon:after {
    background-image: url(../images/sub_notice_last.png);
}
.tbl_wrap .pagination .btn_page.prev {margin-right: 24px;}
.tbl_wrap .pagination .btn_page.next {margin-left: 24px;}

.tbl_wrap .pagination .num {
    width: 20px;
    box-sizing: border-box;
    font-weight: 500;
}
.tbl_wrap .pagination .num.on {
    color: #e41937;
}

/* 파일 다운로드 공통 */
.btn_down {
    display: inline-block;
    text-indent: -9999px;
    padding: 7px 3px;
    position: relative;
}
.btn_down:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #000;
    display: none;
}
.btn_down:hover:before { display: block; }
.btn_down:hover:after { transform: translateY(-1px); }
.btn_down:after {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    background: url(../images/sprite_pc_new.png) no-repeat;
}
/* 파일 다운로드 아이콘 sprite */
.btn_down.pdf:after { background-position: -125px 0 }
.btn_down.mp4:after{background-position: 0 0;}
.btn_down.excel:after{background-position: -100px 0;}
.btn_down.word:after{background-position: -75px 0;}
.btn_down.ppt:after{background-position: -50px 0;}
.btn_down.txt:after{background-position: -26px 0;}


.easeOutExpo {
	-webkit-transition-timing-function:cubic-bezier(0.190, 1.000, 0.220, 1.000) !important; 
	-moz-transition-timing-function:cubic-bezier(0.190, 1.000, 0.220, 1.000) !important; 
	-o-transition-timing-function:cubic-bezier(0.190, 1.000, 0.220, 1.000) !important; 
	transition-timing-function:cubic-bezier(0.190, 1.000, 0.220, 1.000) !important; /* easeOutExpo */
}

/* top 버튼 */
.btn_top {
    position: fixed;
    bottom: 15px;
    right: 15px;
    z-index: 999;
    display: none;
}

.btn_top a {
    display: block;
    width: 50px;
    height: 50px;
    box-sizing: border-box;
    border-radius: 45px;
    background: #999;
    text-indent: -9999px;
    position: relative;
}
.btn_top a:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 45px;
    margin: -23px 0 0 -30px;
    background: url(../images/ico_top.png) no-repeat 50% 50%;
}






/* body { height: 4000px; } */
/* html,body { height: 100%; } */

#wrap {
    min-width: 320px;
    overflow: hidden;
}
#wrap.active {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}




/* *************** header *************** */
#header { position: fixed; top: 0; left: 0; min-width: 320px; width: 100%; height: 61px; border-bottom: 1px solid #e5e5e5; background: #fff; z-index: 9999; }


/* 로고 */
#header .logo {text-align: center; padding-top: 10px;}

#header .logo img { height: 40px;}


/* 로그인버튼 */
#header .btn_login_ico {position: absolute; top: 0; left: 0; width: 57px; height: 60px; background: url(../images/m_main_btn_login.png) no-repeat; background-size: 57px; text-indent: -9999px; }


/* 매뉴열기 버튼 */
#header .btn_menu {position: absolute; top: 0; right: 0; width: 60px; height: 60px; background: url(../images/m_main_btn_menu.png) no-repeat; background-size: 60px; text-indent: -9999px; border: none;}


/* gnb */
#header .gnb_wrap {position: fixed; top: 0; right: 0; width: calc(100% - 30px); height: 100%; background: #fff; z-index: 9999; transform: translateX(100%); transition: all 0.5s;}


/* 메뉴 열림닫힘 */
#header .gnb_wrap.active {transform: translateX(0);}


/* 탑gnb, 유틸 & 닫기버튼 */
#header .gnb_wrap .top_gnb { height: 60px; border-bottom: 1px solid #ddd;}

#header .gnb_wrap .top_gnb .util_wrap {padding: 10px 0 10px 20px; overflow: hidden;}

#header .gnb_wrap .top_gnb .util_wrap a { float: left; color: #e41937; font-weight: 500; line-height: 40px; text-align: center; padding: 0 10px; position: relative; }
#header .gnb_wrap .top_gnb .util_wrap a + a:before {
    content: '';
    position: absolute;
    top: 13px;
    left: 0;
    width: 1px;
    height: 16px;
    background: #222;
}

#header .gnb_wrap .top_gnb .util_wrap a:last-child {color: #222; font-weight: 400;}

#header .gnb_wrap .top_gnb .util_wrap .btn_white { line-height: 36px; margin-left: 6px;}

#header .gnb_wrap .top_gnb .btn_close { position: absolute; top: 0; right: 0; width: 60px; height: 60px; background: url(../images/m_main_gnb_close.png) no-repeat; background-size: 60px; border: none; text-indent: -9999px; }


/* 바텀gnb, 메뉴 */
#header .gnb_wrap .bottom_gnb {height: calc(100% - 60px); overflow-y: auto; position: relative;}

#header .gnb_wrap .bottom_gnb .gnb>li>a {display: block; line-height: 60px; border-bottom: 1px solid #ddd; padding-left: 30px; color: #222; font-weight: 500; position: relative;}

#header .gnb_wrap .bottom_gnb .gnb>li>a.active { color: #e41937;}


/* list 화살표 */
#header .gnb_wrap .bottom_gnb .gnb>li>a:after {content: ''; position: absolute; top: 50%; right: 30px; width: 11px; height: 7px; margin-top: -3px; background: url(../images/m_main_down_arr2.png) no-repeat; background-size: 11px;}
#header .gnb_wrap .bottom_gnb .gnb>li>a.active:after {transform: rotate(180deg);}

#header .gnb_wrap .bottom_gnb .gnb .depth2 {background: #eee; padding: 10px 0; display: none;}

#header .gnb_wrap .bottom_gnb .gnb .depth2 li a {display: block; line-height: 40px; padding-left: 30px; font-size: 16px;}


/* sns */
#header .gnb_wrap .bottom_gnb .sns_wrap {width: 100%; text-align: center; padding: 80px 0 40px;}

#header .gnb_wrap .bottom_gnb .sns_wrap .sns {display: inline-block; overflow: hidden;}

#header .gnb_wrap .bottom_gnb .sns_wrap .sns li {float: left;}

#header .gnb_wrap .bottom_gnb .sns_wrap .sns li a { display: block; width: 60px; height: 34px; background: url(../images/m_main_sprite.png) no-repeat; background-size: 260px; text-indent: -9999px; }
#header .gnb_wrap .bottom_gnb .sns_wrap .sns li:nth-child(2) a { width: 64px;background-position-x: -60px;}
#header .gnb_wrap .bottom_gnb .sns_wrap .sns li:nth-child(3) a { width: 48px;background-position-x: -124px;}
#header .gnb_wrap .bottom_gnb .sns_wrap .sns li:nth-child(4) a { width: 64px;background-position-x: -172px;}


/* gnb 뒷배경 딤처리 */
#header .gnb_bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); display: none; }
#header .gnb_bg.active { display: block; }
/* *************** /header *************** */





/* *************** 메인페이지 *************** */
/* *************** container *************** */
#container { padding: 60px 0;}


/* 섹션제목 공통 */
#container .main_tit {
    font-size: 30px;
    font-weight: 700;
    color: #000;
    text-align: center;
}



/* ***** main_slider ***** */
#container .main_slider .swiper-wrapper a img { width: 100%;}

#container .main_slider .swiper-pagination {bottom: 10px;}

#container .main_slider .swiper-pagination-bullet { width: 15px; height: 15px; background: #fff; opacity: 1; border-radius: 50%; margin: 0 10px; }

#container .main_slider .swiper-pagination-bullet-active { background: #e41937; }
/* ***** /main_slider ***** */



/* ***** main_menu ***** */
#container .main_menu {padding-top: 60px;}


/* 탭메뉴 슬라이더 */
#container .main_menu .tab_menu_slider {padding: 30px 15px;}

#container .main_menu .tab_menu_slider .swiper-slide {width: auto;}

#container .main_menu .tab_menu_slider a {display: block; font-size: 16px; color: #2e2e2e;}

#container .main_menu .tab_menu_slider a.on {color: #e41937; font-weight: 500;}

#container .main_menu .tab_menu_slider .swiper-scrollbar { 
    height: 2px;
    bottom: 20px;
    width: calc(100% - 30px);
    left: 50%;
    transform: translateX(-50%);
}

#container .main_menu .tab_menu_slider .swiper-scrollbar .swiper-scrollbar-drag {
    height: 3px;
    background: #e41937;
}


/* 메뉴 슬라이더 */
#container .main_menu .tab_con .menu_slider_wrap {height: 0; overflow: hidden;}
#container .main_menu .tab_con .menu_slider_wrap.on {height: auto;}

#container .main_menu .menu_slider {padding: 0 15px;}

#container .main_menu .menu_slider .swiper-slide img {width: 100%;}

#container .main_menu .menu_slider .swiper-slide a {display: block;}

#container .main_menu .menu_slider .swiper-slide a .txt_wrap {padding: 10px; border: 1px solid #d5d5d5; border-top: none;}

#container .main_menu .menu_slider .swiper-slide a .txt_wrap .tit { height: 54px; color: #000; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
/* ***** /main_menu ***** */



/* ***** main_service ***** */
#container .main_service {padding-top: 60px;}

#container .main_service .service_inner { background: #dedede; padding: 20px 0; }

#container .main_service .service_inner li + li {padding-top: 40px; position: relative;}
#container .main_service .service_inner li + li:before { content: ''; position: absolute; top: 19px; left: 0; width: 100%; height: 2px; background: #fff; }

#container .main_service .service_inner .form_box .btn_service { font-size: 20px; margin: 0 0 0 -5px; width: 120px; height: 50px; padding: 0 10px; vertical-align: middle; }


/* 메인서비스 온라인주문 select */
#container .main_service .service_inner .form_box .select_box { display: inline-block; width: calc(100% - 120px); border: 2px solid #e41937; background: #fff; position: relative; vertical-align: middle; z-index: 0; }
#container .main_service .service_inner .form_box .select_box:after { content: ''; position: absolute; top: 18px; right: 15px; width: 16px; height: 10px; background: url(../images/main_sprite.png) no-repeat -272px -153px; z-index: -1; }

#container .main_service .service_inner .form_box select { width: 100%; height: 46px; font-size: 18px; color: #828282; padding: 0 31px 0 15px; cursor: pointer; border: none; background: none; }


/* 메인서비스 매장찾기 input */
#container .main_service .service_inner .form_box input { width: calc(100% - 120px); height: 50px; border: 2px solid #979797; box-sizing: border-box; font-size: 18px; background: #fff; }


/* input 매장찾기 버튼 */
#container .main_service .service_inner .form_box .btn_search { background: #979797; }
/* ***** /main_service ***** */



/* ***** main_brand_int ***** */
#container .main_brand_int {padding-top: 60px;}

#container .main_brand_int .brand_inner {padding:20px 15px; background: url(../images/m_main_brand_bg.png) no-repeat 50% 0; background-size: cover;}

#container .main_brand_int .brand_box {width: 100%; background: rgba(0, 0, 0, 0.85); padding: 50px 20px;}

#container .main_brand_int .brand_box .txt_wrap h4 {font-size: 30px; color: #fff; font-weight: 500;}

#container .main_brand_int .brand_box .txt_wrap h3 {font-size: 70px; color: #fff; font-weight: 500; line-height: 1.2;}

#container .main_brand_int .brand_box .txt_wrap h3 em {color: #e41937;}

#container .main_brand_int .brand_box .txt_wrap p {font-size: 16px; color: #dbdbdb; line-height: 30px; padding-top: 15px;}

#container .main_brand_int .brand_box .btn_wrap {padding-top: 40px;}

#container .main_brand_int .brand_box .btn_wrap .btn_brand {display:block; width: 125px; line-height: 36px; border: 2px solid #fff; font-size: 15px; color: #fff;
text-align: center;}


/* ***** /main_brand_int ***** */



/* ***** main_event ***** */
#container .main_event {padding: 60px 0 0 15px; position: relative;}

#container .main_event h2 {text-align: left;}

#container .main_event .event_slider_wrap {padding-top: 30px;}

#container .main_event .event_slider .swiper-slide {width: 190px;}

#container .main_event .event_slider .img_wrap img {width: 190px;}

#container .main_event .event_slider .txt_wrap {padding: 10px; text-align: center; background: #f8f8f8;}

#container .main_event .event_slider .txt_wrap h3 {font-size: 16px; color: #000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}

#container .main_event .event_slider .txt_wrap p {font-size: 14px;}

#container .main_event .btn_more {position: absolute; top: 70px; right: 15px; width: 25px; height: 25px; background: url(../images/m_main_more.png) no-repeat; background-size: 25px; text-indent: -9999px;}

/* ***** main_event ***** */



/* ***** main_quick ***** */
#container .main_quick {padding: 60px 15px 0;}

#container .main_quick .quick_wrap {overflow: hidden;}

#container .main_quick .quick_wrap li { float: left; width: 50%; text-align: center; padding: 15px 0; }

#container .main_quick .quick_wrap li a {display: block; font-size: 18px; color: #292929; padding-top: 70px; position: relative;}
#container .main_quick .quick_wrap li a:before { content: ''; position: absolute; top: 0; left: 50%; width: 65px; height: 65px; margin-left: -32px; background: url(../images/m_main_sprite.png) no-repeat; background-size: 260px; background-position-y: -34px; }
#container .main_quick .quick_wrap li:nth-child(2) a:before {background-position-x: -65px;}
#container .main_quick .quick_wrap li:nth-child(3) a:before {background-position-x: -130px;}
#container .main_quick .quick_wrap li:nth-child(4) a:before {background-position-x: -195px;}
/* ***** /main_quick ***** */



/* *************** /container *************** */





/* *************** footer *************** */
/* ***** 탑푸터 ***** */
#footer .top_footer {border: 1px solid #e1e1e1; border-left: none; border-right: none;}

#footer .top_footer .footer_util {overflow: hidden; text-align: center;}

#footer .top_footer .footer_util li {display: inline-block; position: relative;}
#footer .top_footer .footer_util li + li:before { content: ''; position: absolute; top: 17px; left: -2px; width: 1px; height: 11px; background: #4e4e4e; }

#footer .top_footer .footer_util li a {display: block; font-size: 14px; color: #4e4e4e; line-height: 45px; padding: 0px 8px;}


/* ***** 바텀푸터 ***** */
/* sns */
#footer .bottom_footer {padding: 20px 0; text-align: center;}

#footer .bottom_footer .sns_wrap li {display: inline-block;}

#footer .bottom_footer .sns_wrap li a { display: block; width: 60px; height: 34px; background: url(../images/m_main_sprite.png) no-repeat; background-size: 260px; text-indent: -9999px; }
#footer .bottom_footer .sns_wrap li:nth-child(2) a { width: 64px;background-position-x: -60px;}
#footer .bottom_footer .sns_wrap li:nth-child(3) a { width: 48px;background-position-x: -124px;}
#footer .bottom_footer .sns_wrap li:nth-child(4) a { width: 64px;background-position-x: -172px;}


/* 기업정보 */
#footer .bottom_footer .txt_wrap {padding-top: 20px;}

#footer .bottom_footer .txt_wrap h2 {display: block; font-size: 15px; font-weight: 700; color: #333; line-height: 25px;}

#footer .bottom_footer .txt_wrap .btn_info { font-size: 13px; color: #232323; padding: 0 20px; height: 40px; border: none; background: none; position: relative; }
#footer .bottom_footer .txt_wrap .btn_info:after { content: ''; position: absolute; top: 50%; right: 0; width: 8px; height: 6px; margin-top: -2px; background: url(../images/m_main_down_arr.png) no-repeat; background-size: 8px; }
#footer .bottom_footer .txt_wrap .btn_info.active:after {
    transform: rotate(180deg);
}

#footer .bottom_footer .txt_wrap .info_wrap { text-align: center; padding: 10px 0; background: #e5e5e5; display: none; }

#footer .bottom_footer .txt_wrap .info_wrap .info_more {display: inline-block;}

#footer .bottom_footer .txt_wrap .info_wrap .info_more li {font-size: 13px; color: #4e4e4e; line-height: 19px; text-align: left;}

#footer .bottom_footer .txt_wrap p {font-size: 14px; color: #4e4e4e; padding: 20px 0;}


/* 패밀리사이트 */
#footer .bottom_footer .family_site {text-align: center;}

#footer .bottom_footer .family_site .family_wrap {display: inline-block; position: relative;}

#footer .bottom_footer .family_site .family_wrap .btn_family {width: 200px; height: 40px; border: 1px solid #979797; background: none; font-size: 18px; color: #424242; padding: 0 10px; text-align: left; position: relative;}
#footer .bottom_footer .family_site .family_wrap .btn_family:after { content: ''; position: absolute; top: 50%; right: 10px; width: 11px; height: 8px; margin-top: -4px; background: url(../images/m_main_up_arr.png) no-repeat; background-size: 11px; }
#footer .bottom_footer .family_site .family_wrap .btn_family.on:after {transform: rotate(180deg);}

#footer .bottom_footer .family_site .family_wrap .family_list { position: absolute; bottom: 39px; left: 0; width: 200px; border: 1px solid #979797; background: #fff; display: none; }

#footer .bottom_footer .family_wrap .family_list li a {display: block; font-size: 18px; color: #424242; line-height: 28px; padding: 10px 0;}

/* *************** /footer *************** */
/* *************** /메인페이지 *************** */





/* *************** 서브페이지 공통 *************** */
.sub_container {padding-top: 60px;}

/* 서브비주얼 */
 .sub_visual { width: 100%; height: 150px; background: url(../images/m_sub_menu_subvisual.png) 50% 0; background-size: cover; position: relative;}

 .sub_visual .txt_wrap {padding: 30px 0 0; text-align: center;}

 .sub_visual .txt_wrap h2 {font-size: 50px; color: #fff; font-weight: 700; line-height: 1.2;}

 .sub_visual .txt_wrap p {font-size: 15px; color: #fff;}

/* *************** /서브페이지 공통 *************** */





/* *************** 서브페이지 - 메뉴소개 *************** */


/* 메뉴 탭 (lnb) */
.menu_page .lnb {background: #efefef; padding-left: 15px; position: relative;}
.menu_page .lnb:before{ content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 4px; background: #e1e1e1; }

.menu_page .lnb .sub_menu_tab .swiper-slide {width: auto;}
.menu_page .lnb .sub_menu_tab .swiper-slide:last-child {padding-right: 30px;}

.menu_page .lnb .sub_menu_tab .swiper-slide a {display: block; font-size: 16px; color: #2e2e2e; line-height: 55px; position: relative;}
.menu_page .lnb .sub_menu_tab .swiper-slide a.on {color: #e41937; font-weight: 500;}
.menu_page .lnb .sub_menu_tab .swiper-slide a.on:after { content: ''; position: absolute; bottom: 0px; left: 0; width: 100%; height: 4px; background: #e41937; }


/* 메뉴 */
.menu_page .contents {padding: 40px 15px 0;}

.menu_page .contents .menu_wrap {overflow: hidden;}

.menu_page .contents .menu_wrap li {float: left; width: calc(50% - 5px); padding-bottom: 20px;}
.menu_page .contents .menu_wrap li:nth-child(2n) {margin-left: 10px;}

.menu_page .contents .menu_wrap li a {display: block;}

.menu_page .contents .menu_wrap li a img {width: 100%;}

.menu_page .contents .menu_wrap li a .txt_wrap {padding: 5px; border: 1px solid #d5d5d5;}

.menu_page .contents .menu_wrap li a .txt_wrap p {font-size: 16px; color: #4f4f4f;}

.menu_page .contents .menu_wrap li a .txt_wrap .tit {color: #000; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 38px; line-height: 1.2;}

.menu_page .contents .btn_wrap {text-align: center;}

.menu_page .contents .btn_wrap .btn_more {width: 100%; height: 50px; border: none; border-radius: 50px; background: #e41937; color: #fff;}

/* *************** /서브페이지 - 메뉴소개 *************** */





/* *************** 서브페이지 - 로그인 *************** */
.login_page .login_wrap { padding: 60px 15px 0; width: 100%; text-align: center; }

.login_page .login_wrap h2 { font-size: 30px; font-weight: 500; line-height: 1; position: relative; padding-bottom: 30px; }


/* 아이디 비번 입력창 */
.login_page .login_wrap .input_wrap .idpw input[type="text"] { width: 100%; height: 40px; border: 1px solid #9d9d9d; box-sizing: border-box; letter-spacing: 0em; }

.login_page .login_wrap .input_wrap .idpw input[type="password"] { width: 100%; height: 40px; border: 1px solid #9d9d9d; background: #f8f8f8; padding: 0 15px; box-sizing: border-box; letter-spacing: 0em; font-size: 16px;}

.login_page .login_wrap .input_wrap .login_con + .login_con { margin-top: 10px; }


/* 아이디저장, 로그인유지 체크박스 */
.login_page .login_wrap .input_wrap .check_wrap .check_in .check {text-align: left; width: 50%; }


/* 로그인 버튼 */
.login_page .login_wrap .btn_wrap {padding-top: 20px;}

.login_page .login_wrap .btn_wrap .btn_login { width: 100%; height: 50px;}


/* 아이디찾기, 비밀번호찾기, 회원가입 */
.login_page .login_wrap .login_link { margin-top: 10px;}

.login_page .login_wrap .login_link .link li { display: inline-block; line-height: 20px; position: relative; }
.login_page .login_wrap .login_link .link li + li:before { content: ''; position: absolute; top: 7px; left: -4px; width: 1px; height: 14px; background: #999; }

.login_page .login_wrap .login_link .link li a { display: block; font-size: 14px; color: #999; line-height: 27px; padding: 0 10px;}
.login_page .login_wrap .login_link .link li + li a {margin-left: -3px;}


/* sns 로그인 */
.login_page .login_wrap .sns_wrap {padding: 30px 0 10px;}

.login_page .login_wrap .sns_wrap h3 { font-size: 14px; color: #999; position: relative; }
.login_page .login_wrap .sns_wrap h3:before { content: ''; position: absolute; top: 50%; left: 0; width: calc(50% - 60px); height: 1px; background: #999; }
.login_page .login_wrap .sns_wrap h3:after { content: ''; position: absolute; top: 50%; right: 0; width: calc(50% - 60px); height: 1px; background: #999; }

.login_page .login_wrap .sns_wrap .btn_sns {padding-top: 20px;}

.login_page .login_wrap .sns_wrap .btn_sns li {width: 100%; padding-bottom: 10px;}

.login_page .login_wrap .sns_wrap .btn_sns li a {display: block; width: 100%; font-size: 14px; color: #999; line-height: 48px; border: 1px solid #999; padding-left: 64px; position: relative;}
.login_page .login_wrap .sns_wrap .btn_sns li a:before { content: ''; position: absolute; top: 50%; right: 50%; width: 54px; height: 16px; transform: translateY(-50%); background: url(../images/m_sns_login_sprite.png) no-repeat; background-size: 198px; }
.login_page .login_wrap .sns_wrap .btn_sns li:nth-child(2) a { padding-left: 76px;}
.login_page .login_wrap .sns_wrap .btn_sns li:nth-child(2) a:before { width: 71px; background-position-x: -59px; }
.login_page .login_wrap .sns_wrap .btn_sns li:nth-child(3) a:before { width: 63px; background-position-x: -135px; }
/* *************** /서브페이지 - 로그인 *************** */





/* *************** 서브페이지 - 문의하기 *************** */

/* 서브비주얼 */


/* 텍스트 */
.inquiry_page .sub_visual .txt_wrap {padding-top: 40px;}

.inquiry_page .sub_visual .txt_wrap h2 {font-size: 40px;}

.inquiry_page .sub_visual .txt_wrap p {font-size: 15px;}


/* lnb */
.inquiry_page .lnb {background: #efefef; padding: 0 15px; overflow: hidden; position: relative;}
.inquiry_page .lnb:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 5px; background: #e1e1e1; }

.inquiry_page .lnb li {float: left; width: 50%; text-align: center;}

.inquiry_page .lnb li a {display: block; font-size: 16px; color: #2e2e2e; line-height: 55px; position: relative;}
.inquiry_page .lnb li a.on {color: #e41937; font-weight: 500;}
.inquiry_page .lnb li a.on:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 5px; background: #e41937; z-index: 10; }


/* 문의 */
.inquiry_page .contents {padding: 60px 0 0;}

.inquiry_page .contents dl {width: 100%; border-top: 1px solid #e4e4e4; padding: 10px 15px;}

.inquiry_page .contents dl dt {font-size: 12px;}

.inquiry_page .contents dl dd {font-size: 16px; padding-top: 15px; line-height: 40px;}

/* .inquiry_page .contents dl dd .form_wrap {vertical-align: top;} */
.inquiry_page .contents dl dd .form_wrap  {position: relative;}

.inquiry_page .contents dl dd .form_wrap input[type="text"] {width: 100%; vertical-align: top; font-size: 15px;}
.inquiry_page .contents dl dd .form_wrap input[type="text"]::-webkit-placeholder {color: #635a5b;}
.inquiry_page .contents dl dd .form_wrap input[type="text"]::placeholder {color: #635a5b;}
.inquiry_page .contents dl dd .form_wrap input[type="text"].input_search {padding-right: 55px;}

.inquiry_page .contents dl dd .form_wrap .btn_search { position: absolute; top: 0; right: 0; width: 40px; height: 40px; border: none; background: #635a5b url(../images/m_search.png) no-repeat; background-size: 40px; text-indent: -9999px; }

.inquiry_page .contents dl dd .select_wrap {width: 100%; height: 40px;}

.inquiry_page .contents dl dd .select_wrap select {height: 38px; font-size: 15px;}


/* 등록 취소 버튼 */
.inquiry_page .contents .btn_wrap {padding-top: 20px; text-align: center;}

.inquiry_page .contents .btn_wrap .btn_add {display: inline-block; width: 140px; line-height: 46px;}
.inquiry_page .contents .btn_wrap .btn_add:last-child {margin-left: 6px; line-height: 50px;}
/* *************** /서브페이지 - 문의하기 *************** */