@charset "utf-8";

#wrap{position:relative}
.container{max-width:1200px;margin:0 auto;height:100%}
.container.sub{background:url(/images/common/sub_bg.png) left top repeat-y;background-size:100%}

/* 헤더 상단 툴바 */
.toolbar{height:39px;border-bottom:1px solid #e7e7e7}
.area_btns{float:right}
.area_btns li{float:left}
.area_btns li a{display:block;padding:9px 21px 10px;color:#666;font-size:0.875em}
.area_btns li a.abtn{color:white}
.area_btns li a.abtn.btn1{background-color:#0886cb}
.area_btns li a.abtn.btn2{background-color:#0fc1c7}
.area_btns li a.abtn.btn3{background-color:#00509c}
.area_btns li a.abtn.btn4{background-color:#666}
.area_btns li a.abtn.btn5{background-color:#1e94a5}
.area_btns li a.link_btn{border-right:1px solid #e7e7e7}
.area_btns li a.link_btn:hover{color:#0886cb}
.area_btns li a img{margin:2px 0 0 7px}

/* 헤더 하단 네비영역 */
.nav_bar{position:relative;height:80px;border-bottom:1px solid #dcdcdc;}
.nav_bar .logo{float:left;margin-top:15px;transition:all .3s}
.nav_bar .gnb{width:65%;float:right;margin:25px 0 0}
.nav_bar .gnb .depth1>li{position:relative;float:left;text-align:left;font-weight:bold;-webkit-transition:all .3s;-moz-transition:all .3s;-ms-transition:all .3s;-o-transition:all .3s;transition:all .3s}
.nav_bar .gnb .depth1>li:first-child{width:19%}
.nav_bar .gnb .depth1>li:nth-child(2){width:30%}
.nav_bar .gnb .depth1>li:nth-child(3){width:19%}
.nav_bar .gnb .depth1>li:nth-child(4){width:19%}
.nav_bar .gnb .depth1>li>a{font-size:22px;color:#000000;}
.nav_bar .gnb .depth1>li>a:hover, .nav_bar .gnb .depth1>li>a:focus, .nav_bar .gnb .depth1>li>a.on{color:#0886cb}
.nav_bar .gnb .depth1>li>ul{position:absolute;width:100%;top:68px;z-index:999;min-height:350px;overflow:hidden}
.nav_bar .gnb .depth1>li>ul>li{text-align:left;}
.nav_bar .gnb .depth1>li>ul>li>a{display:block;color:#000000;font-size:15px;line-height:24px;}
.nav_bar .gnb .depth1>li>ul>li>a:hover, .nav_bar .gnb .depth1>li>ul>li>a:focus,.nav_bar .gnb .depth1>li>ul>li>a.on{color:#0886cb;font-weight:600}
.nav_bar .menu_bg{width:100%;height:350px;position:absolute;top:81px;background:#fff;border-bottom:1px solid #dcdcdc;z-index:998;}

/* 모바일 메뉴 */
#mobile_menu{display:none}
.mo_menu_btn{position:fixed;top:30px;right:37px;width:30px;z-index:9999}
.mo_menu_btn>a{display:block;text-indent:-9999px}
.mo_menu_btn>.menu_open{width:30px;height:22px;background:url(/images/mo_menu_btn.gif) no-repeat;background-size:100%}
.mo_menu_btn>.menu_close{width:28px;height:28px;background:url(/images/menu_close_btn.gif) no-repeat;background-size:100%}
.mo_menu{width:264px;background:white;position:fixed;background:white;z-index:999;right:-100%;top:83px;bottom:0;overflow-y:scroll}
.mo_menu>.mo_dep1>li{border-top:1px solid #dcdcdc}
.mo_menu>.mo_dep1>li:first-child{border-top:0}
.mo_menu>.mo_dep1>li>a{display:block;padding:10px 0 10px 7%;font-weight:bold;color:#25292d;font-size:1.2em;background:url(/images/dep1_plus.gif) 93% center no-repeat}
.mo_menu>.mo_dep1>li>a.on{background:url(/images/dep1_minus.gif) 93% center no-repeat}
.mo_menu>.mo_dep1>li>a:hover,.mo_menu>.mo_dep1>li>a.on,.mo_menu>.mo_dep1>li>a:focus{color:#0886cb;font-weight:bold}
.mo_menu>.mo_dep1>li>a.bot_line{border-bottom:1px solid #dcdcdc}
.mo_menu>.mo_dep1>li.c1>a{color:#fff;background:#0886cb}
.mo_menu>.mo_dep1>li.c2>a{color:#fff;background:#0fc1c7}
.mo_menu>.mo_dep1>li.c3>a{color:#fff;background:#00509c}
.mo_menu>.mo_dep1>li.c6>a{color:#fff;background:#1e94a5}
.mo_menu>.mo_dep1>li.c4>a{color:#fff;background:#666666}
.mo_menu>.mo_dep1>li.c5>a{color:#222;background:#d1d1d1}
.mo_menu>.mo_dep1>li.top_none{border-top:0}
.mo_menu>.mo_dep1>li>ul{padding:10px 0}
.mo_menu>.mo_dep1>li>ul>li>a{display:block;padding:3px 0 3px 7%;color:#666}
.mo_menu>.mo_dep1>li>ul>li>a:hover,.mo_menu>.mo_dep1>li>ul>li>a.on,.mo_menu>.mo_dep1>li>ul>li>a:focus{color:#0886cb;font-weight:bold}


/* 메인 비주얼 영역 */
#slides{position:relative}
.slides{text-align:center}
#slides>a{position:absolute;text-indent:-9999px;z-index:99}
.slidesjs-container{min-height:674px !important}
.slidesjs-previous{width:74px;height:25px;left:-74px;top:50%;margin-top:-12.5px;background:url(/images/prev_btn.png) left top no-repeat}
.slidesjs-next{width:74px;height:25px;right:-74px;top:50%;margin-top:-12.5px;background:url(/images/next_btn.png) left top no-repeat}
.slidesjs-play,.slidesjs-stop{width:9px;height:12px;top:15px;left:300px;background-repeat:no-repeat}
.slidesjs-play{background:url(/images/play_btn.png)}
.slidesjs-stop{background:url(/images/stop_btn.png)}
.slidesjs-pagination{position:absolute;top:10px;z-index:98}
.slidesjs-pagination li{float:left;margin-right:20px;font-size:0.875em}
.slidesjs-pagination li:first-child a:after{content:"70 Years' History";display:inline-block;color:#d2d2d2;font-weight:bold}
.slidesjs-pagination li:nth-child(2) a:after{content:"The Ocean City";display:inline-block;color:#d2d2d2;font-weight:bold}
.slidesjs-pagination li a span{width:13px;height:14px;display:inline-block;background:url(/images/main/vi_page_off.png) no-repeat;margin-right:5px}
.slidesjs-pagination li:first-child a.active span{background:url(/images/vi_page_on1.png) no-repeat}
.slidesjs-pagination li:nth-child(2) a.active span{background:url(/images/vi_page_on2.png) no-repeat}
.slidesjs-pagination li:first-child a.active:after{color:#0886cb}
.slidesjs-pagination li:nth-child(2) a.active:after{color:#3ec4c9}
/* 메인 비쥬얼1 */
.v1_text span{display:block;margin-top:99px;font-size:1.25em;font-weight:bold;color:#0886cb;animation-name:v1;animation-duration:1s}
.v1_text strong{font-size:3em;font-weight:bold;color:#000;animation-name:v1;animation-duration:1s}
.v1_img{margin-top:36px}
.v_list{overflow:hidden}
.v_list ul li{width:33.3%;float:left;text-align:left;background:url(/images/visual_line.gif) right center no-repeat}
.v_list ul li:last-child{background:none}
.v_list ul li dl{padding:0 10.731% 0 37.31%;background-position:14.6341% 25px;background-repeat:no-repeat}
.v_list ul li dl dt{font-size:1.25em;font-weight:bold;color:#0886cb;margin-bottom:8px}
.v_list ul li dl dd{font-size:0.875em;color:#666}
.v_item1{animation-name:v2;animation-duration:1s}
.v_item2{animation-name:v2;animation-duration:1.5s}
.v_item3{animation-name:v2;animation-duration:2s}
.v_list ul li.v_item1 dl{background-image:url(/images/main/v1_item_01.gif)}
.v_list ul li.v_item2 dl{background-image:url(/images/main/v1_item_02.gif)}
.v_list ul li.v_item3 dl{background-image:url(/images/main/v1_item_03.gif)}
/* 메인 비쥬얼2 */
.v2_text{width:100%;position:absolute;top:99px}
.v2_text span{display:block;font-size:1.25em;font-weight:bold;color:#2fc5ca;animation-name:v1;animation-duration:1s}
.v2_text strong{font-size:3em;font-weight:bold;color:#000;animation-name:v1;animation-duration:1s}
.v_list.type_1{position:absolute;top:500px}
.v_list.type_1 ul li dl dt{color:#0fc1c7}
.v_list.type_1 ul li.v_item1 dl{background-image:url(/images/main/v2_item_01.png)}
.v_list.type_1 ul li.v_item2 dl{background-image:url(/images/main/v2_item_02.png)}
.v_list.type_1 ul li.v_item3 dl{background-image:url(/images/main/v2_item_03.png)}

/* 메인 컨텐츠 영역 */
#wrap.main .content{position:relative;background:none}
.main_banner{border-bottom:1px solid #ededed}
.main_banner ul{max-width:1200px;margin:0 auto;overflow:hidden}
.main_banner ul li{float:left;position:relative}
.main_banner ul li.bn1{width:60.91666666666667%}
.main_banner ul li.bn2{width:39.08333333333333%}

.product_wrap{position:relative;}
.product{max-width:1200px;margin:0 auto;position:relative}
.product_wrap h2{padding:35px 0;text-align:center;color:#222;font-size:1.875em;letter-spacing: 2px;}


.news_wrap{position:relative;border-bottom:1px solid #ededed}
.news{max-width:1200px;margin:0 auto;position:relative}
.news_wrap h2{padding:15px 0;text-align:center;color:#222;font-size:1.875em;border-left:1px solid #ededed;border-right:1px solid #ededed;border-bottom:1px solid #ededed}
.news_list{overflow:hidden}
.news_list li{float:left;width:25%;box-sizing:border-box;border-right:1px solid #ededed}
.news_list li:first-child{border-left:1px solid #ededed}
.news_list li .item{padding:30px 10.03344481605351%}
.news_list li a{font-weight:300}
.news_list li a strong{font-size:1.15em;color:#333;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;line-height:1.3em;height:2.6em}
.news_list li a:hover strong,.news_list li a:focus strong{text-decoration:underline}
.news_list li a p{margin-top:18px;font-size:0.9375em;color:#666;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;word-wrap:break-word;line-height:1.5em;height:6em}
.news_list li a time{display:block;margin-top:10px;font-size:0.9375em;color:#888}
span.new{display:inline-block;width:21px;height:21px;background:url(/images/common/new.gif) left top no-repeat;vertical-align:middle;margin:-2px 0 0 5px}
.more{display:block;position:absolute;top:20px;right:24px;width:36px;height:36px;background:url(/images/common/more_btn.gif);text-indent:-9999px}

/*.new_fac_wrap{border-bottom:1px solid #ededed}*/
.new_fac{position:relative}
.new_fac h2{margin-bottom:30px;text-align:center;color:#fff;font-size:1.875em}
.new_fac ul{overflow:hidden}
.new_fac ul li{float:left;width:33.3%}
.new_fac ul li:first-child{width:33.4%}
.new_fac ul li>a{display:block;padding:10px 0;text-align:center;color:#fff}
.new_fac ul li.tb1>a, .new_fac ul li.tb1>div{background:#0fc1c7}
.new_fac ul li.tb2>a, .new_fac ul li.tb2>div{background:#0886cb}
.new_fac ul li.tb3>a, .new_fac ul li.tb3>div{background:#00509c}
.new_fac ul li>div{position:absolute;left:0;width:100%;padding:50px 0}
.circle{-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}
.fac_slide .swiper-slide{overflow:hidden;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}
.fac_slide{width:80%;margin:0 auto;overflow:hidden;position:relative}
.fac_slide_wrap{width:85%;margin:0 auto;position:relative}
.fac_slide .swiper-slide a:hover .overbox{left:0}
.overbox{background:rgba(0,0,0,0.3);width:100%;height:100%;position:absolute;z-index:100;left:-100%;top:0;text-align:center;-webkit-transition:all .3s;-moz-transition:all .3s;-ms-transition:all .3s;-o-transition:all .3s;transition:all .3s}
.overbox img{-webkit-transition: all .3s .2s;-moz-transition: all .3s .2s;-ms-transition: all .3s .2s;-o-transition: all .3s .2s;transition: all .3s .2s;position:absolute;left:50%;margin-left:-17.5px;top:-100%}
.fac_slide .swiper-slide a:hover .overbox img{top:50%;margin-top:-17.5px}
.fac_slide .swiper-slide>a>img{width:100%}

.nullbox{max-width:1200px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;height:50px;margin:0 auto;}

/* 푸터 */
footer{clear:both;background:#666666}
.footer_btn{padding:15px 0;border-bottom:1px solid #5e5e5e}
.footer_btn ul{overflow:hidden}
.footer_btn ul li{float:left;font-size:0.875em;color:#d3d3d3}
.footer_btn ul li a{font-size:1.125em;color:#d3d3d3}
.footer_addr{position:relative;padding:19px 0 30px;color:white}
.footer_addr address{display:inline-block;margin:-6px 0 0 2.166666666666667%;font-size:0.9375em}
.footer_addr address img{float:left}
.footer_addr address a{color:white}

.group_link{float:right}
.group_link .select{position:relative;display:inline-block;cursor:default;text-align:left;line-height:30px;clear:both;color:#fff}
.group_link span.selected{float:left;width:138px;text-indent:10px;background:#8b8b8b;overflow:hidden}
.group_link .select_btn{display:inline-block;width:30px;height:30px;border-left:1px solid #7b7b7b;text-align:center;font-size:12px;background:#8b8b8b url(/images/common/foot_arrow.gif) center no-repeat;color:#fff}
.group_link .select .link_sel{background:#8b8b8b;color:#fff;border:0;height:30px}
.group_link .go_btn{display:inline-block;background:#4c4c4c;color:#fff;width:40px;height:30px;line-height:30px;text-align:center;vertical-align:top}
ul.selectOptions{position:absolute;top:-90px;left:0;width:168px;border:1px solid #7b7b7b;overflow:hidden;background:#fff;display:none;margin:0;list-style:none inside none;padding-left:0}
li.selectOption{display:block;line-height:20px;padding:5px 0 5px 10px;font-size:0.875em;list-style:none;margin:0;color:#7b7b7b}
li.selectOption:hover{color:#f6f6f6;background:#4096ee}

/* 서브페이지 layout */
.content{/*background:url(/images/common/sub_top_bg.png) center top repeat-x*/}

#left_menu{float:left;width:20%;height:100%;box-sizing:border-box;border-left:1px solid #eaeaea;border-right:1px solid #eaeaea}
#left_menu>h2{background:#2E3192;color:#fff;height:149px;line-height:79px;text-align:center;font-size:1.625em}
#left_menu .mo_sub_menu{display:none}
.left_menu li{}
.left_menu li a{display:block;padding:10px 0 10px 8.3333%;color:#000;background:#fff;font-weight:normal}
.left_menu>li>a{border-bottom:1px solid #eaeaea}
.left_menu li a:hover, .left_menu li a:focus, .left_menu li a.on{color:#fff;background:#6264AD url(/images/left_menu_arrow.png) 91.7% center no-repeat}
.left_menu li ul{border-bottom:1px solid #eaeaea}
.left_menu li ul li{border:0}
.left_menu li ul li a{padding:8px 0 8px 30px;font-size:0.875em;background:#fff url(/images/common/bul_bar.gif) 20px center no-repeat}
.left_menu li ul li a:hover, .left_menu li ul li a:focus, .left_menu li ul li a.on{background:#fff url(/images/common/bul_bar.gif) 20px center no-repeat;color:#0886cb;}


.left_menu li ul li ul li{border:0}
.left_menu li ul li ul li a{padding:5px 0 3px 40px;font-size:0.750em;background-color:#efefef; background-image:none !important;}
.left_menu li ul li ul li a:hover, .left_menu li ul li ul li a:focus, .left_menu li ul li ul li a.on{background-color:#efefef; background-image:none !important; padding-left:40px; font-weight:600; color:#000;font-size:0.750em;}

#content_input{position:relative;float:left;width:76.666666667%;padding:30px 0 80px 3.333333333%;min-height:550px; }
#content_input .content_tit{margin-bottom:50px}
#content_input .sub_nav{position:absolute;top:10px;right:0;overflow:hidden;line-height:0.9em}
#content_input .sub_nav li{float:left;padding-left:15px;background:url(/images/sub_link_arrow.gif) 7px 12px no-repeat}
#content_input .sub_nav li:first-child{padding-left:0;background:none}
#content_input .sub_nav li:first-child a img{margin-bottom:1px}
#content_input .sub_nav li a{color:#666;font-size:0.875em}
#content_input .sub_nav li a:hover,#content_input .sub_nav li a:focus{color:#0886cb;text-decoration:underline}
#content_input h3{font-family:'LotteMartDream-L'; color:#333;font-size:2em;font-weight:500}
#content_input .page_move{display:none}

.btn_area{margin-top:30px;text-align:center}

/* PCI 포털 로그인 */
.pci{height:100%}
#pci{height:100%;background:url(/images/common/pci_bg.jpg) center center no-repeat}
.pci_wrap{position:relative;max-width:550px;height:100%;margin:0 auto;text-align:center}
.pci_login{position:absolute;top:50%;margin-top:-295.5px}
.pci_login>img{margin-bottom:23px}
.pci_login>p{color:#fff;font-size:0.875em}
.login_box{margin-top:50px;box-sizing:border-box;width:100%;padding:70px 10%;background:rgba(228,224,223,0.25);border:1px solid #95a5c2;border-radius:3px;box-shadow:5px 5px 5px rgba(0,0,0,0.2)}
.pci_text{position:relative;width:87%;height:40px;padding:0 !important;border:0 !important;color:#4b4b4b;padding:0 0 0 60px !important;margin-bottom:15px}
#pci_id{background:#fff url(/images/common/pci_id.gif) 10px center no-repeat}
#pci_id:before{content:"";display:block;width:1px;height:30px;background:#cdcdcd;position:absolute;left:50px}
#pci_pw{background:#fff url(/images/common/pci_pw.gif) 10px center no-repeat}
.id_save{text-align:left}
.id_save label{color:#fff}
#login_btn{width:100%;height:50px;margin-top:15px;background:#ef761d;color:#fff;font-weight:bold;border:0;cursor:pointer}


/*하단 배너 교체*/
.new_bn{width:100%; height:232px;}
.new_bn li{width:24%; margin:0 10px 0 0px; height:100%;float:left; box-sizing:border-box; color:#fff; position:relative; overflow:hidden; cursor:pointer;}
.new_bn_con{position:absolute; top:0;}
.new_bn_con h2{font-weight:600; font-size:2.000em; margin:40px 40px 20px 40px; letter-spacing:-0.05em;}
.new_bn_con p{margin:20px 40px;}
.more2{position:absolute; bottom:0; right:0px; cursor:pointer;}
    .box_new span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/ft_bn1.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    }
    .box_new:hover span, .box_new2:hover span, .box_new3:hover span, .box_new4:hover span{
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -ms-transform: scale(1.2); /* IE 9 */
        -o-transform: scale(1.2);
        transform: scale(1.2);
        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.2, M12=0, M21=0, M22=1.2, SizingMethod='auto expand'); /* IE6 and 7 */ 
    } 
    .box_new2 span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/ft_bn2.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;           
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    }    
     .box_new3 span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/ft_bn3.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;     
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    }   
	.box_new4 span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/ft_bn4.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;     
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    } 


/*하단 배너 교체*/
.new_bn2{width:100%; height:300px;}
.new_bn2 li{width:25%; height:100%;float:left; box-sizing:border-box; color:#fff; position:relative; overflow:hidden; cursor:pointer;}
.new_bn2_con{position:absolute; top:0;}
.new_bn2_con h2{font-weight:600; font-size:1.700em; margin:130px 40px 20px 100px; letter-spacing:-0.05em; color:#264A6C;}
.new_bn2_con p{margin:10px 20px;color:#264A6C;text-align:center; font-size:14px;}
.more2{position:absolute; bottom:0; right:0px; cursor:pointer;}
    .box2_new span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/sd_bn1.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;      
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    }
    .box2_new:hover span, .box_new2:hover span, .box_new3:hover span{
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -ms-transform: scale(1.2); /* IE 9 */
        -o-transform: scale(1.2);
        transform: scale(1.2);
        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.2, M12=0, M21=0, M22=1.2, SizingMethod='auto expand'); /* IE6 and 7 */ 
    } 
    .box2_new2 span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/sd_bn2.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;     
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    }
	.box2_new2:hover span, .box_new2:hover span, .box_new3:hover span{
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -ms-transform: scale(1.2); /* IE 9 */
        -o-transform: scale(1.2);
        transform: scale(1.2);
        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.2, M12=0, M21=0, M22=1.2, SizingMethod='auto expand'); /* IE6 and 7 */ 
    } 

     .box2_new3 span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/sd_bn3.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;      
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    }
	.box2_new3:hover span, .box_new2:hover span, .box_new3:hover span{
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -ms-transform: scale(1.2); /* IE 9 */
        -o-transform: scale(1.2);
        transform: scale(1.2);
        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.2, M12=0, M21=0, M22=1.2, SizingMethod='auto expand'); /* IE6 and 7 */ 
    } 
	 .box2_new4 span {
        width:100%;
        height:100%;
        display: inline-block;
        background-color: white;
        background-image: url(/images/sd_bn4.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        -webkit-transition: transform .3s ease-out; 
        -moz-transition: transform .3s ease-out; 
        -ms-transition: transform .3s ease-out;
        -o-transition: transform .3s ease-out; 
        transition: transform .3s ease-out;        
		border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
    }
	.box2_new4:hover span, .box_new2:hover span, .box_new3:hover span{
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -ms-transform: scale(1.2); /* IE 9 */
        -o-transform: scale(1.2);
        transform: scale(1.2);
        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.2, M12=0, M21=0, M22=1.2, SizingMethod='auto expand'); /* IE6 and 7 */ 
    } 


/*비주얼 영역 추가됨*/
.main_bg{width:100%; height:670px; min-height:100%; background:url(/images/slider/bg-1.jpg) center no-repeat; background-size: cover; overflow:hidden; margin-top:-24px;}
.main_img01{z-index:123; position:absolute; margin-top:15px; left:50%; margin-left:-384px;}
.main_img02{z-index:124; position:absolute; margin-top:550px;}
.main_txt{margin-top:130px; position:absolute; font-size:2.916em; color:#424242; font-weight:bold; z-index:125; margin-left:20px;}
.main_txt span{color:#00509c; font-size:1.400em;}

.fade-in
{
    -webkit-animation: fade-in 1.2s;
            animation: fade-in 1.2s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@-webkit-keyframes fade-in
{
    0%
    {
        opacity: 0;
    }
    100%
    {
        opacity: 1;
    }
}
@keyframes fade-in
{
    0%
    {
        opacity: 0;
    }
    100%
    {
        opacity: 1;
    }
}
.fade-in-right
{
    -webkit-animation: fade-in-right 1s;
            animation: fade-in-right 1s;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
}
@-webkit-keyframes fade-in-right
{
    0%
    {
        -webkit-transform: translateX(-100%);

        opacity: 0;
    }
    100%
    {
        -webkit-transform: translateX(0%);

        opacity: 1;
    }
}
@keyframes fade-in-right
{
    0%
    {
        transform: translateX(-100%);

        opacity: 0;
    }
    100%
    {
        transform: translateX(0%);

        opacity: 1;
    }
}

.fade-in-up
{
    -webkit-animation: fade-in-up 1s;
            animation: fade-in-up 1s;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
}
@-webkit-keyframes fade-in-up
{
    0%
    {
        -webkit-transform: translateY(100%);

        opacity: 0;
    }
    100%
    {
        -webkit-transform: translateY(0%);

        opacity: 1;
    }
}
@keyframes fade-in-up
{
    0%
    {
        transform: translateY(10%);

        opacity: 0;
    }
    100%
    {
        transform: translateY(0%);

        opacity: 1;
    }
}

.theocean_banner{ position:absolute; font-size:0.875em; right:0px; padding:10px 20px; box-sizing:border-box; background-color:#000; color:#fff; text-align:center; cursor:pointer; z-index:777;background-color: rgba( 0, 0, 0, 0.7 );}
.p_line{border-bottom:1px solid #fff;}