@charset "utf-8";
#container .section {position:relative; padding:0 0 100px 0; z-index:1}
#container .section:after {clear:both; display:block; content:''; visibility:hidden}
#container .section .section_con {position:relative; margin:0 auto; padding:0 50px; max-width:1400px}
#container .section .section_con:after {clear:both; display:block; content:''; visibility:hidden}
#container .section .section_con .img_wrap img {width:100%}
#container .section .section_con img.img_pc {display:block}
#container .section .section_con img.img_tab, #container .section .section_con img.img_mob {display:none}
#container .section_con ul.allocation {text-align:justify; overflow:hidden}
#container .section_con ul.allocation:after {display:inline-block !important; width:100%; height:0; content:''}
#container .section_con ul.allocation li {position:relative; float:none !important; display:inline-block}
#container .section_con ul.allocation li.clear {margin:0; padding:0; border:none; background:none}
#container .section_con ul.allocation li .allocation_inner {}
#container .section_con ul.column2 li {width:48%}
#container .section_con ul.column3 li {width:32%}
#container .section_con ul.column4 li {width:23%}
#container .section_con ul.tpl_list {margin-bottom:100px}
#container .section_con ul.tpl_list li {height:370px}
#container .section_con ul.tpl_list li .allocation_inner h3 {font-size:18px; font-weight:500; margin-bottom:20px}
#container .section_con ul.tpl_list li .allocation_inner p.txt {font-size:14px; color:#777; line-height:1.6}
#container .section_con ul.tpl_list li .allocation_inner p.img {position:absolute; bottom:0; left:0}
#container .section_con ul.tpl_list li .allocation_inner p.img img {display:block; width:100%}
#container .section_con ul.prcs_list li {text-align:center; background:url(../../img/process_arrow.png) right 10px center no-repeat}
#container .section_con ul.prcs_list li.last {background:none}
#container .section .section_con .con_box {clear:both; padding:30px 50px 10px 50px; border:3px solid #ccc; overflow:hidden}
#container .section .section_con .con_box .left {float:left; width:50%}
#container .section .section_con .con_box .right {float:right; width:50%}
#container .section .section_con .con_box dl {position:relative; margin-bottom:15px; overflow:hidden}
#container .section .section_con .con_box dl dt {clear:left; float:left; width:100px; color:#666}
#container .section .section_con .con_box dl dd {margin-left:100px; padding-right:20px; color:#888}
#container .sub_section1 {}
#container .sub_section1 h2.main_tit {padding:80px 0 56px 0; font-weight:400; font-size:56px; line-height:1.2; color:#333}
#container .sub_section2 > .section_con > h3 {font-size:48px; margin-bottom:30px}
#container .sub_section2 > .section_con p.main_desc {color:#777; line-height:2; text-align:justify; margin-bottom:120px}
#container .sub_section2 > .section_con > ul {clear:both}
#container .sub_section2 > .section_con > ul:after {clear:both; display:block; content:''; visibility:hidden}
#container .sub_section2 > .section_con > ul > li {position:relative; float:left}
#container .sub_section2 > .section_con > ul > li img {width:100%}
#container .sub_section2 > .section_con > ul > li.right {float:right}
#container .sub_section2 > .section_con > ul > li.list1 {width:50%}
#container .sub_section2 > .section_con > ul > li.list2 {width:47%}
#container .sub_section2 > .section_con > ul > li .text_effect {float:left; width:45%}
#container .sub_section2 > .section_con > ul > li .text_effect > li > .txt {display:inline-block; font-size:36px; color:#21bbb1}
#container .sub_section2 > .section_con > ul > li .text_effect > li > .txt p {position:relative; margin-bottom:10px; height:1px; ; background:#aaece6}
#container .sub_section2 > .section_con > ul > li .text_effect > li > .txt p span {position:absolute; display:inline-block; width:100%; height:1px}
#container .sub_section2 > .section_con > ul > li .text_effect > li > .txt p span.color1 {background:#21bbb1}
#container .sub_section2 > .section_con > ul > li .text_effect > li > .txt p span.color2 {width:0; background:#aaece6}
#container .sub_section2 .txt_box {float:right; width:50%}
#container .sub_section2 .txt_box p.desc {line-height:1.7; letter-spacing:-0.5px; text-align:justify; margin-bottom:30px}
#container .sub_section2 .section_con .process_box {padding:30px; border:3px solid #ccc}
#container .sub_section2 .section_con .process_box ul.prcs_list li p.img {height:70px; margin-bottom:10px}
#container .sub_section2 .section_con .process_box ul.prcs_list li p.txt {font-weight:600; line-height:1.5}
#container .sub_section3 .wrap_type1 {margin-top:200px; border:1px solid #dedede; background:#fff; overflow:hidden}
#container .sub_section3 .wrap_type1 .left {float:left; width:45%}
#container .sub_section3 .wrap_type1 .left img {display:block; width:100%}
#container .sub_section3 .wrap_type1 .center {float:left; width:30%; padding-top:50px}
#container .sub_section3 .wrap_type1 .right {float:right; width:22%; border-left:1px solid #dedede}
#container .sub_section3 ul.text_effect {padding-left:15%}
#container .sub_section3 ul.text_effect li {float:none !important}
#container .sub_section3 ul.text_effect li .txt {display:inline-block; font-size:36px; color:#21bbb1; line-height:1.4}
#container .sub_section3 ul.text_effect li .txt p {position:relative; margin-bottom:10px; height:1px; background:#aaece6}
#container .sub_section3 ul.text_effect li .txt p span {position:absolute; display:inline-block; width:100%; height:1px}
#container .sub_section3 ul.text_effect li .txt p span.color1 {background:#21bbb1}
#container .sub_section3 ul.text_effect li .txt p span.color2 {width:0; background:#aaece6}
#container .sub_section3 .wrap_type1 .right p.img {margin-bottom:75px}
#container .sub_section3 .wrap_type1 .right p.img img {width:100%}
#container .sub_section3 .wrap_type1 .right h3 {line-height:1; margin-bottom:34px; padding:0 30px}
#container .sub_section3 .wrap_type1 .right h3 p {font-size:44px; color:#000; line-height:inherit; transition:all .5s ease}
#container .sub_section3 .wrap_type1 .right h3 p:after {clear:both; display:block; content:''; visibility:hidden}
#container .sub_section3 .wrap_type1 .right h3 p.tit1 {}
#container .sub_section3 .wrap_type1 .right h3 p.tit2 {width:105%; margin-left:-5px}
#container .sub_section3 .wrap_type1 .right h3 p.tit3 {width:110%; margin-left:-5px}
#container .sub_section3 .wrap_type1 .right h3 p span {display:block; float:left; width:16%; text-align:center}
#container .sub_section3 .wrap_type1 .right h3 p span.blind {display:none}
#container .sub_section3 .wrap_type1 .center p.desc {color:#777; margin-top:30px;padding-left:15%; line-height:1.6; text-align:justify}
#container .sub_section4 {padding-top:60px}
#container .section_con .left_header {float:left; width:17%}
#container .section_con .left_header p.icon {position:relative; margin-top:40px; padding-top:35px}
#container .section_con .left_header p.icon img {display:block}
#container .section_con .left_header p.icon:after {position:absolute; top:0; left:0; display:block; width:20px; height:1px; content:''; background:#ccc}
#container .section_con .left_header h2 {font-size:30px; font-weight:400; margin-bottom:30px}
#container .section_con .left_header p.desc {color:#666; line-height:1.6}
#container .section_con .right_con {float:right; width:82%; max-width:1050px}
#container .section_con .right_con > img {width:100%}
#container .section_con .photo_slide {}
#container .section_con .photo_slide .slide_wrap {position:relative; margin-bottom:30px}
#container .section_con .photo_slide .slide_wrap .tit_box {position:absolute; width:140px; height:135px; padding:20px; top:0; right:0; color:#fff; background:#21bbb1; z-index:50}
#container .section_con .photo_slide .slide_wrap .tit_box h2 {font-size:24px; line-height:1.2; margin-bottom:10px}
#container .section_con .photo_slide .slide_wrap .tit_box h3 {font-size:18px; font-weight:400}
#container .section_con .photo_slide .slide_wrap .photo_list {overflow:hidden}
#container .section_con .photo_slide .slide_wrap .photo_list li {position:relative; float:left; cursor:pointer}
#container .section_con .photo_slide .slide_wrap .photo_list li img {display:block}
#container .section_con .photo_slide .slide_wrap .photo_list li a {display:none; position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; z-index:10}
#container .section_con .photo_slide .slide_wrap .photo_list li a .mask {position:absolute; display:block; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:20}
#container .section_con .photo_slide .slide_wrap .photo_list li a img {display:inline-block; position:relative; text-align:center; z-index:30}
#container .section_con .photo_slide .paging {clear:both; margin:30px 0 100px 0; font-size:28px; color:#bbb; text-align:right}
#container .section_con .photo_slide .paging a {display:inline-block}
#container .section_con .photo_slide .paging a img {vertical-align:-3px}
#container .section_con .photo_slide .paging span.current {color:#21bbb1}
#container .section_con .photo_slide .photo_swipe {position:relative; display:none; overflow:hidden}
#container .section_con .photo_slide .photo_swipe ul {position:relative}
#container .section_con .photo_slide .photo_swipe ul li {position:relative; float:left}
#container .section_con .photo_slide .photo_swipe ul li img {display:block; width:100%}
#container .section_con .photo_slide .photo_swipe ul li p {position:absolute; display:inline-block; bottom:0; left:0; padding:15px 25px; color:#333; background:#fff}
#container .section_con .photo_slide .paging_m {clear:both; display:none; margin:30px 0 100px 0; font-size:28px; color:#bbb; text-align:center}
#container .section_con .photo_slide .paging_m a {display:inline-block}
#container .section_con .photo_slide .paging_m a img {vertical-align:-3px}
#container .section_con .photo_slide .paging_m span.current {color:#21bbb1}
#container .section_con .map_list li .map_list_wrap {padding-bottom:15px;}
#container .section_con .kakaomap_wrap {margin-top: 20px;}
/* #container .section_con .map_list li:hover h3, #container .section_con .map_list li .map_list_wrap:hover p, #container .section_con .map_list li.on h3, #container .section_con .map_list li.on p, #container .section_con .map_list li:hover a, #container .section_con .map_list li.on a {color:#21bbb1 !important} */
/* #container .section_con .map_list li:hover p.tel, #container .section_con .map_list li.on p.tel {background:url(../../img/map_phone_c.png) left center no-repeat !important}
#container .section_con .map_list li:hover p.fax, #container .section_con .map_list li.on p.fax {background:url(../../img/map_printer_c.png) left center no-repeat !important} */
#container .section_con .map_list li .map_list_wrap h3 {font-size:18px; font-weight:400; margin-bottom:20px}
#container .section_con .map_list li .map_list_wrap p {color:#777; font-weight:500}
#container .section_con .map_list li .map_list_wrap p.new {margin-bottom:20px;}
#container .section_con .map_list li .map_list_wrap p.old {margin-bottom:50px}
#container .section_con .map_list li .map_list_wrap p.tel {margin-bottom:15px; padding-left:45px; background:url(../../img/map_phone_c.png) left center no-repeat}
#container .section_con .map_list li .map_list_wrap p.fax {padding-left:45px; background:url(../../img/map_printer_c.png) left center no-repeat}
#container .section_con .map_list li .map_list_wrap a.pointer {display:block; position:absolute; right:0; bottom:15px}
#container .section_con .map_list li.map {display:none; margin-top:30px; width:100%}
#container .section_con .map_list li.map .map_area {position:relative; width:100%; height:500px; overflow:hidden}
#container .section_con .map_list li.map .map_area #map {height:100%}
/* ¼­ºê ºñÁÖ¾ó */
#sub_visual {position:relative}
#sub_visual .visual_wrap {position:relative; overflow:hidden}
#sub_visual img {width:100%; transform:scale(1.1); -webkit-transform:scale(1.1); -moz-transform:scale(1.1); transition:all 8s ease}
#sub_visual img.load {width:100%; transform:scale(1); -webkit-transform:scale(1); -moz-transform:scale(1)}
#sub_visual .visual2, #sub_visual .visual3 {display:none}
#sub_visual .visual_acc {position:relative; margin:0 auto; width:100%; max-width:1400px}
#sub_visual .visual_tit {position:absolute}
#sub_visual .visual_tit {top:50%; left:50%; margin-left:-253.5px;margin-top: -70.5px;}
#sub_visual .visual_tit ul {position:relative; text-align:center}
#sub_visual .visual_tit ul li .txt {display:inline-block; font-size:24px; line-height:1.5; color:#fff;font-weight: normal;}
#sub_visual .visual_tit ul li .txt p {position:relative; margin-bottom:10px; height:1px; background:yellow}
#sub_visual .visual_tit ul li .txt p span {position:absolute; left:0; display:inline-block; width:100%; height:1px}
#sub_visual .visual_tit ul li .txt p span.color1 {background:cyan}
#sub_visual .visual_tit ul li .txt p span.color2 {width:0; background:yellow}




/* Layer popup */
#img_popup_wrap {position:fixed; top:0; left:0; width:100%; height:100%; z-index:990; visibility:hidden}
#mask {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.8; filter:alpha(opacity='80')}
#imgPopup {position:fixed; top:50%; left:50%; width:60%; background:#fff; z-index:1000}
#imgPopup .img_wrap {position:relative; height:100%}
#imgPopup .img_wrap ul {}
#imgPopup .img_wrap ul li {display:none}
#imgPopup .img_wrap ul li.on {display:block}
#imgPopup .img_wrap ul li img {display:block; width:100%}
#imgPopup .img_wrap p.tit {clear:both; line-height:50px; padding:0 30px}
#img_popup_wrap a {position:absolute; z-index:1010}
#img_popup_wrap a.pop_close {top:20px; right:10%}
#img_popup_wrap a.pop_prev {top:50%; left:10%}
#img_popup_wrap a.pop_next {top:50%; right:10%}




/* ¹Ìµð¾î Äõ¸® */
@media screen and (max-width:1500px) {
#container .section_con .photo_slide .slide_wrap .tit_box {position:static; top:inherit; right:inherit; width:auto; height:auto; color:#21bbb1; padding:80px 0 20px 0; background:none}
#container .section_con .photo_slide .slide_wrap .tit_box h2, #container .section_con .photo_slide .slide_wrap .tit_box h3 {display:inline-block; font-size:40px}
#container .section_con .photo_slide .slide_wrap .tit_box h2 {padding-right:10px}
#container .section_con .photo_slide .slide_wrap .tit_box br {display:none}
#container .section_con .photo_slide .slide_wrap .photo_list {display:none}
#container .section_con .photo_slide .paging {display:none}
#container .section_con .photo_slide .photo_swipe {display:block}
#container .section_con .photo_slide .paging_m {display:block}
}
@media screen and (max-width:1280px) {
#sub_visual .visual_tit {margin-left: -296px; margin-top: -79.5px;}
#sub_visual .visual_tit ul li .txt {font-size: 28px;}
}
@media screen and (max-width:1024px) {
#container .section .section_con img.img_tab {display:block}
#container .section .section_con img.img_pc, #container .section .section_con img.img_mob {display:none}
#container .section1 .section_con ul li {width:48%; margin-bottom:4%}
#container .section1 .section_con ul li.full {width:100%}
#container .section2 .section_con ul li {width:48%}
#container .section2 .section_con ul li.last {display:none}
#container .section3 .section_con .left h2 p {font-size:36px}
#container .section3 .section_con .left h2 p.tit2 {margin-left:-10px}
#container .section3 .section_con .right .video img.play_icon {width:60px; height:60px; top:35%; left:40%}
#container .section4 .section_con img.visual1, #container .section4 .section_con img.visual3 {display:none}
#container .section_con .kakaomap_wrap {margin-top: 0;padding: 0 30px;}
#container .section4 .section_con img.visual2 {display:block}
#container .section4 .section_con > div > h2 {font-size:42px}
#container .section4 .section_con > div > p {line-height:1.8; margin-bottom:20px}
#container .section5 ul:after {clear:both; display:block; content:''; visibility:hidden}
#container .section5 ul li {position:relative; display:block; width:100%; margin-bottom:50px; padding:0; border:1px solid #dedede; background:#f7f7f7; box-sizing:border-box}
#container .section5 ul li.last {margin-bottom:0}
#container .section5 ul li div {text-align:left; width:300px; margin:0; padding:40px}
#container .section5 ul li div p.icon {position:absolute; top:40px; right:40px; margin:0}
#sub_visual {margin:0}
#sub_visual .visual1, #sub_visual .visual3 {display:none}
#sub_visual .visual2 {display:block}
#container .no-padding .section_con {padding-left:0; padding-right:0}
#container .sub_section2 {margin-bottom:70px; padding-bottom:70px; border-bottom:1px solid #eee}
#container .sub_section2 > .section_con > ul > li {float:none; width:100% !important}
#container .sub_section2 > .section_con > ul > li.list1 {margin-bottom:50px}
#container .sub_section2 > .section_con > ul > li .text_effect {float:none; width:100%}
#container .sub_section2 > .section_con > ul > li .text_effect > li > .txt p {margin-bottom:0}
#container .sub_section2 > .section_con > ul.tpl_list {padding-top:30px}
#container .sub_section2 > .section_con > ul.tpl_list li {width:48% !important; margin-bottom:50px}
#container .sub_section2 .txt_box {float:none; width:100%; margin-top:75px}
#container .sub_section2 .txt_box p.desc {margin-bottom:20px}
#container .sub_section2 .txt_box p.desc br {display:none}
#container .sub_section3 .wrap_type1 {margin-top:0; border:none; background:none}
#container .sub_section3 .wrap_type1 .left {float:none; width:100%}
#container .sub_section3 .wrap_type1 .center {float:none; width:100%; margin-bottom:50px}
#container .sub_section3 .wrap_type1 .center p.desc {padding-left:0 !important}
#container .sub_section3 .wrap_type1 .center ul.text_effect {padding-left:0}
#container .sub_section3 .wrap_type1 .right {float:none; width:100%; border:none}
#container .sub_section3 ul.text_effect li .txt {font-size:30px}
#container .sub_section3 ul.text_effect li .txt p {margin-bottom:0}
#container .sub_section3 .wrap_type1 .right h3 p {width:inherit !important; margin-left:0 !important}
#container .sub_section3 .wrap_type1 .right h3 p.tit2 {display:none}
#container .sub_section3 .wrap_type1 .right h3 p span.blind {display:inline-block !important}
#container .sub_section3 .wrap_type1 .right h3 {margin-bottom:25px; padding:0 !important}
#container .sub_section3 .wrap_type1 .right h3 p span {display:inline; float:none; width:inherit; padding-bottom:0 !important}
#container .sub_section4 {padding-top:80px}
#container .no-padding .section_con .left_header {float:none; width:inherit; max-width:inherit; padding:0 50px}
#container .section_con .left_header {float:none; width:100%; max-width:inherit; margin-bottom:50px}
#container .section_con .left_header p.icon {padding-top:0}
#container .section_con .left_header p.desc {font-size:24px; color:#555}
#container .section_con .left_header h2, #container .section_con .left_header p.icon:after {display:none}
#container .section_con .right_con {float:none; width:100%; max-width:1024px}
#container .section_con .photo_slide {padding:0 50px}
#container .section_con .map_list li {width:100% !important; margin-bottom:50px; padding:0 50px;box-sizing:border-box}
#container .section_con .map_list li .map_list_wrap h3 {font-size:34px}
#container .section_con .map_list li .map_list_wrap p {font-size:24px}
#container .section_con .map_list li .map_list_wrap a.pointer {bottom:40px; right:50px}
#container .section_con .map_list li.map {margin-top:0; padding:0 !important}
#container .section_con .map_list li.map .map_area {height:200px}
#img_popup_wrap {display:none}
}




@media (max-width:640px) and (min-width:100px) {
#container .section {padding-bottom: 0;}
#container .section .section_con {padding:0 30px !important}
#container .no-padding .section_con {width:inherit !important; padding-left:0 !important; padding-right:0 !important}
#container .section .section_con img.img_mob {display:block}
#container .section .section_con img.img_pc, #container .section .section_con img.img_tab {display:none}
#container .sub_section1 h2.main_tit {padding:0; font-size:24px}
#sub_visual {margin:0 0 50px 0}
#sub_visual .visual1, #sub_visual .visual2 {display:none}
#sub_visual .visual3 {display:block}
#sub_visual .visual_tit {margin-left: -148px;margin-top: -40.5px;}
#sub_visual .visual_tit ul li .txt {font-size: 14px;}
#sub_visual .visual_tit ul li .txt p {margin-bottom:5px !important}
#container .sub_section1 h2.main_tit {margin-bottom:35px}
#container .sub_section2 {margin-bottom:35px !important; padding-bottom:35px !important}
#container .sub_section2 > .section_con > ul > li .text_effect > li > .txt {font-size:24px !important}
#container .sub_section2 .txt_box {margin-top:35px !important}
#container .sub_section2 .txt_box p.desc {margin-bottom:15px !important}
#container .section .section_con .con_box {padding:15px 25px}
#container .section .section_con .con_box > div {float:none !important; width:100% !important}
#container .section .section_con .con_box dl dt, #container .section .section_con .con_box dl dd {font-size:12px}
#container .sub_section2 > .section_con > h3 {font-size:24px !important; margin-bottom:25px}
#container .section_con ul.tpl_list {margin-bottom:0}
#container .sub_section2 > .section_con > ul.tpl_list li {width:100% !important; height:initial}
#container .section_con ul.tpl_list li .allocation_inner p.img {position:static}
#container .section_con ul.tpl_list li .allocation_inner p.txt {margin-bottom:30px}
#container .sub_section2 > .section_con p.main_desc {margin-bottom:30px}
#container .sub_section2 .section_con .process_box {padding:30px 0}
#container .section_con ul.prcs_list li {background:url(../../img/process_arrow.png) right center no-repeat; background-size:16px}
#container .section_con ul.prcs_list li p.txt {font-size:12px}
#container .sub_section3 .wrap_type1 .center {margin-right:25px; padding-top:25px}
#container .sub_section3 .wrap_type1 .right p.img {margin-bottom:25px}
#container .sub_section3 ul.text_effect li .txt {font-size:24px}
#container .sub_section3 .wrap_type1 .right h3 p span {font-size:24px; margin:0 !important}
#container .sub_section3 .wrap_type1 .right h3 p {font-size:inherit}
#container .sub_section4 {padding-top:40px}
#container .no-padding .section_con .left_header {padding:0 30px}
#container .section_con .left_header p.icon img {width:40px}
#container .section_con .left_header p.desc {font-size:12px; line-height:1.6}
#container .section_con .right_con {margin-top:35px}
#container .section_con .photo_slide {padding:0}
#container .section_con .photo_slide .slide_wrap .tit_box {padding:0 30px 15px 30px}
#container .section_con .photo_slide .slide_wrap .tit_box h2, #container .section_con .photo_slide .slide_wrap .tit_box h3 {font-size:20px !important}
#container .section_con .photo_slide .slide_wrap .tit_box h2 {padding-right:5px}
#container .section_con .photo_slide .paging_m {font-size:18px; text-align:center; margin:40px 0 60px 0}
#container .section_con .photo_slide .paging_m a img {width:12px; vertical-align:-5px}
#container .section_con .map_list li {margin-bottom:30px; padding:0 30px}
#container .section_con .map_list li .map_list_wrap h3 {font-size:17px; margin-bottom:10px}
#container .section_con .map_list li .map_list_wrap p {font-size:12px}
#container .section_con .map_list li .map_list_wrap p.old {margin-bottom:10px}
#container .section_con .map_list li .map_list_wrap p.tel, #container .section_con .map_list li .map_list_wrap p.fax {font-size:13px}
#container .section_con .map_list li .map_list_wrap a.pointer {bottom:30px; right:30px}
#container .section_con .map_list li .map_list_wrap {padding-bottom:25px}
}