@charset "utf-8";

/* layout */
.area_main {width:1000px; margin:0 auto; padding:15px 0 50px; overflow:hidden}
.area_left {float:left; width:740px}
.area_right {float:right; width:250px; *padding-top:1px}
.article_member {position:relative; padding-top:15px; overflow:hidden; background:#eff1f4}
.article_list {padding:15px 0 50px; background:#747b8e; border-top:1px solid #5c616f}
.area_mbn {margin-bottom:15px}
.area_main iframe, .article_member iframe {width:100%; height:100%}

/* area_common */
.con_box {box-sizing:border-box; padding:15px; overflow:hidden; background:#fff; border:1px solid #ccd6de}
.con_box h4 {margin-bottom:15px; font-size:15px; font-family:notoCJK, sans-serif}
.con_box h4 .btn_more {display:inline-block; width:13px; height:13px; vertical-align:11px; *vertical-align:6px; text-indent:-9999px; font-size:0; background-position:0 0}
.area_main .area_con {overflow:hidden}
.area_cstm {height:203px; *height:158px}
.area_game {height:203px; *height:173px}
.area_gift, .area_ntc {height:165px; *height:137px}
.area_evt {height:113px; *height:73px}
.area_bn1 {height:203px}
.area_bn2 {height:288px}

/* article_member */
.article_member .area_con {width:1000px; margin:0 auto; overflow:hidden}
.article_member .area_con > div {height:297px; overflow:hidden}
.article_member .area_left {background:#fff}
.article_member .area_left .ban_left {float:left; width:248px; height:100%}
.article_member .area_left .ban_right {float:right; width:492px; height:100%}
.article_member .area_right .con_box {height:144px; *height:112px; margin-bottom:9px}
.article_member .area_right .con_box a {display:block; width:216px; height:80px; border:1px solid #ccd6de; overflow:hidden}
.article_member .area_right .con_box a img {width:100%; height:100%}

/* area_left */
.area_con50 {float:left; width:365px; overflow:hidden}
.area_con50 .con_box {margin-bottom:10px}
.area_con .area_con50:first-child {margin-right:10px}

/* area_left:left - 고객감동센터 */
.area_cstm {*padding-top:30px}
.area_cstm .img_info {height:70px; margin-top:11px; text-indent:-9999px; font-size:0; background:url('/resources/image/design/main/v3_0/img_customer.jpg') 50% 50% no-repeat}
.area_cstm .sMenu_1 {display:table; *display:block; width:100%; overflow:hidden}
.area_cstm .sMenu_1 li {display:table-cell; *float:left; *width:83px; box-sizing:border-box; position:relative; line-height:14px; text-align:center}
.area_cstm .sMenu_1 li a {display:block; margin:15px 0 15px;}
.area_cstm .sMenu_1 li:before {content:''; width:1px; height:17px; position:absolute; left:0; top:22px; background:#e4ebf1}
.area_cstm .sMenu_1 li:first-child:before {display:none}
.area_cstm .sMenu_2 {display:table; *display:block; width:100%; overflow:hidden; background:#f7f7f7}
.area_cstm .sMenu_2 li {display:table-cell; *float:left; *width:80px; *padding:0 4px; box-sizing:border-box; border:1px solid #ccd6de; border-left:0; text-align:center}
.area_cstm .sMenu_2 li:first-child {*width:56px; border-left:1px solid #ccd6de}
.area_cstm .sMenu_2 li a {display:block; height:30px; *cursor:pointer}
.area_cstm .sMenu_2 li a span {display:inline-block; *display:block; height:13px; margin-top:9px; text-indent:-9999px; font-size:0}
.area_cstm .sMenu_2 li a.cstmBtn1 span {width:46px; background-position:-119px 0}
.area_cstm .sMenu_2 li a.cstmBtn2 span {width:71px; background-position:-119px -13px}
.area_cstm .sMenu_2 li a.cstmBtn3 span {width:64px; background-position:-119px -26px}
.area_cstm .sMenu_2 li a.cstmBtn4 span {width:58px; background-position:-119px -39px}

/* area_left:left - 인기상품권 */
.area_gift {position:relative}
.area_gift .slide_ctrl li {width:30px; height:100px; position:absolute; top:50px; text-indent:-9999px; font-size:0; cursor:pointer}
.area_gift .slide_ctrl li.left {left:15px}
.area_gift .slide_ctrl li.right {right:15px}
.area_gift .slide_ctrl li span {display:inline-block; width:6px; height:10px; position:absolute; left:12px; top:45px}
.area_gift .slide_ctrl li.left span {background-position:0 -25px}
.area_gift .slide_ctrl li.right span {background-position:0 -14px}
.area_gift .slide_box {width:290px; height:100px; *height:110px; margin:5px 21px; position:relative; overflow:hidden}
.area_gift .slide_box ul {position:absolute; top:0; left:0; width:1000px; overflow:hidden; *margin-top:10px}
.area_gift .slide_box li {float:left; width:145px; height:100px}
.area_gift .slide_box li a {display:block; height:100%}

/* area_left:right - 인기게임무료충전소 */
.area_game .sMenu_1 {width:100%; overflow:hidden}
.area_game .sMenu_1 li {float:right; width:161px; *width:159px; height:65px; *height:63px; margin-bottom:10px; box-sizing:border-box; overflow:hidden; border:1px solid #ccd6de}
.area_game .sMenu_1 li:first-child {float:left; width:162px; *width:160px; height:140px; *height:138px; margin-right:10px}
.area_game .sMenu_1 li a {display:block; height:100%}

/* area_left:right - 공지사항 */
.area_ntc .ntc_tab {display:inline-block; *float:left; *width:155px; overflow:hidden; vertical-align:top}
.area_ntc .ntc_tab li {float:left}
.area_ntc .ntc_tab li:first-child {position:relative; margin-right:8px; padding-right:8px}
.area_ntc .ntc_tab li:first-child:after {content:''; width:1px; height:13px; position:absolute; top:2px; right:0; background:#939393}
.area_ntc .ntc_tab li a {font-size:15px; color:#939393; font-family:notoCJK, sans-serif}
.area_ntc .ntc_tab li.on a {color:#636363; font-weight:bold}
.area_ntc .ntc_tab_con {display:none; margin-top:25px}
.area_ntc .ntc_tab_con li {margin-top:9px; *margin-top:5px}
.area_ntc .ntc_tab_con li:first-child {margin-top:0}
.area_ntc .ntc_tab_con li a {display:block; height:16px; overflow:hidden; *cursor:pointer}
.area_ntc .ntc_tab_con .tit {float:left; width:80%; text-overflow:ellipsis; overflow:hidden; white-space:nowrap}
.area_ntc .ntc_tab_con .date {float:right; width:20%; text-align:right; color:#7e7e7e}

/* area_left:bottom - 진행중이벤트 */
.area_evt ul {width:100%; overflow:hidden}
.area_evt li {float:left; width:230px; *width:227px; height:52px; *height:50px; margin-left:9px; box-sizing:border-box; overflow:hidden; border:1px solid #b3c3d1}
.area_evt li:first-child {margin-left:0}
.area_evt li a {display:block; height:100%}

/* area_right */
.area_bn1 {margin-bottom:10px}
.area_bn2 {position:relative}
.area_bn2 .flashmainbanner {display:none; position:absolute; right:0px; top:0px; width:1000px; height:288px; z-index:992}
.area_bn2 .flashbanner {position:absolute; right:0px; top:0px; width:100%; z-index:991}
.area_bn2 .flashbanner .flash_on_area {display:none; position:absolute; bottom:0px; right:0px; width:100%; height:40px; background:#fff; opacity:0; -moz-opacity:0; -ms-filter:alpha(opacity=0); filter:alpha(opacity=0); cursor:pointer}
.area_bn2 .flashbanner #flashbannerbox {display:none; height:100%; overflow:hidden}
.area_bn2 .flashbanner + iframe {z-index:990}

/* article_list - 전체메뉴 */
.article_list .area_con {width:1000px; margin:0 auto; overflow:hidden}
.article_list dl {float:left; width:15%; *width:14%; line-height:24px}
.article_list dl:nth-child(4) {width:16%}
.article_list dl:last-child {width:9%}
.article_list dt {margin:15px 0; font-size:14px; font-weight:bold}
.article_list dt a {color:#fff}
.article_list dd {font-size:12px}
.article_list dd a {color:#cfd4e2}

/* 최상단 배너 */
#MainTopBanner {position:relative; height:84px; overflow:hidden}
#MainTopBanner .close {position:absolute; left:50%; top:0; width:30px; height:30px; margin-left:475px; background:#fff; opacity:0; -moz-opacity:0; -ms-filter:alpha(opacity=0); filter:alpha(opacity=0)}

/* 전체 레이어팝업 배너 */
.popup_bg {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.5; -moz-opacity:0.5; -ms-filter:alpha(opacity=50); filter:alpha(opacity=50); z-index:9000}
.popuplayer {display:none; position:absolute; top:240px; left:50%; width:720px; height:500px; margin:0 0 0 -360px; z-index:9001}
.popuplayer #divIntroLayerBanner {position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:9002}
.popuplayer .mpimg {display:block; height:100%}
.popuplayer .todayout {position:absolute; right:5px; bottom:5px; width:138px; height:23px; z-index:9003}
.popuplayer .todayout input {width:100%; height:100%; cursor:pointer; opacity:0; -moz-opacity:0; -ms-filter:alpha(opacity=0); filter:alpha(opacity=0)}
.popuplayer .close {position:absolute; top:0px; right:0px; width:40px; height:40px; background:#fff; opacity:0; -moz-opacity:0; -ms-filter:alpha(opacity=0); filter:alpha(opacity=0); z-index:9003}
.popuplayer .close span {display:none}

/****** 브라우저별 대응 ******/
@media screen and (-webkit-min-device-pixel-ratio:0){ /* 크롬 */
.con_box h4 .btn_more {vertical-align:3px}
}
@media \0screen { /* ie8 */
.article_list dl {width:14%}
}
