html, body{height:100%; position:absolute;}
body:after{display:block; clear: both; content:'';}
.wrap{position: relative; width:100%; height: 100%; min-height: 900px; max-width:100%;}
.wrap:after{display: block; content:''; clear: both;}

.m_header{display:none;}
/* PC hader */
.header{position:fixed; left:0; top:0; width: 210px; height: 100%; background:#004498; padding: 30px 0 0 25px; box-sizing: border-box;}

/* ��硫붾돱 */
.gnb{margin: 20px 0 0 0;}
.gnb>ul>li{width:100%; line-height: 48px;}
.gnb>ul>li>a{display:block; font-size: 17px; color:#8ec1ff;}
.gnb>ul>li>a:hover{color:#fff; font-weight: bold;}
.gnb>ul>li>a.on{color:#fff; font-weight: bold;}

/* �뚮찓�� */
.depth02{display: none;}
.depth02 li{width: 100%;}
.depth02 li a{display: block; font-size: 13px; color:#fff; line-height: 18px;}
.depth02 li a:hover{font-size: 14px;}

.footer{position:absolute; bottom:25px; left:25px;}
.footer h2{font-size: 14xp; color:#fff; font-weight: bold; margin: 0 0 10px 0;}
.footer p{font-size: 11px; color:#a2d5ea; letter-spacing: -0.05em; line-height: 1.4em;}
.footer p.copy{font-size: 10px; margin: 20px 0 0 0;}

.container{position: relative; margin: 0 0 0 210px; float:left; width: calc(100% - 210px);  height: 100%;}

/* 硫붿씤 鍮꾩＜�� */
.visual{float:left;position: relative; width:75%; height: 100%;}
.visual ul{width:100%; height:100%;}
.visual ul li{position:relative; width:100%; height:100%; display: table; background-size: cover !important;}
.visual ul li>a{display: block; height: 100%;} 
.bxslider li.vi01{background: url('/img/visual01.png')no-repeat 0 0;}
.bxslider li.vi02{background: url('/img/visual02.png')no-repeat 0 0;}
.bxslider li.vi03{background: url('/img/visual03.png')no-repeat 0 0;}
.bxslider li.vi04{background: url('/img/visual04.png')no-repeat 0 0;}
.bxslider li.vi05{background: url('/img/visual05.png')no-repeat 0 0;}
.bxslider li.vi06{background: url('/img/visual06.png')no-repeat 0 0;}
.bxslider li.vi07{background: url('/img/visual07.png')no-repeat 0 0;}

/* 鍮꾩＜�� �띿뒪�� */
.visual ul li .bg_txt{position:absolute; top:50%; left:70px; transform : translate(0,-50%);}
.visual ul li .bg_txt p{ color:#fff; font-size: 23px; font-weight: bold; letter-spacing: -0.05em;}
.visual ul li .bg_txt p span{display: block; font-size: 45px; font-weight: 800; letter-spacing: -0.05em; margin: 20px 0; line-height: 1.2em;}
.visual ul li .bg_txt p span.bs_txt{font-size: 18px; font-weight: 500;}
.visual ul li .bg_txt p.s_txt{font-size: 23px; letter-spacing: -0.05em; margin: 65px 0 0 0;}

/* 鍮꾩＜�� 踰꾪듉 */
.visual .visual_btn{position: absolute; z-index:999; top: 50%; left:0; right:0; width:97%; margin:0 auto; transform : translate(0,-50%);}
.visual .visual_btn:after{display: block; content:''; clear: both;}
.visual .visual_btn button.next{float: right;}
.bx-wrapper, .bx-viewport{height:100% !important;}

/* 鍮꾩＜�� �섏씠�� */
.visual .visual_pager{position: absolute; bottom:90px; left:0; right: 0; text-align: center; margin: 0 auto; z-index: 999;}
.visual .visual_pager ul li{display: inline-block; width: 20px; height: 20px; margin: 0 5px;}
.visual .visual_pager ul li a{display: block; height:100%; border-radius: 5px; background:#fff; }
.visual .visual_pager ul li a.active{background:#004498;}

/* �ㅻⅨ履� 而⑦뀗痢� */

.contents{float:left; width: calc(100% - 75%); height:100%; overflow: hidden;}
.contents:after{display: block; clear:both; content:'';}

.con01{float: left; width:100%; height:100%;}
.con01:after{display: block; clear: both; content: '';}
.con01 .article{position: relative; float:left; width:50%; height:23.4%;box-sizing: border-box; }
.con01 .article.info{position: relative; width:100%;height:10%; background: url('/img/info_bg.png')no-repeat 95% center; background-size: 18%; padding: 13px 0 0 20px; box-sizing: border-box;}
.con01 .article.info h3{font-size:17px; font-weight: bold; color:#666; letter-spacing: -0.05em;}
.con01 .article.info p{font-size: 13px; color:#898989; letter-spacing: -0.05em; margin: 0px 0 0 0; line-height: 1.4em;}
.con01 .article .sol_inner p{position: absolute; top:50%; left:50%; transform: translate(-50% , -50%); display:block; width:100%; text-align:center; font-size:14px; letter-spacing: -0.06em;}
.con01 .article .sol_inner p a{display: block; color:#fff;}

.con01 .sol01{ background: url('/img/articl01.png')no-repeat 0 0; background-size: cover; }
.con01 .sol01 h3{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align: center;}
.con01 .sol01 .sol_inner{display:none;}
.con01 .sol01:hover .sol_inner{display:block; width:100%; height:100%; border:5px solid #199bed; box-sizing: border-box;}
.con01 .sol01:hover h3{display:none;}


.con01 .sol02{background: url('/img/articl02.png')no-repeat 0 0; background-size: cover; }
.con01 .sol02 h3{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align: center;}
.con01 .sol02 .sol_inner{display:none;}
.con01 .sol02:hover .sol_inner{display:block; width:100%; height:100%; border:5px solid #d5266a; box-sizing: border-box;}
.con01 .sol02:hover h3{display:none;}

.con01 .sol03{background: url('/img/articl03.png')no-repeat 0 0; background-size: cover;}
.con01 .sol03 h3{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align: center;}
.con01 .sol03 .sol_inner{display:none;}
.con01 .sol03:hover .sol_inner{display:block;width:100%; height:100%; border:5px solid #e79618; box-sizing: border-box;}
.con01 .sol03:hover h3{display:none;}

.con01 .sol04{background: url('/img/articl04.png')no-repeat 0 0; background-size: cover;}
.con01 .sol04 h3{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align: center;}
.con01 .sol04 .sol_inner{display:none;}
.con01 .sol04:hover .sol_inner{display:block;width:100%; height:100%; border:5px solid #81d441; box-sizing: border-box;}
.con01 .sol04:hover h3{display:none;}

.con01 .sol05{background: url('/img/articl05.png')no-repeat 0 0; background-size: cover; height: 23.4%;}
.con01 .sol05 h3{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align: center;}
.con01 .sol05 .sol_inner{display:none;}
.con01 .sol05:hover .sol_inner{display:block;width:100%; height:100%; border:5px solid #6e98b4; box-sizing: border-box;}
.con01 .sol05:hover h3{display:none;}

.con01 .sol06{background: url('/img/articl06.png')no-repeat 0 0; background-size: cover; height: 23.4%;}
.con01 .sol06 h3{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align: center;}
.con01 .sol06 .sol_inner{display:none;}
.con01 .sol06:hover .sol_inner{display:block;width:100%; height:100%; border:5px solid #ac39d5; box-sizing: border-box;}
.con01 .sol06:hover h3{display:none;}

.con01 .article .sol_inner{position: absolute; left:0; top: 0;}
.con01 .article h3{font-size: 23px; font-weight: bold; letter-spacing: -0.05em; color:#fff; line-height: 1.4em;}
.con01 .article p{font-size: 12px;  letter-spacing: -0.05em; color:#fff; line-height: 1.4em;}

/*.con02{float: left; width: 50%; height:100%;}*/
/*.con02 .article{width:100%; padding: 10% 3% 5% 3%; box-sizing: border-box;}*/
/*.con02 .article h3{font-size: 23px; font-weight: bold; color:#666; letter-spacing: -0.05em;}*/
/*.con02 .article p{font-size: 14px; color:#898989; letter-spacing: -0.05em; margin: 20px 0 0 0; line-height: 1.4em;}*/

/* 怨좉컼�쇳꽣 */
.con01 .catal{height: 20%; padding: 0; width:100%;}
.con01 .catal .catal_inner{ height: 50%; background: url('/img/catal.png')no-repeat 90% center; padding: 20px 0 10px 20px; box-sizing: border-box;}
.con01 .catal .catal_inner a{display: block; height:100%; }
.con01 .catal .catal_inner a h3{font-size:17px; font-weight: bold; color:#666666; letter-spacing: -0.05em;}
.con01 .catal .catal_inner a p{ font-size: 14px; color:#666;}

.con01 .catal .call_inner{ height: 50%; padding: 20px 0 20px 20px;  background:#399bd8 url('/img/contact.png')no-repeat 90% center; box-sizing: border-box; overflow: hidden;}
.con01 .catal .call_inner h3{float: left; font-size: 17px; font-weight: bold; color:#fff; letter-spacing: -0.05em; padding: 0px 0 0 0;}
.con01 .catal .call_inner p{float: left; margin:0 0 0 15px; font-size: 24px; font-weight: 800; color:#fff; letter-spacing: -0.05em; }
.con01 .catal .call_inner p span{display:block; font-size: 11px; line-height: 1em;font-weight: 400;}

.m_footer{display:none;}
.m_gnb{display: none;}
.container:after{display:block; clear: both; content: '';}

/* 1370px 誘몃뵒�� 荑쇰━ */
@media screen and (max-width : 1370px){
.header{position:absolute; top:0; left:0; width:100%; height: 100px; padding: 15px 0 0 25px;}
.header .gnb{display:none; }
.header .footer{display: none;}
.m_gnb_btn{ display: inline-block; position: absolute; right: 40px; top:50%; transform: translate(0, -50%); cursor: pointer;}
.bar1, .bar2, .bar3{width:35px; height: 5px; background: #fff; margin: 6px 0; transition: .4s;}
.change .bar1{-webkit-transform: rotate(-45deg) translate(-9px, 6px); transform: rotate(-45deg) translate(-9px, 6px);}
.change .bar2 {opacity: 0;}
.change .bar3 {-webkit-transform: rotate(45deg) translate(-8px, -8px); transform: rotate(45deg) translate(-8px, -8px);}

.container{width:100%; margin: 98px 0 0 0; height: auto;}
.m_gnb{display: none; position: absolute; width: 100%; height: 100%; padding:0 10%; box-sizing: border-box; background: #004498; z-index:9999;}

.visual{width: 100%; height: 900px;}
.contents{width:100%; height: auto;}
.con01{height: 100%; height: auto; border-bottom: none;}
.con01 .article{position: relative; float:left; width:50%; height:33.3vh; padding: 4% 0 5% 5%; box-sizing: border-box; }

.con01 .article.info{padding:3% 0 3% 5%; background-size: contain;}

.con01 .catal{height: 15%; width:100%; float: none; clear: both;padding: 0;}
.con02 .article p{font-size: 14px; color:#898989; letter-spacing: -0.05em; margin: 20px 0 0 0; line-height: 1.4em;}


.con01 .catal .catal_inner{ height: 50%; background: url('/img/catal.png')no-repeat 95% center; padding: 6% 0 6% 5%; box-sizing: border-box; }
.con01 .catal .call_inner{ height: 50%; padding: 6% 0 6% 5%;  background:#399bd8 url('/img/contact.png')no-repeat 95% center; box-sizing: border-box;}
.con01 .news .notice{position: relative; margin: 0 0 0 0;}

.m_footer{display:block; width: 100%; height: 145px; float: left; background:#004498; text-align: center; box-sizing: border-box;}
.m_footer_inner{display: inline-block; margin-top: 20px;}
.m_footer_inner h3{font-size:14px; font-weight: bold; color: #fff;}
.m_footer_inner p{font-size: 11px; letter-spacing: 0.05em; line-height: 1.2em; color:#a2d5ea; margin: 20px 0;}
.m_footer_inner p.copy{font-size: 10px; margin: 0;}
}

/* 768px 誘몃뵒�� 荑쇰━ */
@media screen and (max-width : 768px){
.depth02 li a{display: block; font-size: 20px; color:#fff; line-height: 25px;}
.depth02 li a:hover{font-size: 21px;}

.visual ul li .bg_txt{position:absolute; top:50%; left:50%; width:90%; transform : translate(-50%,-50%); text-align: center;}
.bxslider li.vi01{background: url('/img/m_visual01.png')no-repeat 0 -5px;}
.bxslider li.vi02{background: url('/img/m_visual02.png')no-repeat 0 0;}
.bxslider li.vi03{background: url('/img/m_visual03.png')no-repeat 0 0;}
.bxslider li.vi04{background: url('/img/m_visual04.png')no-repeat 0 0;}
.bxslider li.vi05{background: url('/img/m_visual05.png')no-repeat 0 0;}
.bxslider li.vi06{background: url('/img/m_visual06.png')no-repeat 0 0;}
.bxslider li.vi07{background: url('/img/m_visual07.png')no-repeat 0 0;}

.visual ul li .bg_txt p.s_txt{font-size: 16px; letter-spacing: -0.05em; margin: 65px 0 0 0;}
.visual ul li .bg_txt p{ display:block; color:#fff; font-size: 16px; font-weight: bold; letter-spacing: -0.05em;}
.visual ul li .bg_txt p span{display: block; font-size: 38px; font-weight: 800; letter-spacing: -0.05em; margin: 20px 0;}
.visual ul li .bg_txt p span.bs_txt{font-size: 12px; font-weight: 500;}

}