@charset "utf-8";

/* Visual */
.main_visual .bx-wrapper { margin:0 auto; padding: 0px; position: relative; width:100%; overflow:hidden ; position:relative; }
.main_visual .bx-wrapper img { }

.main_visual .bx-wrapper .bx-viewport { border: 0px solid #000;    } /*영역*/
.main_visual .bx-wrapper .bx-pager {text-align: center;  bottom: 20px; position: absolute;  z-index:1000; width:100%;} /*라운드영역*/
.main_visual .bx-wrapper .bx-controls-auto { width: 100%; bottom: -30px; position: absolute;} /*재생정지영역*/
.main_visual .bx-wrapper .bx-loading { background: url("../images/bx_loader.gif") no-repeat center rgb(255, 255, 255); left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 100; min-height: 50px; }/*로딩*/
.main_visual .bx-wrapper .bx-pager { text-align: center; color:#F00; font-family: Arial; font-size: 0.85em; font-weight: bold;  }
.main_visual .bx-wrapper .bx-pager .bx-pager-item { display: inline-block; }
.main_visual .bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; }
.main_visual .bx-wrapper .bx-default-pager.bx-pager a { margin: 0px 3px; outline: 0px; width: 80px; height: 3px; text-indent: -9999px; display: block; background:rgba(51, 51, 51, .15);} /*라운드,글자*/
.main_visual .bx-wrapper .bx-default-pager.bx-pager a:hover {background:rgba(51, 51, 51, .5);}
.main_visual .bx-wrapper .bx-default-pager.bx-pager a.active { background:#333 !important;}
.main_visual .bx-controls-direction a {position:absolute; display:block; width:100px; height:100px; top:50%; margin:-50px 0 0 0; color:rgba(255, 255, 255, 0);}
.main_visual .bx-wrapper .bx-prev { background: url("../img/main/controls.png") no-repeat 0px -100px; left: 0; display:none; } /*화살표*/
.main_visual .bx-wrapper .bx-next { background: url("../img/main/controls.png") no-repeat -100px -100px; right: 0; display:none; } /*화살표*/

.main_visual ul.main_img {  display: block; height:; text-align:left; }
.main_visual ul.main_img li { position: relative !important; width: 100%; height: ; overflow:hidden;  }
.main_visual ul.main_img li .typo {position:relative; z-index:15; width:1200px; margin:0 auto; }
.main_visual ul.main_img li .typo.right {text-align:right; }
.main_visual ul.main_img li .typo .typo_inner {position:absolute; width:100%;}
.main_visual ul.main_img li .typo p.typo_lar {font-size:65px; color:#222; font-weight:100; line-height:1.2em; margin:112px 0 0 0;}
.main_visual ul.main_img li .typo p.typo_lar span {font-weight:500;}
.main_visual ul.main_img li .typo p.typo_sma {color:#0052a6; font-size:17px; font-weight:400; margin:40px 0 0 0;}
.main_visual ul.main_img li .typo p.typo_sma span {border-top:1px solid rgba(0, 82, 166, .5); display:inline-block; line-height:2.3em;}
.main_visual ul.main_img li p.img {width:1200px; margin:0 auto; z-index:14;}
.main_visual ul.main_img li p a {display:block; width:100%; height:100%; margin:0; padding:0; cursor:default;}

.main_visual ul.main_img li.v_01 { background: #eee url("../img/main/main_visual01_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_02 { background: #eee url("../img/main/main_visual02_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_03 { background: #eee url("../img/main/main_visual03_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_04 { background: #eee url("../img/main/main_visual04_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_05 { background: #eee url("../img/main/main_visual05_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_06 { background: #eee url("../img/main/main_visual06_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_07 { background: #eee url("../img/main/main_visual07_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_08 { background: #eee url("../img/main/main_visual08_bg.jpg") no-repeat center center;}
.main_visual ul.main_img li.v_09 { background: #eee url("../img/main/main_visual09_bg.jpg") no-repeat center center;}

.main_visual ul.main_img li.v_03 .typo p.typo_lar {color:#fff;}
.main_visual ul.main_img li.v_08 .typo p.typo_lar {color:#fff;}

.main_visual ul.main_img li p.img {width:100%;}
@media screen and (max-width:1260px) {
    .main_visual ul.main_img li .typo {width:100%; }
    .main_visual ul.main_img li .typo p {margin:0 2% !important;}

    .main_visual ul.main_img li .typo p.typo_lar {font-size:50px; margin-top:80px !important;}
    .main_visual ul.main_img li .typo p.typo_sma {font-size:16px; margin-top:30px !important;}
}
@media screen and (max-width:900px) {
    .main_visual ul.main_img li .typo p.typo_lar {font-size:40px; }
    .main_visual ul.main_img li .typo p.typo_sma {font-size:15px; margin-top:20px !important;}
}
@media screen and (max-width:640px) {
    .main_visual .bx-wrapper .bx-pager {bottom:12px;}
    .main_visual .bx-wrapper .bx-default-pager.bx-pager a { margin: 0px 3px; width: 8px; height: 8px;}

    .main_visual ul.main_img li .typo p {margin:0 4% !important;}
    .main_visual ul.main_img li .typo p.typo_lar {font-size:26px; margin-top:32px !important;}
    .main_visual ul.main_img li .typo p.typo_sma {font-size:13px; margin-top:10px !important;}
    .main_visual ul.main_img li .typo p.typo_sma span {line-height:2em;}
}
@media screen and (max-width:340px) {
    .main_visual ul.main_img li .typo p.typo_lar {font-size:20px;}
}







/*Main Contents */
.main_container {position:relative; width:100%; margin:0; padding:0 0 0 0;}

#footer {border-top:0px solid #e9e9e9;}
#footer .foot_top {display:none;}


.main_title {text-align:center; padding:0 0 32px 0;}
.main_title p {color:#333; font-size:30px; font-weight:500; }
.main_title p.sub {font-size:14px; color:#999; font-weight:200; padding:6px 0 0 0;}

@media screen and (max-width:1200px){
    .main_title p {font-size:24px;}
}
@media screen and (max-width:640px){
    .main_title p {font-size:20px;}
}






/* 소개 */
.introduce {padding:72px 0; background:url("../img/main/major_product.jpg") bottom right no-repeat; background-size:50%;}
.introduce .intro_lar {font-size:30px; color:#333; line-height:1.2em; font-weight:500; margin:0 0 20px 0;}
.introduce .intro_sma {padding:10px 0 0 0; font-weight:200;}

.introduce .delay {transition: 1.4s; opacity: 0; transform: translate(0px, 50px); fiter: 1.4s ease; }
.introduce .delay.active { opacity: 1; transform: translate(0px, 0px); }

@media screen and (max-width:1600px) {
    .introduce {background-position:top right;}
}
@media screen and (max-width:1200px) {
    .introduce {padding:50px 0; background-size:60%; }
    .introduce .intro_lar {font-size:24px;}
}
@media screen and (max-width:900px) {
    .introduce:after {background:#fff; opacity:0.7; filter:alpha(opacity=70); content:""; width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;}
    .introduce {position:relative; z-index:0;}
    .introduce p br {display:none;}
}
@media screen and (max-width:640px) {
    .introduce {background-size:100%; }
    .introduce .intro_lar {font-size:20px;}
    .introduce .intro_sma {font-size:14px;}

    .introduce .delay {transition: 1.4s; opacity: 1; transform: translate(0px, 0px); fiter: 1.4s ease; }
}




/* 제품 */
.product {padding:72px 0; background:#f5f5f5;}

/* 选项卡样式 */
.product .product_tabs {text-align:center; margin-bottom:40px;}
.product .product_tabs ul {display:inline-block; margin:0 auto;}
.product .product_tabs li {float:left; margin:0 10px;}
.product .product_tabs li a {display:block; padding:12px 12px; font-size:14px; color:#666; border:1px solid #ddd; background:#fff; text-decoration:none; transition:all 0.3s ease;}
.product .product_tabs li a:hover {border-color:#0052a6; color:#0052a6;}
.product .product_tabs li.active a {background:#0052a6; color:#fff; border-color:#0052a6;}

/* 选项卡内容切换 */
.product .product_tab_content {display:none;}
.product .product_tab_content.active {display:block;}

/* 如果.bx-viewport 不包含 .product_tab_content.acvite,则height:0 */
.product.pc .bx-wrapper:not(:has(.product_tab_content.active)) {
    display: none !important;
}




.product .dim_area {position:relative; z-index:13;}
.product .dim_area p {position:absolute; width:33%;}
.product .dim_area p.dim_prv {left:0;}
.product .dim_area p.dim_nxt {right:0;}

.product .product_list {position:relative; z-index:12;}
.product .product_list dl dt {position: relative; overflow: hidden; margin:0 0 30px 0;}
.product .product_list dl dt img {margin: 0 auto; width: 100%; height: 100%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; transition: all .2s ease-in-out; /*max-height: 328px;*/}
.product .product_list dl dt img:hover { -webkit-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); }
.product .product_list dl dd {position:relative;}
.product .product_list dl dd.p_category:after {clear:both; display:block; content:"";}
.product .product_list dl dd.p_category p {font-size:14px; color:#0052a6; letter-spacing:0px; font-weight:400; float:right; width:93%; }
.product .product_list dl dd.p_category p.line {width:5%; float:left; height:1px; background:#0052a6; margin:12px 0 0 0;}
.product .product_list dl dd.p_image {width:93%; float:right; margin:12px 0 24px 0;}
.product .product_list dl dd.p_image:after {clear:both; display:block; content:"";}
.product .product_list dl dd.p_info {width:93%; float:right;}
.product .product_list dl dd.p_info .info_tit {font-size:24px; color:#333; font-weight:200; margin:0 0 16px 0;}
.product .product_list dl dd.p_info .info_tit span {font-weight:400;}
.product .product_list dl dd.p_info .info_sub {font-weight:200; color:#777; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; white-space: normal; line-height: 1.4em; height: 2.8em; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size:1em;;}

.product .bx-wrapper .bx-controls .bx-pager {display:none;}
.product .bx-wrapper .bx-controls .bx-controls-direction {position:relative; z-index:14;}
.product .bx-wrapper .bx-controls .bx-controls-direction a {position:absolute; display:block; width:56px; height:109px; color:rgba(255, 255, 255, 0); opacity:.4;}
.product .bx-wrapper .bx-controls .bx-controls-direction a:hover {opacity:1;}
.product .bx-wrapper .bx-controls .bx-controls-direction a.bx-prev {background:url("../img/main/slider_prv.png") center center no-repeat; left:27%; margin:-348px 0 0 0;}
.product .bx-wrapper .bx-controls .bx-controls-direction a.bx-next {background:url("../img/main/slider_nxt.png") center center no-repeat; right:27%; margin:-348px 0 0 0;}

.product .product_list .slide {display:inline-block !important; }

.product .delay {transition: 1.4s; opacity: 0; transform: translate(0px, 50px); fiter: 1.4s ease; }
.product .delay.active { opacity: 1; transform: translate(0px, 0px); }

.product.mobile {display:none; background:none; border-top:1px solid #e9e9e9;}
.product.mobile ul li {position:relative;}
.product.mobile ul li .pmobile_bg {position:relative; z-index:10;}
.product.mobile ul li .pmobile_dim {position:absolute; width:100%; height:100%; background:rgba(0, 0, 0, 0.35); z-index:11;}
.product.mobile ul li dl {position:absolute; z-index:15; color:#fff; text-align:center; width:100%; top:50%; transform: translate(0,-50%);}
.product.mobile ul li dl a {display:block;}
.product.mobile ul li dl dt {font-size:20px; margin:0 0 12px 0; font-weight:500;}
.product.mobile ul li dl dd {font-weight:300; font-size:14px; color:#d3d3d3;}


@media screen and (max-width:1910px) {
    .product .dim_area {display:none;}
    .product .bx-wrapper .bx-controls .bx-controls-direction {display:none;}
    .product .bx-wrapper .bx-controls .bx-pager {display:block; text-align:center; margin:0 auto; width:100%; margin-top:30px;}
    .product .bx-wrapper .bx-controls .bx-pager .bx-pager-item {display:inline-block;}
    .product .bx-wrapper .bx-default-pager.bx-pager a { margin: 0px 3px; outline: 0px; width: 80px; height: 7px; text-indent: -9999px; display: block; background:rgba(51, 51, 51, .15);} /*라운드,글자*/
    .product .bx-wrapper .bx-default-pager.bx-pager a:hover {background:rgba(51, 51, 51, .5);}
    .product .bx-wrapper .bx-default-pager.bx-pager a.active { background:#333 !important;}
}
@media screen and (max-width:1200px) {
    .product {padding:50px 0; }
    .product .bx-wrapper .bx-controls .bx-pager {display:none;}
}
@media screen and (max-width:720px) {
    .product .product_list dl dd.p_info p {margin:0 4% 0 0;}
    .product .product_list dl dd.p_info .info_tit {font-size:20px; margin:0 0 10px 0;}
    .product .product_list dl dd.p_info .info_sub br {display:none;}
}
@media screen and (max-width:640px) {
    .product .product_list dl dd.p_info .info_tit {font-size:18px;}
    .product .product_list dl dd.p_info .info_sub {font-size:14px; }

    .product .delay {transition: 1.4s; opacity: 1; transform: translate(0px, 0px); fiter: 1.4s ease; }

    .product.mobile {display:block;}
    .product.pc {display:none;}
}



/* 비즈니스 바로가기 */
.grid {background:url("../img/main/grid_bg.jpg") center center no-repeat; background-attachment:fixed;}
.grid.g2{background-image: url('../img/main/grid_bg2.jpg');}
.grid ul:after {clear:both; display:block; content:"";}
.grid ul li {width:50%; float:left;}
.grid ul li dl a {display:block; padding:84px 0;}
.grid ul li dl dt {color:#fff; font-size:30px; font-weight:400; margin:0 0 24px 0;}
.grid ul li dl dd {color:#d3d3d3; line-height:1.3em; font-weight:200;}

.grid .grid01.delay {transition: 1.4s; opacity: 0; transform: translate(-50px, 0px); fiter: 1.4s ease; }
.grid .grid01.delay.active { opacity: 1; transform: translate(0px, 0px); }

.grid .grid02.delay {transition: 1.4s; opacity: 0; transform: translate(50px, 0px); fiter: 1.4s ease; }
.grid .grid02.delay.active { opacity: 1; transform: translate(0px, 0px); }

@media screen and (max-width:1200px) {
    .grid ul li dl a {padding:50px 0;}
    .grid ul li dl dt {font-size:24px; }
}
@media screen and (max-width:640px) {
    .grid {background-image:none;}
    .grid .wrap {margin:0 0 0 0 !important;}
    .grid ul li {width:100%;}
    .grid ul li.grid01 {background:url("../img/main/grid01_bg.jpg") center center no-repeat; background-size:100%;}
    .grid ul li.grid02 {background:url("../img/main/grid02_bg.jpg") center center no-repeat; background-size:100%;}
    .grid.g2 ul li.grid02{background-image: url('../img/main/grid02_bg2.jpg');}
    .grid ul li dl {padding:0 4%;}
    .grid ul li dl dt {font-size:20px; margin:0 0 12px 0;}
    .grid ul li dl dd {font-size:14px;}
    .grid ul li dl dd br {display:none;}

    .grid .grid01.delay {transition: 1.4s; opacity: 1; transform: translate(0px, 0px); fiter: 1.4s ease; }
    .grid .grid02.delay {transition: 1.4s; opacity: 1; transform: translate(0px, 0px); fiter: 1.4s ease; }
}



/* 비즈니스 네트워크 추가 */
.main_container .business_network{
    padding: 80px 0 60px; text-align: center;
}
.main_container .business_network .tit{
    text-align: center;
}
.main_container .business_network .tit strong{
    display: block;
    font-size: 30px; font-weight: 600; color: #222;
    margin-bottom: 25px;
}
.main_container .business_network .tit span{
    display: block;
    font-size: 15px;  color: #555; font-weight: 200;
}
.main_container .business_network .map_area{
    display: inline-block;
    text-align: center; position: relative;     margin-top: 50px;
}
.main_container .business_network .map_area .pin{
    position: absolute;
    top: 0;     left: 0;
}
.main_container .business_network .button{
    text-align: center; margin-top: -20px;
}
.main_container .business_network .button a{
    display: inline-block; border: 1px solid #333; color: #222;
    line-height: 1; padding: 14px 26px;
    font-size: 12px; letter-spacing: 1px; font-weight: 600;
}
.main_container .business_network .button a:hover{
    background: #333; color: #fff;
}

@media screen and (max-width:840px){
    .main_container .business_network{
        padding: 80px 0 10px;
    }
}
@media screen and (max-width:640px){
    .main_container .business_network {
        padding: 40px 0 10px;
    }
    .main_container .business_network .tit strong{
        font-size: 20px;     margin-bottom: 15px;
    }
    .main_container .business_network .tit span{
        font-size: 14px;
    }
    .main_container .business_network .tit span br{
        display: none;
    }
    .main_container .business_network .map_area{
        margin-top: 30px;
    }
    .main_container .business_network .button{
        margin-top: 0;
    }
    .main_container .business_network .button a{
        padding: 10px 26px;
    }
}




/* 미디어 게시판 */
.thumb_list ul {margin:0 0 0 -40px;}
.thumb_list ul:after {clear:both; display:block; content:"";}
.thumb_list ul li {float:left; width:25%;}
.thumb_list ul li dl {margin:0 0 0 40px; border-bottom:1px solid #e9e9e9; padding:0 0 20px 0;}
.thumb_list ul li dl a {display:block;}
.thumb_list ul li dl dt {margin:0 0 20px 0;}
.thumb_list ul li dl dt { position: relative; overflow: hidden; }
.thumb_list ul li dl dt img { margin: 0 auto; width: 100%; height: 100%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; transition: all .2s ease-in-out; max-height: 190px;}
.thumb_list ul li dl dt img:hover { -webkit-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); }
.thumb_list ul li dl dd p {overflow: hidden; text-align: left; margin: 0 0 8px 0; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; line-height: 1.2em; height: 24px;}
.thumb_list ul li dl dd .board_tit {width: 100%; font-size:1.2em;}
.thumb_list ul li dl dd .board_sub {white-space: normal; line-height: 1.4em; height: 2.8em; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; color: #999;  font-size:1em; font-weight:200;}

p.more {text-align:center;}
p.more a {display:inline-block; margin:0 auto; font-size:12px; font-weight:400; letter-spacing:1px; color:#999; border:1px solid #e9e9e9; padding:0 42px; line-height:40px; vertical-align:middle;}
p.more a:hover {color:#555; border:1px solid #555;}

.thumb_list .delay {transition: 1.4s; opacity: 0; transform: translate(0px, 50px); fiter: 1.4s ease; }
.thumb_list .delay.active { opacity: 1; transform: translate(0px, 0px); }

@media screen and (max-width:1200px) {
    .thumb_list ul {margin:0 0 0 -20px;}
    .thumb_list ul li dl {margin:0 0 0 20px;}
}
@media screen and (max-width:640px) {
    .thumb_list ul li {width:50%;}
    .thumb_list ul li dl {padding:0 0 12px 0; margin:0 0 20px 20px;}
    .thumb_list ul li dl dt {margin:0 0 12px 0;}
    .thumb_list ul li dl dd .board_tit {font-size:1.1em;}
    .thumb_list ul li dl dd .board_sub {font-size:0.9em;}

    p.more a {padding:0 32px; line-height:34px;}

    .thumb_list .delay {transition: 1.4s; opacity: 1; transform: translate(0px, 0px); fiter: 1.4s ease; }
}



/* 기타 커뮤니티 */
.boxes ul {margin:0 0 0 -40px;}
.boxes ul:after {clear:both; display:block; content:"";}
.boxes ul li {width:33.333%; float:left;}
.boxes ul li dl {margin:0 0 0 40px; text-align:center;}
.boxes ul li dl a {display:block; padding:60px 32px;}
.boxes ul li.box01 dl {background:url("../img/main/texture_bg.jpg") center center no-repeat;}
.boxes ul li.box02 dl {background:url("../img/main/pattern_bg.jpg") center center repeat;}
.boxes ul li.box03 dl {background: #fff url("../img/main/ssvert_product01.jpg") center 85% no-repeat; }
.boxes ul li.box03 dl a {border:4px solid #0052a6; padding:48px 0; height:177px;}
.boxes ul li dl dt p {font-size:30px; color:#333; font-weight:500;}
.boxes ul li dl dt p.line {width:30px; height:2px; margin:0 auto; background:#0052a6; margin-top:20px; margin-bottom:20px;}
.boxes ul li dl dd {font-size:14px; color:#777; line-height:1.3em; font-weight:200;}
.boxes ul li dl dd.button {margin:20px 0 0 0;}
.boxes ul li dl dd.button span {display:inline-block; margin:0 auto; font-size:12px; font-weight:400; letter-spacing:1px; color:#0052a6; border:1px solid #0052a6; padding:0 32px; line-height:40px; vertical-align:middle;}
.boxes ul li dl a:hover dd.button span {background:#0052a6; color:#fff;}

.boxes .delay {transition: 1.4s; opacity: 0; transform: translate(0px, 50px); fiter: 1.4s ease; }
.boxes .delay.active { opacity: 1; transform: translate(0px, 0px); }

@media screen and (max-width:1200px) {
    .boxes ul {margin:0 0 0 -20px;}
    .boxes ul li dl {margin:0 0 0 20px;}
    .boxes ul li dl a {padding:40px 12px;}
    .boxes ul li.box03 dl a {border:3px solid #0052a6; padding:30px 0; height:175px;}
    .boxes ul li.box03 dl {background-size:100%; }
    .boxes ul li.box03 dl dt img {width:160px;}
    .boxes ul li dl dt p {font-size:24px;}
}
@media screen and (max-width:840px) {
    .boxes ul li {width:100%; margin:0 0 20px 0;}
    .boxes ul li.box03 dl {background-size:60%; }
}
@media screen and (max-width:640px) {
    .boxes ul li dl a {padding:30px 12px;}
    .boxes ul li dl dt p {font-size:20px;}
    .boxes ul li dl dt p.line {height:1px; margin-top:10px; margin-bottom:10px;}
    .boxes ul li.box03 dl a {height:128px;}
    .boxes ul li dl dd.button span {padding:0 32px; line-height:34px;}

    .boxes .delay {transition: 1.4s; opacity: 1; transform: translate(0px, 0px); fiter: 1.4s ease; }
}