html {overflow-x: hidden;}
.wrap {
    width:100%; width:1500px; margin:0 auto;
    color:#333;
}
.fc-hj {color:#2599B2;}

/**/
header {
    /*display:none;*/
    z-index:1000; height:100px; background:#fff;
    position:fixed; width:100%; top:0; left:0;
}
header .wrap {display:flex; width:1800px; height:100%; justify-content: center; align-items: center;}
header .wrap .logo {flex-shrink: 0; }
header .wrap .logo img {display:block;}
header .wrap nav {width:100%; display:flex; justify-content:center;}
header .wrap nav ul.m1 {display:flex; }
header .wrap nav ul.m1 li.m1 {
    display:flex; align-items: center; justify-content: center;
    margin:0; position:relative; font-size:16px;
    padding:0 45px;
}
header .wrap nav ul.m1 li.m1:first-child {}
header .wrap nav ul.m1 li.m1 a.m1 {font-size:16px; font-weight:bold;}
header .wrap .lang {flex-shrink: 0; padding:3px 13px;border-radius:30px;border:1px solid #555;}
header .wrap .lang a {color:#333; font-size:16px; }
header .wrap .lang a.active {color:#2599B2; font-weight: bold;}
header .wrap .ma {flex-shrink: 0; width:30px; margin-left:20px; display:none;}
ul.m2 {
    display:none;
    top:60px;
    flex-direction: column;
    position:absolute;
    background:#fff;
    border-radius:14px;
    box-shadow:0 0 10px rgba(0,0,0,0.2);
    padding:20px 10px;
    width:100%;
    /*transform:translateX(-30%);*/
    left:0;
}
ul.m2 li.m2 {
    width:100%;
    text-align:center;
    margin:0 0 10px 0;
}
ul.m2 li.m2:last-child {margin:0 0 0 0;}
ul.m2 li.m2:hover,
ul.m2 li.m2.active {
    font-weight:bold;
}
ul.m2 li.m2 a.m2 {
    display:block;
    padding:0;
    color:#555;
}
.hamburger {
    width:18px; padding:6px; margin:auto; cursor:pointer; box-sizing: content-box;
}
.hamburger > div{
    height:2px; background:#333; width:100%; margin:2px 0; border-radius:10px; transition:all 200ms;
    display:block;
}
.hamburger > div:nth-child(1) {}
.hamburger > div:nth-child(2) {width:65%;}
.hamburger > div:nth-child(3) {}
.hamburger.active {}
.hamburger.active > div:nth-child(1) {transform:translateY(4px) translateX(0) rotate(45deg);}
.hamburger.active > div:nth-child(2) {opacity:0;}
.hamburger.active > div:nth-child(3) {transform:translateY(-4px) translateX(0) rotate(-45deg);}


footer {
    min-height:250px; background:#3d3d3d;
    display:flex; justify-content: center; 
    padding:40px;
}
footer .wrap {
    display:flex; 
    justify-content: space-between; color:#fff;
    font-size:16px;
}
footer .wrap .inf span{color: #D9D9D9;font-weight: 700; margin-right:5px;}
footer .wrap .inf span.ml{margin-left:20px;}
footer .wrap .inf .cpr{margin-top:40px;}
footer img {display:block;}

/**/
#svb {margin-top:100px; padding-top:70px;}
#svb .sub-visual {
    height:500px;
    background-repeat: no-repeat; background-position:center center;
    display:flex; justify-content: center; align-items: center;
    background-image: url(/images/content/layout/sub_visual_1.jpg);
}

#svb .sub-visual > div {
    color:#fff;
}

/**/
#svb-location {
    
}
#svb-location .location {
    display:flex; align-items: center;
    margin-top:20px; user-select:none;
}
#svb-location .location li.home a {
    display:block;
    background:url(/images/content/layout/home.png) no-repeat center center;
    width:18px; height:18px; font-size:0;
}
#svb-location .location .arr {
    margin:0 10px; width:6px; height:9px; font-size:0;
    background:url(/images/content/layout/la.png) no-repeat center center;
}
#svb-location .location ul.l1 {
    display:flex; justify-content: center; align-items: center;
}
#svb-location .location li.l1 {
    cursor:pointer; position:relative; z-index: 1;
}
#svb-location .location ul.l2 {
    display:none;
    position:absolute; border:1px solid #ccc; border-radius:20px; background-color: #fff;
    box-shadow:0 0 10px 3px rgba(0,0,0,0.2); padding:16px 10px; width:100%; min-width:120px; z-index: 10;
    background:#fff;
}
#svb-location .location li.l2 {text-align:center; margin:10px auto;}
#svb-location .location a.l2 {font-size: 16px; font-weight: 500; color: #555; line-height:1.5;}

/**/
.m_list{ position: absolute; background:none; border: none; top: 30px; right: 10px; transform:  translate(0%,-50%);}
.off{ display: block;}
#m_list{
    user-select:none;
    display: block; position: fixed;  top: 0; right: -1920px; width: 30%;
    height: 100vh; z-index: 997; background: #2599B2; background-size: 60%; opacity: 1;
}
#m_list button {background:transparent;}
.background-black {
    position: fixed; top: 0; left: 0; 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; cursor:pointer;}
.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: #fff;font-weight: normal;font-size: 10px;text-align: center;}
.m_realList .sub{display:block; background-color:#188AA3 ;width: 100%; position: relative;}

/**/
.cata{ width: 170px !important; }
.cata > a{cursor: pointer !important;}
.catabtn{width: 170px !important; border: 1px solid #2599B2 !important; border-radius: 500px !important; text-align: center !important; padding:5px 10px !important; font-size: 14px !important; font-weight: 700 !important; color: #2599B2 !important;}
.catabtn:hover{ background-color: #2599B2 !important; color: #fff !important; transition: .1s !important;}


/* --------------------------------------meadiaquery----------------------------------------- */


/* Tablet */

@media (max-width:1180px) {

.wrap {
    width:96%; margin:auto;
    color:#333;
}
/**/
header {
    /*display:none;*/
    z-index:1000; height:100px; background:#fff;
    position:fixed; width:100%; top:0; left:0;
}
header .wrap {display:flex; width:96%; height:100%; justify-content: center; align-items: center;}
header .wrap .logo {flex-shrink: 0; }
header .wrap .logo img {display:block;}
header .wrap nav {width:100%;}
header .wrap nav ul.m1 {display:none; }
header .wrap .ma {display:block;}
/**/
.m_list{ position: absolute; background:none; border: none; top: 30px; right: 10px; transform:  translate(0%,-50%);}
.off{ display: block;}
#m_list{
    user-select:none;
    display: block; position: fixed;  top: 0; right: -1920px; width: 80%;
    height: 100vh; z-index: 997; background: #2599B2; background-size: 60%; opacity: 1;
}
#m_list button {background:transparent;}
.background-black {
    position: fixed; top: 0; left: 0; 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; cursor:pointer;}
.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: #fff;font-weight: normal;font-size: 10px;text-align: center;}
.m_realList .sub{display:block; background-color:#188AA3 ;width: 100%; position: relative;}

/**/
.cata{ width: 130px !important; }
.cata > a{cursor: pointer !important;}
.catabtn{width: 130px !important; border: 1px solid #2599B2 !important; border-radius: 500px !important; text-align: center !important; padding:5px 10px !important; font-size: 14px !important; font-weight: 700 !important; color: #2599B2 !important;}
.catabtn:hover{ background-color: #2599B2 !important; color: #fff !important; transition: .1s !important;}

/**/
#svb .sub-visual{height:30vw; width:96%; background-size:contain; margin:0 auto;}

/**/
footer {
    min-height:250px; background:#313131;
    display:flex; justify-content: center; align-items: center; text-align: center;
    
}
footer .wrap {
    display:block; align-items: center;
    justify-content: space-between; color:#858585;
    font-size:16px;
}
footer .wrap > div {
    display: block;
}
footer img {display:block; margin: 30px auto;}


}/* 태블릿 종료 */





/* Mobile - Portrait */
@media (max-width:779px){
   

	/**/
	header {
		/*display:none;*/
		z-index:1000; height:80px; background:#fff;
		position:fixed; width:100%; top:0; left:0;
	}
	header .wrap {display:flex; height:100%; justify-content: center; align-items: center;}
	header .wrap .logo {flex-shrink: 0; width: 130px;}
	header .wrap .logo img {display:block; width: 100%;}
	header .wrap nav {width:100%;}
	header .wrap nav ul.m1 {display:none; }
	/**/
	.m_list{ position: absolute; background:none; border: none; top: 30px; right: 10px; transform:  translate(0%,-50%);}
	.off{ display: block;}
	#m_list{
		user-select:none;
		display: block; position: fixed;  top: 0; right: -1920px; width: 90%;
		height: 100vh; z-index: 997; background: #2599B2; background-size: 60%; opacity: 1;
	}
	#m_list button {background:transparent;}
	.background-black {
		position: fixed; top: 0; left: 0; 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; cursor:pointer;}
	.m_realList li{ color: #fff;}
	.m_gnb{ width: 100%; height: 60px; display: block; line-height: 50px; font-size: 18px; font-weight: 700; margin-top: 30px;}
	.m_gnb a{ padding: 0 30px;}
	.menucopy{position: absolute;bottom: 30px;left: 50%;transform: translate(-50%,-0%);color: #fff;font-weight: normal;font-size: 10px;text-align: center;}
	.m_realList .sub{display:block; background-color:#188AA3 ;width: 100%; position: relative;}

	/**/
	.cata{ display: none; }

	/**/
	footer {
		min-height:250px; background:#313131;
		display:flex; justify-content: center; align-items: center; text-align: center;
		
		padding: 30px;
	}
	footer .wrap {
		display:block; align-items: center;
		justify-content: space-between; color:#858585;
		font-size:16px;
	}
	footer .wrap > div {
		display: block;
	}
	footer img {display:block; margin: 30px auto; width: 150px;}

	#svb{padding-top:5vw;}
	#svb .fs-40{line-height:1;}
	#svb .sub-visual {
		background-repeat: no-repeat; background-position:center center;
		display:flex; justify-content: center; align-items: center;
		background-image: url(/images/content/layout/sub_visual_1.jpg);
	}


}

@media (max-width:550px){
	header .wrap .ma{margin-left:10px;}
}