@charset "euc-kr";

/* FONT SETTING */
@font-face {font-family:'NanumGothic';font-style:normal;font-weight:400;src:url(/story/assets/css/04/fonts/NanumGothic/NanumGothic-Regular.eot);src: url(/story/assets/css/04/fonts/NanumGothic/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'), url(/story/assets/css/04/fonts/NanumGothic/NanumGothic-Regular.woff2) format('woff2'), url(/story/assets/css/04/fonts/NanumGothic/NanumGothic-Regular.woff) format('woff'), url(/story/assets/css/04/fonts/NanumGothic/NanumGothic-Regular.ttf) format('truetype')}

/* RESET */
body, h1, h2, h3, h4, h5, h6, ul, li, ol, dl, dt, dd, p, div, span {margin:0;padding:0}
body {font:16px/160% 'NanumGothic', '³ª´®°íµñ', 'MalgunGothic', 'dotum', 'gulim', 'arial', sans-serif;color:#222}
li {list-style:none}
a {display:block;color:#000;text-decoration:none}
a:hover, a:visited, a:focus {color:#000;text-decoration:none}
* {letter-spacing:-1px;}

/* SCROLLTOP */
.scrollTop {position:fixed;bottom:30px;right:30px;z-index:1040;border:none;border-radius:25px;background-color:#000;color:#fff;font-weight:bold;width:50px;height:50px;padding:10px 10px;text-align:center;opacity:0}
.scrollTop i {color:#fff}

/* MARGIN & PADDING */
.mt30 {margin-top:30px}
.mt20 {margin-top:20px}
.mt40 {margin-top:40px}
.pt30 {padding-top:30px}


/* FONT COLOR */
.green { color:#71b113}
.orange { color:#d4860c}
.pink { color:#c81d7a}
.sky { color:#0d9ce3}
.yellow { color:#ecf644}


/* HEADER */
#navbar {background:rgba(0, 0, 0, 0.3);border:none;padding:20px 0px}
#navbar .navbar-default .navbar-collapse {border:none}
#navbar .navbar-header {float:none}
#navbar .logo-area {margin:0}
#navbar .logo-area a {margin-right:20px}
#navbar .logo-area a:first-child {background:url(/images/story/05/header/logo_bar.png)100% 12px no-repeat;margin-right:10px;padding-right:20px}
#select_box {padding-top:15px;float:left}
#site_link {font-size: 14px;line-height:175%;padding-top:2px;padding-bottom:3px}
#go {background-color:#fff;border:none;color:#666;font-size:13px;font-weight:bold;padding:0px 10px}
#rwd-collapse-group .sns-area {font-size:30px;float:right;padding-top:10px}
#rwd-collapse-group .sns-area li {float:left;padding:0 10px}
#rwd-collapse-group .sns-area li a i {color:#fff}

/* MAIN & CONT */
.contents .main_visual_bg { position:relative; background-image:url(/images/story/06/main_visual_bg.jpg); background-repeat:no-repeat;background-position:50% 50%; height: 1000px;}
.contents .cont_inner { width:960px; margin:0 auto;}
.contents .main_visual_bg .main-h2 { padding-top: 125px;}
.contents .main_visual_bg .main_txt_area { padding-top: 60px;}
.contents .main_visual_bg .character { float:left;}
.contents .main_visual_bg .main-txt { float:left; width:530px; background:rgba(255,255,255,0.5); padding:40px; margin:30px 0 0 40px; color:222; font-size:26px; line-height:40px;}
.contents .main_visual_bg .scroll { position:absolute; bottom:150px; left:50%; margin-left:-48px;}

.contents .section-01 { background-image: url(/images/story/06/con1_bg.jpg); padding:50px 0;}
.contents .section-02 { background-image: url(/images/story/06/con2_bg.jpg); padding:50px 0;}
.contents .section-03 { background-image: url(/images/story/06/con3_bg.jpg); padding:50px 0;}
.contents .section-04 { background-image: url(/images/story/06/con4_bg.jpg); padding:50px 0;}

.contents .sec_tit_icon { width: 114px; margin:0 auto;}
.contents .sec_tit_area { text-align:center; padding-top:30px;}
.contents .sec_tit_area > h2 { font-size:40px; font-weight:bold;}
.contents .sec_tit_area .sec_tit_desc { font-size:25px; padding-top:30px; line-height:35px;}
.contents .sec_sub_tit_area > h2 { padding:16px 0; font-size:25px; font-weight:bold; margin-top:50px; text-align:center;}
.contents .sec_sub_tit_area > p { font-size:22px; line-height:32px; margin-top:40px; text-align:center;}

.contents .sec01_sub_tit > h2 { background-color:#e7e2d0; position:relative;}
.contents .sec02_sub_tit > h2 { background-color:#f6def1; position:relative;}
.contents .sec03_sub_tit > h2 { background-color:#d8f2ff; position:relative;}
.contents .sec01_sub_tit > h2:after { content:""; position:absolute; bottom:-9px; margin-left: -4px; left:50%; width:16px; height:9px; background:url(/images/story/06/sub_tit_arrow1.png) no-repeat center; display:block;}
.contents .sec02_sub_tit > h2:after { content:""; position:absolute; bottom:-9px; margin-left: -4px; left:50%; width:16px; height:9px; background:url(/images/story/06/sub_tit_arrow2.png) no-repeat center; display:block;}
.contents .sec03_sub_tit > h2:after { content:""; position:absolute; bottom:-9px; margin-left: -4px; left:50%; width:16px; height:9px; background:url(/images/story/06/sub_tit_arrow3.png) no-repeat center; display:block;}

.contents .map { padding-top:30px;}

.contents .sec02_con_area { display: inline-block; margin-top:20px;}
.contents .sec02_con_area>ul>li>p { overflow:hidden; position:absolute; clip:rect(0 0 0 0); clip:rect(0,0,0,0); width:1px; height:1px; margin:-1px; border:0; padding:0;}
.contents .sec02_con_area>ul>li>p:focus{ overflow:visible; position:static; clip:auto; width:auto; height:auto; margin:0;}

.contents .sec02_con1_area>ul>li { width:465px; height:371px; margin-top:30px; background-image: url(/images/story/06/con2-1_img.png); background-repeat:no-repeat; float:left;}
.contents .sec02_con1_area>ul>li.sec02_con1_img2 { background-position-x:-495px; background-position-y:0; margin-left:30px;}
.contents .sec02_con1_area>ul>li.sec02_con1_img3 { background-position-x:0; background-position-y:-401px;}
.contents .sec02_con1_area>ul>li.sec02_con1_img4 { background-position-x:-495px; background-position-y:-401px; margin-left:30px;}
.contents .sec02_con1_area>ul>li.sec02_con1_img5 { background-position-x:0; background-position-y:-802px; height:401px;}
.contents .sec02_con1_area>ul>li.sec02_con1_img6 { background-position-x:-495px; background-position-y:-802px; height:401px; margin-left:30px;}

.contents .sec02_con2_area>ul>li { width:465px; height:371px; margin-top:30px; background-image: url(/images/story/06/con2-2_img.png); background-repeat:no-repeat; float:left;}
.contents .sec02_con2_area>ul>li.sec02_con2_img2 { background-position-x:-495px; background-position-y:0; margin-left:30px;}

/*sec02 tab*/
.tab_tit { font-size:18px; font-weight:bold;}
.contents .sec02_tabs { position:relative; margin-top:50px; padding-bottom:822px;}
.contents .sec02_tabs>li { float: left;}
.contents .sec02_tabs .tab-button { width:145px; height:174px; text-align: center; display: inline-block;}
.contents .sec02_tabs .sec02-tab-btn1 { margin-left: 170px;}
.contents .sec02_tabs .sec02-tab-btn2, .contents .sec02_tabs .sec02-tab-btn3 { margin-left: 94px;}

.contents .on {display:block;}
.tab-hover { display:none;}
.contents .sec02_tabs>li.on img.tab-hover { display:block;}
.contents .sec02_tabs>li.on img.tab-img { display:none;}
.contents .sec02_tabs>li.on .sec02_con3_area { display:block;}

.contents .sec02_con3_area { display: none; position: absolute; top: 200px; left: 0;}
.contents .sec02_con3_area .sec02_con3-1>li { width:465px; height:371px; margin-top:30px; background-image: url(/images/story/06/con2-3_tab1_img.png); background-repeat:no-repeat; float:left;}
.contents .sec02_con3_area .sec02_con3-1 .sec02_con3_img2 { background-position-x:-495px; background-position-y:0; margin-left:30px;}
.contents .sec02_con3_area .sec02_con3-1 .sec02_con3_img3 { background-position-x:0; background-position-y:-401px;}
.contents .sec02_con3_area .sec02_con3-1 .sec02_con3_img4 { background-position-x:-495px; background-position-y:-401px; margin-left:30px;}
.contents .sec02_con3_area .sec02_con3-2>li { width:465px; height:371px; margin-top:30px; background-image: url(/images/story/06/con2-3_tab2_img.png); background-repeat:no-repeat; float:left;}
.contents .sec02_con3_area .sec02_con3-2 .sec02_con3_img2 { background-position-x:-495px; background-position-y:0; margin-left:30px;}
.contents .sec02_con3_area .sec02_con3-3>li { width:465px; height:371px; margin-top:30px; background-image: url(/images/story/06/con2-3_tab3_img.png); background-repeat:no-repeat; float:left;}
.contents .sec02_con3_area .sec02_con3-3 .sec02_con3_img2 { background-position-x:-495px; background-position-y:0; margin-left:30px;}



/*.contents .sec02_con3_area.active { display: block;}*/

/* sec03 */
.contents .sec03_tabs { position:relative; margin-top:50px; padding-bottom:466px;}
.contents .sec03_tabs>li { float: left;}

.contents .sec03_tabs>li.on img.tab-hover { display:block;}
.contents .sec03_tabs>li.on img.tab-img { display:none;}
.contents .sec03_tabs>li.on div.sec03_con_area { display:block;}
.contents .sec03_tabs>li div.sec03_con_area { display:none;}

.contents .sec03_tabs .tab-button { width:145px; height:174px; text-align: center; display: inline-block; margin-left: 58px;}
.contents .sec03_tabs .sec03-tab-btn1 { margin-left: 0;}
.contents .sec03_con_area { display: inline-block; margin-top:20px;}
.contents .sec03_con_area { /*display: none;*/ position: absolute; top: 220px; left: 0;}

.contents .sec04_img_area>li>h3, .contents .sec04_img_area>li>ul>li { overflow:hidden; position:absolute; clip:rect(0 0 0 0); clip:rect(0,0,0,0); width:1px; height:1px; margin:-1px; border:0; padding:0;}
.contents .sec04_img_area>li>h3:focus, .contents .sec04_img_area>li>ul>li:focus { overflow:visible; position:static; clip:auto; width:auto; height:auto; margin:0;}
.contents .sec04_img_area { margin-top:50px; display: inline-block;}
.contents .sec04_img_area li { margin-left:10px;}
.contents .sec04_img_area .sec04_img1 { width:232px; height:431px; background-image: url(/images/story/06/con4_img1.png); background-repeat:no-repeat; float:left; margin-left:0;}
.contents .sec04_img_area .sec04_img2 { width:232px; height:431px; background-image: url(/images/story/06/con4_img2.png); background-repeat:no-repeat; float:left;}
.contents .sec04_img_area .sec04_img3 { width:232px; height:431px; background-image: url(/images/story/06/con4_img3.png); background-repeat:no-repeat; float:left;}
.contents .sec04_img_area .sec04_img4 { width:232px; height:431px; background-image: url(/images/story/06/con4_img4.png); background-repeat:no-repeat; float:left;}
.contents .sec04_img_area .sec04_img5 { width:232px; height:431px; background-image: url(/images/story/06/con4_img5.png); background-repeat:no-repeat; float:left; margin-left:0; margin-top:30px;}
.contents .sec04_img_area .sec04_img6 { width:232px; height:431px; background-image: url(/images/story/06/con4_img6.png); background-repeat:no-repeat; float:left; margin-top:30px;}
.contents .sec04_img_area .sec04_img7 { width:232px; height:431px; background-image: url(/images/story/06/con4_img7.png); background-repeat:no-repeat; float:left; margin-top:30px;}
.contents .sec04_img_area .sec04_img8 { width:232px; height:431px; background-image: url(/images/story/06/con4_img8.png); background-repeat:no-repeat; float:left; margin-top:30px;}

.footer { height:357px; background: url(/images/story/06/cont5_bg.jpg) no-repeat center; color:#fff; font-size:45px; text-align:center; padding-top:120px; line-height: 65px;}


/* MODAL  */
.modal-open {padding-right:0 !important}
.modal-dialog {margin-top:200px;}
.modal-dialog {width:564px}
.modal-dialog-single {width:301px;}
.modal-dialog-double {width:564px;}
.modal-dialog-many {width:828px;}
.modal-header {background-color:#ffe9cf; text-align:center; color:#222}
.modal-header i {color:#222 !important}
.modal-title {font-weight:700;padding-top:5px;text-indent:0px;font-size:20px}
.modal-header .close {opacity:1;padding:5px;}
.modal-body {text-indent:0px;padding:0!important}
.modal-body p {padding-top:22px;padding-bottom:22px}
/*.modal-body div {padding-bottom:22px}*/
.modal-content {box-shadow:0 5px 15px rgba(0,0,0,.2);border:1px solid rgba(0,0,0,.2);border-radius:0px}