@charset "UTF-8";

@import url('icon-font.css');
/*@import url('components.css');*/
@import url('../event.css');


/* font */
/*@font-face {*/
	/*font-family:"MG";*/
	/*font-style:normal;*/
	/*src:url(../../fonts/MalgunGothic.eot);*/
	/*src:local("MalgunGothic"), local("Malgun Gothic"),*/
	/*url(../../fonts/MalgunGothic.eot?#iefix) format("embedded-opentype"),*/
	/*url(../../fonts/MalgunGothic.woff) format("woff"),*/
	/*url(../../fonts/MalgunGothic.ttf) format("truetype");*/
/*}*/


/* @ reset ------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, menu, nav, output, ruby, section, summary, time, mark, audio, video, button,  textarea, input { margin: 0; padding: 0; border: 0; }
ul, ol, li { list-style: none; }
body { font-size: 13px; font-family:sans-serif !important/* 1127 font */; line-height: 1.2; color: #666; letter-spacing: -0.5px; font-size-adjust: none; word-break: break-all; -webkit-tap-highlight-color: transparent; }
h1, h2, h3, h4, h5, h6 { line-height: 1.2; }
em { font-style: normal; }
p { line-height: 1.2; }
img { width: 100%; }
input { -webkit-appearance: none; /*background: transparent; -webkit-border-radius: 0; border-radius: 0; */}
textarea {-webkit-box-sizing: border-box; box-sizing: border-box; padding: 7px 10px !important; min-height: 104px; width: 100%; border: 1px solid #ccc !important; color: #222;  font-size: 13px; line-height: 13px;}
em { font-style: normal; }
img, fieldset { vertical-align: top; }
*, *:before, *:after { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }

/* 아이폰 가로모드시 글씨 커지는 문제 */
* { -webkit-text-size-adjust: none; }

/* 아이폰 input 박스선 없애기 */
/* input */
input[type="tel"],input[type="text"],input[type="password"],input[type="number"],input[type="date"],input[type="email"],input[type="search"],input[type="image"] {-webkit-box-sizing:border-box; box-sizing:border-box; padding:7px 10px; height:40px; border:1px solid #ccc; background:#fff; color:#222; vertical-align:middle; font-size:13px; line-height:13px;}

/* link */
a { color: #222; text-decoration: none; }
a:hover, a:focus, a:active, a:visited { text-decoration: none; }

/* align */
.txt-left { text-align: left !important; }
.txt-right { text-align: right !important; }
.txt-center { text-align: center !important; }
.txt-center td {text-align:center;}
.txt-left tbody th {padding-left:10px !important; text-align:left;}

/**/
h3.title { margin:28px 0 15px; color: #000; text-align: center; font-size: 25px; font-family: "KTB", "Malgun Gothic", "맑은 고딕", "MG", sans-serif;letter-spacing:0;}
h3.title + p { margin:0 15px 20px; color: #454545; text-align: center; font-size: 15px;}
.contents-area {padding:0 15px;}
.screen-out {left:-9999px; width:0.01em; height:0.01em; font-size:0.1em; line-height:0.01em; overflow:hidden;}

/* bx-slider reset */
.bx-wrapper { padding: 0; margin: 0; border: none; box-shadow: none;}
.bx-wrapper .bx-pager { padding: 0; bottom: -25px;}
.bx-wrapper .bx-pager.bx-default-pager a { width: 9px; height: 9px; background: #fff; border: 1px solid #000; margin: 0 3px;}

/*페이지 로케이션*/
.location .sub-depth-wrap {position: relative;background: #22beb6 !important;line-height: 1;}/* 1102 location color change */
.location .sub-depth-wrap .sub-depth2 { position: relative; padding: 15px 15px 14px; color: #fff; font-size: 16px; font-weight: bold; }
.location .sub-depth-wrap .sub-depth2:after { display: block; content: ""; clear: both; }
.location .sub-depth-wrap .sub-depth2 li { float: left; vertical-align: middle; font-weight: bold !important; font-size:16px !important;}
.location .sub-depth-wrap .sub-depth2 li i { font-size: 10px; margin: 0 8px; }
.location .sub-depth-wrap.active .sub-depth3 { display: block; height: auto; padding: 25px 15px 7px; }
.location .sub-depth-wrap.active button i { transform: rotate(180deg); -webkit-transform: rotate(180deg); }
.location .sub-depth-wrap .sub-depth3 { display:none;overflow: hidden; position: absolute; width: 100%; height: 0; top: 45px; left: 0; background: #fff; z-index: 11; padding: 0 15px; box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2); transition: all 0.5s; -webkit-transition: all 0.5s; }
.location .sub-depth-wrap .sub-depth3 li { width: 50%; margin-bottom: 18px; white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#222;min-height: 18px;}
.location .sub-depth-wrap .sub-depth3 a { font-size: 14px !important; font-weight:bold !important; color:#222 !important; }
.location .sub-depth-wrap .sub-depth3 a i { font-size: 8px !important; color: #ddd !important; }
.location .sub-depth-wrap .sub-depth3 a.active { color: #d71826 !important; }
.location .sub-depth-wrap .sub-depth3 a.active i { color: #d71826 !important; }
.location .sub-depth-wrap button { position: absolute; top: 0; right: 4px; width: 45px; height: 45px; background: none; }
.location .sub-depth-wrap button i { position: absolute; top: 50%; right: 15px; margin-top: -4px; font-size: 8px; transition: all 0.5s; -webkit-transition: all 0.5s; }
.location .sub-depth4 { position: relative; padding: 13px 15px; border-bottom: 1px solid #e4e4e4; line-height: 1; }
.location .sub-depth4:after { display: block; content: ""; clear: both; }
.location .sub-depth4 > li { float: left; font-size: 14px; margin-left: 30px; }
.location .sub-depth4 > li:first-child { margin-left: 0; }
.location .sub-depth4 > li > a { font-size: 14px; color: #777; }
.location .sub-depth4 > li > a.active { color: #d71826; border-bottom: 2px solid #d71826; padding-bottom: 3px; }
.location .sub-depth4 > li .sub-depth5 { overflow: hidden; line-height: 1; position: absolute; left: 0; top: 40px; width: 100%; padding: 13px 15px; background: #f1f1f1; }
.location .sub-depth4 > li .sub-depth5:after { display: block; content: ""; clear: both; }
.location .sub-depth4 > li .sub-depth5 li { float: left; margin: 0 15px; }
.location .sub-depth4 > li .sub-depth5 li a { font-size: 13px; color: #777; }
.location .sub-depth4 > li .sub-depth5 li a.active { color: #d71826; }
.sub-location-title { position: relative; padding: 16px 15px 15px; font-size: 14px; font-weight: bold; color: #222; border-bottom: 1px solid #e4e4e4; text-align: center; line-height: 1; }
.sub-location-title a { display: block; position: absolute; top: 0; left: 0px; width: 45px; height: 45px; line-height: 45px; }
.sub-location-title a i { font-size: 12px; color: #333; }
/* util - css */

/* margin */
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mb0 {margin-bottom:0 !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}

/* padding */
.pt15 {padding-top:15px !important;}


.cfmPocket .bx-wrapper .bx-controls {position:absolute; top:0; right:0;}
.cfmPocket .bx-wrapper .bx-controls .bx-controls-direction {position:absolute; right:-5.335vw; width:93.33vw;}
.cfmPocket .bx-wrapper .bx-controls-direction a {text-indent:0; color:transparent; z-index:99;}
.cfmPocket .bx-wrapper .bx-controls .bx-controls-direction .bx-prev {left:0; width:5.33vw; background:url(../images/main/icon_bx-prev.png) 50% 50% no-repeat; background-size:auto 4.13vw;}
.cfmPocket .bx-wrapper .bx-controls .bx-controls-direction .bx-next {right:0; width:5.33vw; background:url(../images/main/icon_bx-next.png) 50% 50% no-repeat; background-size:auto 4.13vw;}
.cfmPocket .bx-wrapper .bx-controls .bx-pager {position:static;}
.cfmPocket .bx-wrapper .bx-controls .bx-pager-item {float:left; margin:0 0.633vw;}
.cfmPocket .bx-wrapper .bx-controls .bx-pager-item a {display:block; width:1.86vw; height:1.86vw; overflow:hidden; margin:0; padding:0; font-size:1px; color:transparent; border-radius:3vw; border:none; background:#cdcdcd;}
.cfmPocket .bx-wrapper .bx-controls .bx-pager-item a:hover,
.cfmPocket .bx-wrapper .bx-controls .bx-pager-item a:active,
.cfmPocket .bx-wrapper .bx-controls .bx-pager-item a:focus {background:#09bad0;}
.cfmPocket .bx-wrapper .bx-controls .bx-pager-item a.active {width:2.53vw; height:2.53vw; margin-top:-0.335vw; background:#09bad0;}