@charset "euc-kr";

/* RESET */
body{font-family: 'noto-m' , sans-serif !important; font-size: 15px; letter-spacing:-0.8px; color:#555}
body, h1, h2, h3, h4, h5, h6, ul, li, ol, dl, dt, dd, p, div, span {margin:0;padding:0}
li {list-style:none}
a{display:block;color:#000;text-decoration:none}
a:hover, a:visited, a:focus {color:#000;text-decoration:none}
caption { visibility: hidden; font-size: 0px; width: 0px; height: 0px; line-height: 0; border-bottom: 0; margin: 0; padding-top: 0; padding-bottom: 0;}
em {font-style:normal}



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

/* MARGIN & PADDING */
.mt0 {margin-top:0}
.mt5 {margin-top:5px}
.mt10 {margin-top:10px}
.mt20 {margin-top:20px}
.mt30 {margin-top:30px}
.mt40 {margin-top:40px}
.mt50 {margin-top:50px}
.mt80 {margin-top:80px}
.mb10 {margin-bottom:10px}
.mb20 {margin-bottom:20px}
.mb40 {margin-bottom:40px}
.mr0 {margin-right:0 !important;}
.pl5 {padding-left: 5px;}
.pt20 {padding-top:20px}
.pt30 {padding-top:30px}
.pt50 {padding-top:50px}

/*COMMON STYLE*/
.bdln{border-left:none !important;}
.bdrn{border-right:none !important;}
a {-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;}
a.shadow_btn { cursor:pointer; margin-top:50px; display:inline-block; color:#fff; font-weight:bold; padding:10px 20px; background-color:#c63c0c;border-bottom:5px solid #952701;}
a.shadow_btn:hover {color:#fff;}
.ally-hidden {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;}

.txt_c {text-align: center}
.txt_l {text-align: left}
.txt_r {text-align: right}

/* bg_box */
.bg_purple {background-color: #5f52a0}
.bg_red{background: #fa6374}
.bg_green{background: #13a08d;}
.bg_blue{background: #00a2d3;}

/* TXT COLOR */
.txt_white {color:#fff}
.txt_green {color:#13a08d}
.txt_blue {color:#00a2d3}
.green { color:#71b113}
.orange { color:#d4860c}
.pink { color:#ff60a0}
.sky { color:#0d9ce3}
.yellow { color:#ecf644 !important}
.red { color:#d44853 !important}
.brown { color:#906c00;}
.blck2 {color:#222;}

.bus_blue {color:#375587}
.bus_green {color:#489060}
.subway_9{color:#968c54}
.subway_9_bg{background:#968c54; padding: 0 8px; border-radius: 15px 15px}
.subway_2{color:#489060}
.subway_2_bg{background:#489060; padding: 0 8px; border-radius: 15px 15px}
.subway_5{color:#5f52a0}
.subway_5_bg{background:#5f52a0; padding: 0 8px; border-radius: 15px 15px}

/* box_set */
.box_full {padding:40px 10px 40px 40px; width: 100%; border-radius: 40px 0 40px 0}
.box_half{padding:40px 10px 40px 40px;}
.img_map {box-shadow:2px 2px 12px 4px rgba(0,0,0,0.3)}

/* deco */
.deco_red:before {content:""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background-color: #ed6c7a; position: relative; right: 8px; bottom: 3px;}
.deco_green:before {content:""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background-color: #13a08d; position: relative; right: 8px; bottom: 3px;}
.deco_blue:before {content:""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background-color: #00a2d3; position: relative; right: 8px; bottom: 3px;}

/* 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}

/* visual */
.contents .main_visual_bg {position:relative; background-image:url(/images/story/2019/01/main_bg.jpg); background-repeat:no-repeat;background-position:center center; background-size:cover;height: 1080px;}
.contents .main_visual_bg .main-h2 { padding-top:200px; text-align:center;}
.contents .main_visual_bg .scroll { position:absolute; bottom:120px; left:50%; margin-left:-34px;}
.main_txt {padding-top: 350px;}
.main_txt > p{text-align: center; font-size:20px}
.main_txt > p > span {padding:0 15px; border-radius: 15px 15px}
.main_tab > ul {text-align: center;  padding-top: 150px;}
.main_tab > ul > li{width: 200px; height: 200px; border-radius: 50%; opacity: .85; transition:.3s; display: inline-block; margin: 0 30px; transition:0.3s all}
.main_tab > ul > li:hover {opacity: 1;}
.main_tab > ul > li:NTH-CHILD(1) {background-image: url("/images/story/2019/01/main_tab_01.png"); background-repeat: no-repeat; background-position: center 30px}
.main_tab > ul > li:NTH-CHILD(2) {background-image: url("/images/story/2019/01/main_tab_02.png"); background-repeat: no-repeat; background-position: center 30px}
.main_tab > ul > li:NTH-CHILD(3) {background-image: url("/images/story/2019/01/main_tab_03.png"); background-repeat: no-repeat; background-position: center 30px}
.main_tab > ul > li > a {color:#fff; display: block; width: 100%; height: 100%; text-align: center; font-size:20px}
.main_tab > ul > li > a > p{padding-top: 135px;}
.main_tab > ul > li > a > p:before {content:""; display: block; width: 20px; height: 3px; background: rgba(255,255,255,0.5); margin: 0 auto; position: relative; bottom: 7px;}

/* content layout */
.contents .cont_inner{width:960px; margin:0 auto; padding-bottom:45px; }
.contents .cont_inner.cont_wide{width:1200px;}
.cont{width:100%;}
.cont.cont-01{background:url(/images/story/2019/01/content01_bg.jpg) no-repeat center top; background-size:cover;  height: 1590px;}
.cont.cont-02{background:url(/images/story/2019/01/content02_bg.jpg) no-repeat center top; background-size:cover;  height: 3705px;}
.cont.cont-03{background:url(/images/story/2019/01/content03_bg.jpg) no-repeat center top; background-size:cover;  min-height: 4200px;}
.cont.cont-04{background:url(/images/story/2019/01/content04_bg.jpg) no-repeat center top; background-size:cover;  height: 500px;}

/* tab_menu */
.tab_menu {padding-top: 150px;}
.tab_menu ul li {width: 300px; height: 120px; border:3px solid #fff; float: left; border-radius: 40px 0 40px 0; margin-right: 30px; transition:.3s}
.tab_menu ul li:LAST-CHILD {margin-right: 0;}
.tab_menu ul .tab01:hover {background-color: #ed6c7a; border-color:#ed6c7a}
.tab_menu ul .tab02:hover {background-color: #13a08d;border-color:#13a08d}
.tab_menu ul .tab03:hover {background-color: #00a2d3;border-color:#00a2d3}
.tab_menu ul li:NTH-CHILD(1) {background-image: url("/images/story/2019/01/main_tab_01.png"); background-repeat: no-repeat; background-position: 30px 20px}
.tab_menu ul li:NTH-CHILD(2) {background-image: url("/images/story/2019/01/main_tab_02.png"); background-repeat: no-repeat; background-position: 30px 20px}
.tab_menu ul li:NTH-CHILD(3) {background-image: url("/images/story/2019/01/main_tab_03.png"); background-repeat: no-repeat; background-position: 30px 20px}
.tab_menu ul li a {display: block; width: 100%; height: 100%; color:#fff; font-size:20px} 
.tab_menu ul li a p{line-height:120px; margin-left: 125px;}

.tab01_on {background-color: #ed6c7a; border:none !important;}
.tab02_on {background-color: #13a08d; border:none !important;}
.tab03_on {background-color: #00a2d3; border:none !important;}

/* content section */
.section{width:100%;}
.section h2{margin-top:140px; text-align: center; font-size:50px; font-family:'noto-b' !important}
.section h2 > span {font-family:'noto-l' !important}
.section h3 {font-family:'noto-b' !important; font-size:30px}
.section h3 > span {font-family:'noto-r' !important; font-size:16px}
.section h4 {font-family:'noto-m' !important; font-size:23px; }
.section > h2:before {content:""; display: block; width: 50px; height: 5px; margin: 0 auto; position: relative; bottom: 50px;}
#content01 .section > h2:before {background: #ed6c7a;}
#content02 .section > h2:before {background: #13a08d;}
#content03 .section > h2:before {background: #00a2d3;}
#content02 .section  h3>span{background: #13a08d; padding:3px 17px; border-radius: 15px 15px}


#content01 .section .box_full {background-color: #eed1d8; background-image: url("/images/story/2019/01/content01_01.png"); background-repeat: no-repeat; background-position: 780px top}
#content01 .section .box_full > p{font-size:18px}
#content01 .section > ul > li{width: 48%;height: 195px; float: left; margin-right: 2%; margin-bottom: 2%; background-color: #eed1d8; font-size:18px}
#content01 .section > ul > li:NTH-CHILD(1) {background-image: url("/images/story/2019/01/content01_02.png"); background-repeat: no-repeat; background-position: 250px 50px; border-radius: 40px 40px 0 40px}
#content01 .section > ul > li:NTH-CHILD(2) {background-image: url("/images/story/2019/01/content01_03.png"); background-repeat: no-repeat; background-position: 220px 70px; border-radius: 40px 40px 40px 0}
#content01 .section > ul > li:NTH-CHILD(3) {background-image: url("/images/story/2019/01/content01_04.png"); background-repeat: no-repeat; background-position: 250px 30px; border-radius: 40px 0 40px 40px}
#content01 .section > ul > li:NTH-CHILD(4) {background-image: url("/images/story/2019/01/content01_05.png"); background-repeat: no-repeat; background-position: 290px 50px; border-radius: 0 40px 40px 40px}
#content01 .section > ul > li:NTH-CHILD(2n){margin-right: 0;}

#content02 .section .box_full {height: 255px; background-color:rgba(202,230,229,0.8); background-image: url("/images/story/2019/01/content02_01.png"); background-repeat: no-repeat; background-position: right top}
#content02 .section .box_full > ul {padding-left: 10px;}
#content02 .section .box_full > ul > li{font-size:16px; margin-top: 5px; position: relative;}
#content02 .section .box_full > ul > li > .txt_box {position: absolute;left: 80px; top: 0; line-height:25px}

#content02 .section .box_full02{height: 206px; background-image: url("/images/story/2019/01/content02_02.png"); background-repeat: no-repeat; background-position: right top}

#content02 .section .program_list ul li{width: 300px; float: left;margin-right: 30px;margin-bottom: 30px; height: 180px; background-color:rgba(202,230,229,0.8);padding:40px 10px 40px 40px; border-radius: 40px 0 40px 0}
#content02 .section .program_list ul li:NTH-CHILD(2n) {background-color:rgba(255,255,255,0.8)}
#content02 .section .program_list ul li:NTH-CHILD(3n) {margin-right: 0;}
#content02 .section .program_list ul li > p{margin-top: 20px;font-size:16px}

#content03 .section .box_full {background-color:rgba(233,250,255,0.8); }
#content03 .section .bg_white {background-color:rgba(255,255,255,0.8)}
#content03 .section .box_full > div {float: left;}
#content03 .section .box_full > .inner_left {padding-left:20px;}
#content03 .section .box_full > .inner_right {padding-left:80px;}
#content03 .section .box_full ul > li{font-size:16px;}
#content03 .section .box_full ul > li > .inner_box > p > span {font-family: 'noto-b'}
.bus:before {content:""; display: inline-block;background-image: url("/images/story/2019/01/bus.png"); width: 24px; height: 23px; position: relative; right: 12px;}
.subway:before {content:""; display: inline-block;background-image: url("/images/story/2019/01/subway.png"); width: 21px; height: 23px; position: relative; right: 12px;}

#content03 .section .tips {padding:0px; height: 193px;}
#content03 .section .tips > .box_left {width: 225px;height: 100%; background-color: #21a8d4; border-radius: 40px 0 0 0}
#content03 .section .tips > .box_right {padding:40px 0 0 40px}
#content03 .section .tips > .box_right > p {font-size:16px; margin: 18px 0;}
#content03 .section .tips > .box_right > span{background-color: #d5e6ee; padding:2px 20px; border-radius: 15px 15px}
#content03 .section .tips > .box_right > .side_txt{background-color: none; padding:0; border-radius:none; font-size:14px}
#content03 .section .tips_01 > .box_left {background-image: url("/images/story/2019/01/content03_02.png");background-repeat: no-repeat; background-position: center bottom}
#content03 .section .tips_02 > .box_left {background-image: url("/images/story/2019/01/content03_03.png");background-repeat: no-repeat; background-position: center center}
#content03 .section .tips_03 > .box_left {background-image: url("/images/story/2019/01/content03_04.png");background-repeat: no-repeat; background-position: center bottom}

#content03 .section .info_box > ul > li {width: 298px; height: 435px;float: left; background-color:rgba(255,255,255,0.8);border-radius: 40px 0 40px 0; margin-right: 33px; text-align: center; padding: 30px;}
#content03 .section .info_box > ul > li:LAST-CHILD {margin-right: 0;}
#content03 .section .info_box > ul > li > p{margin: 30px 0;}

#content03 .section .event {padding:0px; height: 260px;}
#content03 .section .event > .box_left {width: 225px;height: 100%; background-color: #71b4ca; border-radius: 40px 0 0 0}
#content03 .section .event > .box_right {padding:40px 0 0 40px}
#content03 .section .event > .box_right > p {font-size:16px; margin: 18px 0;}
#content03 .section .event > .box_right > span{background-color: #d5e6ee; padding:2px 20px; border-radius: 15px 15px}
#content03 .section .event > .box_right > .side_txt{background-color: none; padding:0; border-radius:none; font-size:14px}
#content03 .section .event > .box_right > .no_size{margin: 0 0 18px 0;}

#content03 .section .event_01 > .box_left {background-image: url("/images/story/2019/01/facebook.png");background-repeat: no-repeat; background-position: center center}
#content03 .section .event_02 > .box_left {background-image: url("/images/story/2019/01/insta.png");background-repeat: no-repeat; background-position: center center}