﻿@charset "utf-8";
/* swipe slides */
.swiper-container { margin: 0 auto; position: relative; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; }
.swiper-wrapper { position: relative; width: 100%; -webkit-transition-property: -webkit-transform,left,top; -webkit-transition-duration: 0s; -webkit-transform: translate3d(0px,0,0); -webkit-transition-timing-function: ease; transition-property: transform,left,top; transition-duration: 0s; transform: translate3d(0px,0,0); transition-timing-function: ease; }
.swiper-free-mode > .swiper-wrapper { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; }
.swiper-slide { float: left; }
.swiper-wp8-horizontal { -ms-touch-action: pan-y; }
.swiper-wp8-vertical { -ms-touch-action: pan-x; }
.swiper-container { } .swiper-slide { } .swiper-slide-active { } .swiper-slide-visible { } .swiper-pagination-switch { } .swiper-active-switch { } .swiper-visible-switch { }
.visualbox { margin: 0 0 0 0; }

/* main 슬라이드 영역 */
.swiper-container{ width: 100%; color: #fff; text-align: center; /*height: 360px;*/ min-height: 387px; position: relative; }

.pages{ width:100%; height:30px; text-align:center; font-size:14px; color:#434343; margin-top:10px;  float:left;}
.pages li{ text-align:center; font-size:14px; color:#666; margin:0 2px; display:inline;}
.pages li a{ font-size:14px; color:#434343; }

.wide { display: block; width: 100%; position: relative; height: 387px;}
.photo13 .title { background: url(../mimages/meta_notice_04.jpg) center 0 no-repeat; background-size: 360px 387px; }
.photo13 { background: #f5ded9 }
.photo_ev1 .title { background: url(../mimages/db_jaw_event.jpg) center 0 no-repeat; background-size: 360px 387px; }
.photo_ev1 { background: #8e9ca3 }


.photo_n01,.photo_n02,.photo_coke,.photo_cool,.photo_noti { background: #f5ded9; }
.photo_n01 .title {background: url(../mimages/n01.png) center 0 no-repeat; background-size: 360px 387px; }
.photo_n02 .title {background: url(../mimages/n02.png) center 0 no-repeat; background-size: 360px 387px; }
.photo_coke .title {background: url(../mimages/n_coke.png) center 0 no-repeat; background-size: 360px 387px; }
.photo_cool .title {background: url(../mimages/n_cool.png) center 0 no-repeat; background-size: 360px 387px; }
.photo_noti .title {background: url(../mimages/n_noti.png) center 0 no-repeat; background-size: 360px 387px; }

.swiper-slide .title .sotitle { position: absolute; width: 55%; top: 167px; left: 28px; text-align: left; font-size: 11px; line-height: 130%; color: #3e2625; }
.swiper-slide .title .sotitle i { font-style: italic; color: #fff; font-size: 11px; }
.photo03 .title .sotitle,.photo04 .title .sotitle,.photo05 .title .sotitle,.photo06 .title .sotitle,.photo07 .title .sotitle,.photo08 .title .sotitle,.photo09 .title .sotitle,.photo10 .title .sotitle, .photo11 .title .sotitle, .photo12 .title .sotitle, .photo13 .title .sotitle
{ color: #fff; top: 181px;}
.pagination { position: absolute; width: 100%; z-index: 20; left: 0px; bottom: 20px; bottom: 100px; display: none; }
.swiper-pagination-switch { display: inline-block; width: 8px; height: 8px; border-radius: 8px; background: #fff; margin-right: 5px; opacity: 0.4; border: 1px solid #fff; cursor: pointer; }
.swiper-visible-switch { background: #aaa; }
.swiper-active-switch { background: #fff; opacity: 1; }

.ad { width:100%; position: absolute; bottom: 0; left: 0; z-index: 21; overflow:hidden; }
ul.m_ico { clear:left; overflow:hidden; width: 100%; }
ul.m_ico li { float: left; border-left:1px solid #a19a99; width:16.66666666666666666666666666666666666666666666%; width: 20%; box-sizing: border-box; background: url(../mimages/bg_topslide.png) 0 0 repeat }
ul.m_ico li:first-child { border-left:none; }
ul.m_ico li a { display: block; height: 46px; padding: 7px 0; margin: 0 auto; box-sizing: border-box; text-decoration: none; color: #fff; font-size: 11px; }
ul.m_ico li:nth-child(1), ul.m_ico li:nth-child(2), ul.m_ico li:nth-child(3), ul.m_ico li:nth-child(4), ul.m_ico li:nth-child(5) { border-bottom:1px solid #a19a99; }
ul.m_ico li:nth-child(6) { border-left: none }
ul.m_ico li a p {text-align:center; height: 27px;}
ul.m_ico li:nth-child(1) a p { background: url('../mimages/slide_ico01.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(2) a p { background: url('../mimages/slide_ico02.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(3) a p { background: url('../mimages/slide_ico03.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(4) a p { background: url('../mimages/slide_ico04.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(5) a p { background: url('../mimages/slide_ico05.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(6) a p { background: url('../mimages/slide_ico06.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(7) a p { background: url('../mimages/slide_ico07.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(8) a p { background: url('../mimages/slide_ico08.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(9) a p { background: url('../mimages/slide_ico09.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li:nth-child(10) a p { background: url('../mimages/slide_ico10.png') center 0 no-repeat; background-size: 28px 22px; }
ul.m_ico li a p.ad_text { display: none; width: 90%; max-width: 100px; overflow: hidden; margin: 0 auto; padding: 5.5px 0 0 0; text-align: center }
ul.m_ico li a p span { display: inline; vertical-align: middle; color: #fff; font-size: 8px; }
ul.m_ico li a p img { width: 11px; height: 11px; display: inline; vertical-align: middle; margin: -1px 0 0 3px; }

.btn_txt span {line-height: 5;}



ul.m_ico li.on { background: url('../mimages/bg_on.png') 0 0 repeat; }
ul.m_ico li.on a p { background: none; display: none; }
ul.m_ico li.on a p.ad_text { display: block; }

div.item span.str_short_banner{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box;
-webkit-line-clamp: 2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word; line-height: 1.2em; height: 2.4em; /* line-height 가 1.2em 이고 3라인을 자르기 때문에 height는 1.2em * 3 = 3.6em */
}

div ul li a span.str_short_bbs{ width:86%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;display:block;margin:0;padding-top:2px; }

/* layout */
#wrap { width: 100%; position: relative; /* animate용 */overflow: hidden; min-height: 100%; }
#wrap a:hover { text-decoration: none; }
.wrap_640 { width: 100%; /*max-width: 640px;*/ margin: 0 auto; box-sizing: border-box; padding: 0 0px; height: 100%; box-sizing: border-box;  }

#wrap .swiper-container img { width: 100%; height:387px; }
header { width: 100%; position: relative;   zoom: 1; z-index: 11; }
header:after { content: ""; display: block; clear: both; }
header h1 img { width: 100%;   z-index: -11; }
header .top_menu { float: right;position:relative; margin-bottom:-50px; padding-top:25px; margin-right:15px;}
header .top_menu li { float: left; }
header .top_menu li a { display: block; }
header .top_menu li a img { width: 36px; height: 26px; vertical-align: top; }
.main header { }
.real #logbox { padding-top: 0; padding-bottom: 0 }



/* 대메뉴 */
nav#menu { width: 200px; zoom: 1; position: fixed; height: 100%;  background: #d40f19; z-index: 999; top: 0; right: 0; z-index: 200; -webkit-overflow-scrolling: touch;-ms-overflow-style: -ms-autohiding-scrollbar;}
nav#menu:after { content: ""; display: block; clear: both; }
nav#menu ul { width: 200px; float: right; background: #d40f19; height: 100%;  overflow: auto;}
nav#menu ul.menu_btn_box {margin-bottom: 170%;}
nav#menu ul li { border-bottom: 1px solid #fff; float: left; width: 100%; }
nav#menu ul a { color: #fcffff;background: #d40f19; font-size: 16px; line-height: 100%; padding: 10px 0 10px 10%; display: block; background: url(../mimages/btn_m_down.png) 90% center no-repeat; background-size: 14px 11px; text-decoration:none }
nav#menu ul .on > a { background: url(../mimages/btn_m_up.png) 90% center no-repeat;background-size: 14px 11px; }
nav#menu ul .submenu { padding: 0 10%; box-sizing: border-box;background: #d40f19; }
nav#menu ul .submenu li { border-bottom: 1px solid #fff; }
nav#menu ul .submenu li:last-child { border-bottom: none }
nav#menu ul .submenu li a { color: #fbeee6; padding: 14px 0; font-size: 14px; background: none; }
nav#menu ul .submenu li a:hover, nav#menu ul .submenu li a.on { color: #fdff92; text-decoration:none }
nav#menu ul .submenu .ls2 { letter-spacing: -1px; }
nav#menu ul .submenu .ls3 { letter-spacing: -1px;}
nav#menu .menus { width: 100%; position: relative; }
/* nav#menu .menus { width: 100%; height:100%; position: relative; overflow: auto}
nav#menu .menus:after{content:''; display:block; clear:both;} */
.m_close { position: absolute; top: 0; left: -51px; }
.m_close img { width: 51px; height: 51px; }
nav#menu ul .submenu li .new { margin: 0 0 0 3px }
nav#menu ul .submenu li .new img { width: 15px; height: 15px; }
