@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Raleway:wght@100;200;300;400;500;600;700;800;900&display=swap');

/**/
.wrap {max-width:1400px; width:100%; margin:auto;}
.pc{display: block;}
.mob{display: none;}

@media(max-width:1460px){
    .wrap {max-width:96%;}
}

/**/
.fc-deepblue {color:#003586;}
.ff-raleway {font-family: Raleway, sans-serif;}
.ff-pretendard {font-family: Pretendard, sans-serif;}

/**/
header {
    height:100px; display:flex;  justify-content: space-between; align-items: center;
    background:rgba(0,0,0,0.1); position:absolute; left:0; top:0; z-index:100; width:100%;
    /* transition:background-color 200ms; */
}
header .logo {width:30%; flex-shrink: 0; text-align:center;}
header .logo img {display:inline-block;}
header .menu {width:100%; height:100%;}
header .menu ul.m1 {display:flex; justify-content: space-between; margin:0 5% 0 0; height:100%;}
header .menu li.m1 {width:100%; height:100%; display:flex; align-items: center; justify-content: center; position:relative;}
header .menu a.m1 {color:#fff; display:inline-block; padding:4px 8px;}
header .menu ul.m2 {
    position:absolute; top:100%; text-align:center; width:100%; background:rgba(0,0,0,0.1);
    display:none; 
    /* transition: 200ms; */
}
header .menu li.m2 {padding:6px 12px; width:100%;}
header .menu li.m2:first-child {padding-top:12px;}
header .menu li.m2:last-child {padding-bottom:12px;}
header .menu a.m2 {color:#fff;}
header .lang {
    width:240px; height:100%; flex-shrink: 0; background:#003586; position:relative;
}
header .lang ul {
    position:absolute; margin:auto; top:0; right:0; bottom:0; left:0;
    width:80px; height:24px; text-align:center;
}
header .lang ul li {display:none; line-height:24px; position:relative;}
header .lang ul li a {color:#fff;}
header .lang ul li:first-child {display:block !important; background:url(/images/content/layout/icon_globe.png) no-repeat center left;}
header .lang ul li:first-child:after {
    position:absolute; content:''; width:30px; height:22px;
    background:url(/images/content/layout/Icon_bottom.png) no-repeat center center;
}
header .lang ul li:first-child a {}
header:hover,
header:hover .menu ul.m2 {background:rgba(0,0,0,0.5);}

/**/
footer {
    background:#3D3D49; height:200px; padding:20px 0;
    display:flex; align-items: center;
}
footer .wrap {
    display:flex; align-items: center; flex-shrink: 0; color:#858585;
}
footer .wrap > div:nth-child(1) {width:30%;}
footer .wrap > div:nth-child(2) {width:65%;}
footer .copyright {color:#909191; margin-top:25px;}

/**/
#svb {height:450px; margin-bottom: 80px;}
#svb .visual {height:100%; background-repeat:no-repeat; background-position:center center; background-image:url(/images/content/layout/svb_1.jpg);}
#svb .visual-1 {background-image:url(/images/content/layout/svb_1.jpg);}
#svb .visual-2 {background-image:url(/images/content/layout/svb_1.jpg);}
#svb .visual-3 {background-image:url(/images/content/layout/svb_1.jpg);}
#svb .visual-4 {background-image:url(/images/content/layout/svb_1.jpg);}


/*  */
#m_list{display: none;}




/* ----------------------------meadiaquery-------------------------------- */


/* Tablet */

@media (max-width:1100px) and (min-width:780px){

    /* html{overflow: hidden;} */
    .pc{display: none !important;}
    .mob{display: inline-block !important;}

    header .logo { padding-left: 20px;width: 200px; flex-shrink: 0; text-align:center;}
    header .logo img {display:inline-block; width: 100%;}
    header .menu  {font-size: 14px;}
    header .menu ul.m1 {display:none;}

header .lang {
    width:200px; height:100%; flex-shrink: 0; background:#003586; position:relative;
}
header .lang ul {
    display: inline-block !important;
    position: relative;
    vertical-align: middle;
    margin-top: 30px;
    margin-left: 15px;
    /* position:absolute; margin:auto; top:0; right:0; bottom:0; left:0;
    width:80px; height:24px; text-align:center; */
}

header:hover,
header:hover .menu ul.m2 {background:rgba(0,0,0,0.5);}

header > .lang > .mob {display: inline-block;}
header .lang .mob button {padding-top:8px;margin-top: 30px; display: inline-block !important; vertical-align: middle; border: none; background-color: inherit;}


/*사이드메뉴*/
.menu_btn{ display: inline-block;}
.m_list{ position: absolute; background:none; border: none; top: 30px; right: 10px;    transform:  translate(0%,-50%);}
.off{ display: none;}

#m_list{ display: block; position: fixed;  top: 0; right: -1920px; width: 80%; height: 100vh; z-index: 997; background: #003586; background-size: 60%; opacity: 0;}

.background-black { position: fixed; top: 0px; width: 100%; height: 150%; background-color: rgba(0,0,0,0.65); z-index: 200; display: none;}

.m_realList{ margin-top: 120px; }
.m_realList a{ color: #fff;}
.m_realList li{ color: #fff;}
.m_gnb{ width: 100%; height: 70px; display: block; line-height: 70px; font-size: 20px; font-weight: 800; margin-top: 30px;}
.m_gnb a{ padding: 0 30px;}
.menucopy{position: absolute;bottom: 30px;left: 50%;transform: translate(-50%,-0%);color: #666;font-weight: normal;font-size: 10px;text-align: center;}
.sub{display:block; background-color:#002866;width: 100%; position: relative;}


}/*태블릿 미디어쿼리 종료*/


/* Mobile - Portrait */
@media (max-width:779px){

    .pc{display: none !important;}
    .mob{display: inline-block !important;}

    
    html{overflow: hidden; width: 100%; height: 100% ;}
    header .logo { padding-left: 20px; width: 200px; flex-shrink: 0; text-align:center;}
    header .logo img {display:inline-block; width: 100%;}
    header .menu  {font-size: 14px;}
    header .menu ul.m1 {display:none;}

header .lang {
    width:150px; height:100%; flex-shrink: 0; background:#003586; position:relative;
}
header .lang ul {
    display: inline-block !important;
    position: relative;
    vertical-align: middle;
    margin-top: 30px;
    margin-left: 15px;
    /* position:absolute; margin:auto; top:0; right:0; bottom:0; left:0;
    width:80px; height:24px; text-align:center; */
}

header:hover,
header:hover .menu ul.m2 {background:rgba(0,0,0,0.5);}

header > .lang > .mob {display: inline-block;}
header .lang .mob button {padding-top:8px;margin-top: 30px; display: inline-block !important; vertical-align: middle; border: none; background-color: inherit;}


/*사이드메뉴*/
.menu_btn{ display: inline-block;}
.m_list{ position: absolute; background:none; border: none; top: 30px; right: 10px;    transform:  translate(0%,-50%);}
.off{ display: none;}

#m_list{ display: block; position: fixed;  top: 0; right: -1920px; width: 80%; height: 100vh; z-index: 997; background: #003586; background-size: 60%; opacity: 0;}

.background-black { position: fixed; top: 0px; width: 100%; height: 150%; background-color: rgba(0,0,0,0.65); z-index: 200; display: none;}

.m_realList{ margin-top: 120px; }
.m_realList a{ color: #fff;}
.m_realList li{ color: #fff;}
.m_gnb{ width: 100%; height: 70px; display: block; line-height: 70px; font-size: 20px; font-weight: 800; margin-top: 30px;}
.m_gnb a{ padding: 0 30px;}
.menucopy{position: absolute;bottom: 30px;left: 50%;transform: translate(-50%,-0%);color: #666;font-weight: normal;font-size: 10px;text-align: center;}
.sub{display:block; background-color:#002866;width: 100%; position: relative;}

/**/
footer {
    width: 100%;
    background:#3D3D49; height:auto !important;  padding:20px 0;
    display:block; align-items: center;
    
}
footer .wrap {
    display:block !important; align-items: center; flex-shrink: 0; color:#858585;
    width: 100%;
}
footer .wrap > div:nth-child(1) {width:100% !important; text-align: center;}
footer .wrap > div:nth-child(1) img {width:300px; padding-bottom: 30px;}
footer .wrap > div:nth-child(2) {width:100% !important;}
.foot-text {display:block; margin:0; width:100% !important;  margin: 0 auto;}
footer .wrap > div:nth-child(2) > div {display:block;width: 100% !important; text-align: center;}
footer .wrap > div:nth-child(2) > div> div > p { display: inline-block; font-size: 15px;}
footer .copyright {color:#909191; margin-top:25px; font-size: 13px;}
.footbx{display: none;}




}/* 모바일 미디어쿼리 종료 */