body{ color: #fff; background: #000; }

.inr,
.wrapper{ position: relative; }
.content_area{ width: calc( 100% - 250px ); padding-left:250px;}

h2{font-size:45px; font-weight:700; color:#fff;}
h3{font-size:30px; font-weight:700; line-height:normal; letter-spacing:0; }

a.link{ margin-right: 6px; padding-right: 28px; background: url(../images/main/link_icon.png) no-repeat center right; text-transform:none;}

/* header */
#header {z-index: 99;position: fixed;top: 0;left: 0;width: 100%; height:110px; transition: .3s;background: rgba(0,0,0,.75)}
#header .inr {display: flex;justify-content: space-between;align-items: center; padding: 0 27px;height: 110px;box-sizing: border-box}
#header .inr > div {flex: 1;margin-left: 105px;text-align: left}
#header .inr > div p {margin-bottom: -6px;font-size: 1.333em;font-weight: 700}
#header h1 a{display:inline-blcok; font-size:0;}
#header h1 a img:first-child{margin-right:15px;}

#header .gnb{position:absolute; right:250px; top:0;}
#header .gnb > li{position: relative; display:inline-block;}
#header .gnb > li > a{display:block; line-height:100px; height:100px; padding:0 45px; color:#fff; font-size:18px; font-weight:500;}
#header .gnb > li > .sub_menu{display:none; position:absolute; left:0; top:80px; width:100% !important; background:#fff; border:1px solid #ddd; z-index:99;}
#header .gnb li:hover .sub_menu{display:block; background:#fff; top:80px; width:100%; animation: submenu 0.3s 1 linear;}
#header .gnb .sub_menu{animation: submenu 0.3s 1 linear; transition: ease all .2s;}
#header .gnb .sub_menu li a{display: block; padding:14px 0; color:#333; border-top:1px solid #ddd; font-size:14px; text-align:center; transition:0.4s;}
#header .gnb .sub_menu li a:hover{background:#598e35; color:#fff;}
#header .gnb .sub_menu li:first-child a{border-top:0;}

#header .area_util{position:absolute; right:0; top:25px;}
#header .area_util span{display:inline-block; width:40px; height:40px; margin-right:6px; background:#111; background-size:15px; border-radius:50%; }
#header .area_util div{display:inline-block; color:#fff;}
#header .area_util div a{color:#fff; font-weight:bold; font-size:20px;}


#header .collaboration_list{ display: flex; }
#header .collaboration_list li:not(:first-child){ position: relative; margin-left: 15px; padding-left: 15px; }
#header .collaboration_list li:not(:first-child):before{ content: ''; display: block; position: absolute; top: 50%; left: 0; transform: translateY( -50% );width: 2px; height: 11px; background: #a4a09f; }

/* nav */
nav { padding: 12px 0 0 27px; min-width: 250px; }
nav ul{ position: fixed; top:150px; }
nav li a{display:flex; align-items:center; width:100%; height:55px; line-height: 55px;}
nav li a[href='#usrg'] img{width:100px;}
nav li a.on{ color: #2ccfd5; }
/* nav li a.on{ background: -webkit-linear-gradient( 325deg ,#2ccfd5 0,#077abf 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;} */


/* mobile-menu */
.mobile_header{background:#008790; color:#333; text-align:center; padding:35px 0 10px 0;}
.btn_menu{position:relative; z-index:90; width:25px; height:45px; }
.btn_menu{display:none;}
.btn_menu span{display:block; width:24px; height:1px; background:#fff; text-align:center;}
.btn_menu span:nth-child(1){margin-top:14px;}
.btn_menu span:nth-child(2){margin-top:7px;}
.btn_menu span:nth-child(3){margin-top:7px;}

.menu_top p{margin-top:10px; color:#949494;}
#header .m_gnb_top h1{float:none; padding:20px; }
.m_area_util{margin-top:40px;overflow:hidden;  padding:20px; box-sizing:border-box; background:#4c4c4c;}
.m_area_util a{display:inline-block; width: 49%; height:31px; box-sizing: border-box; padding:5px 0; margin:2px 0px; border:1px solid #fff; vertical-align:middle; color:#fff; text-align:center; font-size:14px;}
.m_gnb{overflow-y:auto; position:fixed; top:0px; right:-100%; width:280px; height:100%; background:#fff; transition:all 0.5s ease-out 0s;z-index:999;}
.m_gnb > ul{ margin-top: 100px; }
.m_gnb > ul > li > a{display:block; position:relative; padding:15px 25px; border-bottom: 1px solid #eaeaea; color:#424242; transition:all 0.3s ease 0s;}
.m_gnb > ul > li:first-child{background-color:#000;}
.m_gnb > ul > li:first-child a{display:flex; align-items:center; min-height:27px;}
.m_gnb > ul > li > a.open:before{content:''; display:block; position:absolute; top:25px; right:10px; width:11px; height:7px; background:url(../images/main/menu_button.png) no-repeat 50% 0; transition:all 0.4s ease 0s; background-size:100%;}
.m_gnb > ul > li > a.active{}
.m_gnb > ul > li > a.active:before{transform:rotate(180deg);}
.m_gnb > ul > li > ul{display:none; background:#efefef; }
.m_gnb > ul > li > ul > li{border-bottom:1px solid #dedede;}
.m_gnb > ul > li > ul > li > a{position:relative; display:block; padding:20px 25px; font-size:14px; color:#333; }

.m_gnb .btn_close{opacity: 0; display: block; position:absolute; top:30px; right:-100%; width:24px; height:23px; font-size:0px; transition:0.8s;}
.m_gnb.active{right:0px;}
.m_gnb.active .btn_close{opacity:1; right:15px;}
.m_gnb_top{box-sizing:border-box; background:#00469b;}
.m_gnb_top p{background:#ddd;}
.m_gnb > ul{}
.m_gnb .btn_close:before{content: ''; display:block; position:absolute; top:9px; left:0px;  width:100%; height:1px; background:#333; transform:rotate(45deg);}
.m_gnb .btn_close:after{content: ''; display:block; position:absolute; top:9px; left:0px; width:100%; height:1px; background:#333; bottom: 9px; transform:rotate(-45deg);}

.area_util_m{padding:20px 20px; margin-top:100px; background:#598e35;}
.area_util_m span{display:inline-block; width:40px; height:40px; margin-right:6px; background:#111 url(../images/main/icon_call.svg) no-repeat 50%; background-size:15px; border-radius:50%; }
.area_util_m div{display:inline-block; color:#fff;}
.area_util_m div a{color:#fff; font-weight:bold; font-size:17px;}

.cover{position: fixed; width: 100%; height:100%; left:0; top:0; background:rgba(0, 0, 0, 0.4); z-index:995; visibility: hidden; opacity: 0; transition: .5s;}
.cover.active{ visibility: visible; opacity: 1; }

.contact_us span{text-transform:none;}
#footer{ padding: 50px 0; text-align: center;}


@media all and (max-width:1280px){
	h2{font-size:40px;}
	h3{font-size:24px;}

	#header { height:80px; }
	#header .inr { height:80px; }
	#header .inr > div{ margin-left: 40px; }

	#header .area_util,
	#header .gnb{display:none;}
	#header .collaboration_list{display: none; }
	.btn_menu{display:block;}

	.content_area{ width: calc(100% - 200px); padding-left:200px; }

	nav { min-width: 200px; }
	nav ul{ top: 100px; }
}

@media all and (max-width:1080px){
	#header .inr { padding: 0 2vw; }

	.content_area{ width: 100%; padding-left:0;}

	nav {display: none;}
}

@media all and (max-width:767px){
	body,
	p,
	li,
	a{ font-size:14px;}

	h2{font-size:34px;}

	#header h1 a:first-child img{display:none;}
	#header .inr > div span {display:block; margin-top:5px;}
	#footer{ padding: 25px 0;}
}

@media all and (max-width:640px){
	#header .inr > div{margin-left:30px;}
}

@media all and (max-width: 570px){
	#header h1 a:first-child img{display:inline-block;}
	#header .inr > div{ display: none; }
}

@media all and (max-width:500px){
	#header { height:65px; }
	#header .inr { height:65px; }
	#header h1 a:first-child img{display:none;}
}