@charset "utf-8";
.skipToContent {position:absolute; top:0; left:0; overflow:hidden; display:block; width:0px; height:0px; line-height:0; font-size:0; text-indent:-9999px;}
.hidden {display:none;}

#wrapper {position:relative;}
/*** desktop ***********************************************************************************************************************/
body {min-width:1200px;}
#header {width:100%; z-index:999; height:110px; background:url('../images/main/header_bg.jpg') 0 0 repeat-x #fff; position:relative;border-bottom:1px solid #ddd;}
#header .logo {position:absolute; top:33px; left:0; z-index:999;}
#header .logo a {display:block;}
#header_content {*zoom:1; width:1200px; position:relative; height:110px; margin:0 auto;}
#header_content:after {content:" "; display:block; clear:both;}

.top_menu{position:absolute;top:0;right:0;}
.top_menu ul {overflow:hidden;}
.top_menu ul li {float:left;}

.top_menu ul li a {display:block;height:20px;line-height:20px;padding:0 18px;background:url('../images/main/top_v_line.jpg') 0 center no-repeat #fff; color:#7b8b97; font-size:11px;} 
.top_menu ul li:first-child a{background:none;background-color:#fff;}
.top_menu ul li a:hover, .top_menu ul li a:hover {color:#004c86;}


/* gnb */
nav#gnb{width:100%; position:absolute; top:20px; left:0;height:90px;}
nav#gnb > ul {*zoom:1; width:840px; margin:0 auto; padding:0 0 0 360px; z-index:700;}
nav#gnb > ul:after {content:" "; display:block; clear:both;}
nav#gnb > ul > li{float:left; position:relative; min-width:140px; text-align:center;}
nav#gnb > ul > li:first-child{margin:0;}
nav#gnb > ul > li > a{display:block; font-family:'raleway';font-size:18px; height:90px;line-height:90px; font-weight:600; color:#000;} 
nav#gnb > ul > li > a:hover, nav#gnb > ul > li > a:focus, nav#gnb > ul > li.active > a {color:#004c86;}
nav#gnb > ul > li .gnb-2dep {display:none; position:absolute; top:110px; line-height:35px; /*height:100px;*/}
nav#gnb > ul > li .gnb-2dep li {text-align:center; line-height:35px; width:140px; margin:0;}
nav#gnb > ul > li .gnb-2dep li.long {padding:8px 0; line-height:20px;}
nav#gnb > ul > li .gnb-2dep li a {color:#596772; font-size:15px; font-weight:400;
	transition:all .3s;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-ms-transition:all .3s;
}
nav#gnb > ul > li .gnb-2dep li a:hover, nav#gnb > ul > li .gnb-2dep li a:focus {color:#004c86; }
#gnbBg_wrap {width:100%; height:1px;border-top:1px solid #ddd;}
#gnbBg {position:absolute; top:90px; left:0px; width:100%; height:auto; padding:0; background:#f2f7fa; display:none;}

/* mobile gnb */
.allmenu_bt{display:none;}
#nav {display:none;}

/* main */

#mainvisual {width:100%; min-width:1200px; height:500px; overflow:hidden; position:relative;background:url('../images/main/mainvisual.jpg') 50% 0 no-repeat;}
#mainvisual .mainbox {width:1200px;height:100%;margin:0 auto; position:Relative;}
#mainvisual .main_txt{width:440px; position:absolute;left:0;top:0;}
#mainvisual .main_txt h2{padding:80px 0 0 0; font-size:95px;line-height:95px;font-family:'raleway'; font-weight:900; color:#004c86; letter-spacing:0.03em;}
#mainvisual .main_txt h2:after{content:"";display:block; width:336px;height:1px; background-color:#7e7e7e; margin:25px 0;}
#mainvisual .main_txt h3{font-size:30px;font-weight:600;color:#111111; letter-spacing:-0.03em; margin:0 0 20px 0;}
#mainvisual .main_txt p{color:#85898d;font-size:21px;line-height:30px;letter-spacing:0.02em;}

#mainvisual .slideshow {position:absolute; width:760px; height:440px; top:30px; right:0;}
#mainvisual .slideshow div {height:100%;}

#mainvisual .slick-dots{position: absolute;bottom:60px; left:-440px;z-index:901;}
#mainvisual .slick-dots:after{content:"";display: block;clear: both;}
#mainvisual .slick-dots li{float: left;margin:0 0 0 5px;}
#mainvisual .slick-dots button{font-size:0; outline:0;border:0;width:8px;height:8px;background-color: #a2a9af;border-radius:10px;}
#mainvisual .slick-dots .slick-active button{width:25px; background-color: #004c86;}



#content {width:100%;}
/* section1 */
.section1 {width:100%; padding:45px 0;background:url('../images/main/sec1_bg.jpg') 0 0 repeat;}
.section1 .about {*zoom:1; width:1200px; margin:0 auto;}
.section1 .about h3 {font-family:'raleway';font-size:28px;line-height:28px; font-weight:900; color:#fff;margin:0 0 20px 0;}
.section1 .about p {text-align:justify; font-family:'raleway'; font-size:16px;color:#fff; line-height:30px;}
.section1 .about  a {display:block; text-align:center;width:125px; height:26px;line-height:26px; font-size:13px; color:#fff; margin:20px 0 0;border:1px solid #eee;
	transition:all .3s;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-ms-transition:all .3s;
}
.section1 .about  a:hover, .section1 .about  a:focus{background-color:#fff; color:#00162f;}


/* section2 */
.section2 {padding:60px 0 114px;background:url('../images/main/sec2_bg.jpg') center center repeat;}
.section2 .banner {width:1200px; margin:0 auto;}
.section2 .banner ul {*zoom:1;}
.section2 .banner ul:after {content:" "; display:block; clear:both;}
.section2 .banner ul li {float:left; position:relative; margin:0 0 0 30px;}
.section2 .banner ul li:first-child {margin:0;}
.section2 .banner ul li p {
	width:380px; height:319px; overflow:hidden;
}
.section2 .banner ul li p img {
	-webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
    -o-transition: all 0.25s linear;
    transition: all 0.25s linear;
    will-change: transform;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.section2 .banner ul li:hover p img{
	-webkit-transform: scale(1.15) rotate(-5deg);
  -moz-transform: scale(1.15) rotate(-5deg);
  -ms-transform: scale(1.15) rotate(-5deg);
  -o-transform: scale(1.15) rotate(-5deg);
  transform: scale(1.15) rotate(-5deg);
}
.section2 .banner ul li a img {
	-o-transition:all .4s;
	-webkit-transition:all .4s;
	-ms-transition:all .4s;
	transition:all .4s;
}
.section2 .banner ul li:hover a img{
	transform:rotate(90deg);
	-webkit-transform:rotate(90deg);
	-o-transform:rotate(90deg);
	transition-delay: 0s;
	transition-duration: 0.5s;
	transition-property: all;
	transition-timing-function: linear;
}
.section2 .banner ul li a span {text-align:center; display:block; margin:30px 0 20px;}
.section2 .banner ul li a {font-family:'raleway';display:block; position:absolute; bottom:-55px; left:75px; width:230px; height:140px; font-size:21px; line-height:21px; font-weight:900;background-color:#fff; color:#002750; text-align:center;}


/* section2 */
.section3 {width:100%; padding:78px 0 100px;}
.section3 .notice {width:1200px; margin:0 auto;}
.section3 .notice h3 {font-family:'raleway';font-size:35px; font-weight:600; color:#111111; text-align:center; margin:0 0 40px 0; line-height:35px;}
.section3 .notice h3 span{color:#004c86; font-weight:900;}
.section3 .notice p {text-align:center; margin:0 0 30px 0;}
.section3 .notice p img {max-width:100%;}
.section3 .notice ul li {position:relative; width:1200px; padding:0 0 0 60px; height:45px; line-height:45px; font-weight:400; margin:10px 0 0;border:1px solid #ddd; box-sizing:border-box;
	background-image:url('../images/main/blue_arrow.png');
	background-repeat:no-repeat;
	background-position:40px 50%;

}
.section3 .notice ul li:first-child {margin:0;}
.section3 .notice ul li a {display:block; width:800px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:17px; color:#000;
	transition:all .3s;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-ms-transition:all .3s;
}
.section3 .notice ul li a:hover {color:#004c86;}
.section3 .notice ul li span {position:absolute; top:0; right:39px; font-size:16px; color:#9da5b9;}



/* footer */
#footer {width:100%; clear:both; background:#6a6f74; padding:60px 0;}
#footer_content {margin:0 auto; width:1200px;font-size:15px;text-align:center;}
#footer_content strong{display:block;color:#c5cad0;font-weight:600;margin:0 0 10px 0;}
#footer_content address {color:#c5cad0;  line-height:26px;}
#footer_content address a {color:#c5cad0;}
#footer_content address a:hover {font-weight:600;}
#footer_content p{color:#c5cad0;}

#footer_content p a {color:#c5cad0;}



/*Quick Menu */
#quick_menu {position:fixed; bottom:500px; margin:0 0 0 555px; width:65px; left:50%;
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease; /* Firefox 4 */
	-webkit-transition: all 0.5s ease; /* Safari and Chrome */
	-o-transition: all 0.5s ease; /* Opera */
}
#quick_menu a {display:block;}



/* sub */
#subvisual {height:200px; width:100%;
	background-image:url('../images/sub/subvisual.jpg');
	background-repeat:no-repeat;
	background-position:50% 50%;
}
#subvisual .sub_txt {width:1200px; margin:0 auto; padding:50px 0 0; text-align:center;}
#subvisual .path_wrap h3 {font-family:'raleway';font-size:50px; line-height:50px; font-weight: 900; color:#004c86; margin:0 0 28px 0;}
#subvisual .path_wrap .path p {font-family:'raleway', 'noto';font-size:15px; font-weight:400; color:#a1a9af; line-height:20px;}
#subvisual .path_wrap .path p span {display:inline-block; vertical-align:middle; margin:0 10px;}
#subvisual .path_wrap .path p strong {color:#222; font-weight:600;}



/* leftmenu */
#leftmenu {width:100%; height:50px; line-height:50px; background:url('../images/main/sec1_bg.jpg') 0 0 repeat;}
#leftmenu #lnb {width:1200px; margin:0 auto;}
#lnb ul {*zoom:1;}
#lnb ul:after {content:" "; display:block; clear:both;}
#lnb ul li {float:left; text-align:center; }
#lnb ul li:first-child {border:none;}
#lnb ul li a {display:block; padding:0 55px; font-size:16px; font-weight:400; color:#fff;
	transition:all .3s;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-ms-transition:all .3s;
}
#lnb ul li a:hover , #lnb ul li.on a {background:#fff; color:#00407a; font-weight:600;}



/**/
#cont {width:1200px; margin:0 auto; padding:80px 0 0;}
#subtitle {margin:0 0 70px 0;}
#subtitle h4 {text-align:center; font-size:40px; line-height:40px; font-weight:600; color:#151515; padding:0 0 27px 0;
	background-image:url('../images/sub/black_bar.gif');
	background-position:50% 100%;
	background-repeat:no-repeat;
}

#subtitle h4.long {font-size:30px;}

#con_area {min-height:320px; padding:0 0 80px 0;}
#con_area h3.c_tit{font-size: 24px;font-weight: 900;color: #226cb3; padding:0 0 0 30px; background:url('../images/sub/c_tit.jpg') 0 7px no-repeat;margin:0 0 20px 0;}


/* 01_01  */
.about .boxing{margin:0 0 60px 0;}
.about .top {margin:0 0 60px 0;}
.about .top h3{font-family: 'raleway'; font-size:35px;font-weight: 900;color:#00407a;text-align: center;line-height: 50px;

}
.about .top p.gray{color:#888888; font-size: 21px; font-weight: 600; text-align: center;letter-spacing: -0.03em;margin:0 0 70px 0;}
.about .top ul:after{content:"";display: block;clear: both;}
.about .top ul li {width: auto;margin: 0 5px 10px ;height: 45px; line-height: 45px;border-radius: 45px;-webkit-border-radius: 45px;-moz-border-radius: 45px;
border:1px solid #c9e7f4;box-shadow:0 5px 5px rgba(0,0,0,0.1);font-size: 15px;font-weight: 900;color: #555;letter-spacing: -0.04em;}
.about .top ul li.long {height:auto;line-height:20px; padding:7px 5px 15px;}
.about .top ul li  span{display: inline-block;width: 120px;line-height:15px;box-sizing: border-box;padding: 0 0 0 30px;font-size: 15px;margin:10px 20px 10px 0;color: #2a699c;border-right:1px solid #ccc;}
.about .top ul li:last-child {clear:both;float:none;margin:0 auto ;}
.about .boxing .gray{background-color: #f4f4f4; padding:30px; line-height: 30px; font-size: 15px;color: #333;letter-spacing: -0.03em;font-weight: 600;}



/* 01_02 */
.map_area .map {width:100%; height:450px; margin:0 0 34px 0;}
.map_area .map .root_daum_roughmap .wrap_map {height:100% !important;}
.map_area .map_info table th {font-size:16px; font-weight:600; color:#00377e; padding:20px 0; border-bottom:1px solid #ddd; text-align:left;}
.map_area .map_info table th span {display:inline-block; vertical-align:middle; margin:0 55px 0 0;}
.map_area .map_info table td {padding:20px 0; font-size:16px; font-weight:400; color:#454545; border-bottom:1px solid #ddd;}
.map_area .map_info table .last {border-bottom:none;}

.map_area .map_info table td .s_txt {font-size: 13px;color: #6b9bc0;}



/* 03_01 */
.professor .top{padding:30px; border:6px solid #dfe5eb;margin:0 0 60px 0;}
.professor .top dl:afteR{content:"";display: block;clear: both;}
.professor .top dl dt{float: left;width: 178px;}
.professor .top dl dd{float: left;width:900px;margin-left: 50px;}
.professor .top dl dd h3 {font-family: 'raleway'; font-size: 24px; font-weight: 900;color: #004c86; padding:0 0 15px 0; margin:20px 0 30px;border-bottom: 1px solid #ddd;}
.professor .top dl dd h3 span {display: inline-block;font-size: 20px; color: #acacac; font-weight: 400;padding:0 0 0 10px;}
.professor .top dl dd .dot {padding:0 0 0 15px; background:url('../images/sub/blue_dot.jpg') 0 9px no-repeat;color: #111;font-size: 16px;margin:12px 0;font-weight: 600;}

.professor .boxing{margin:0 0 60px 0;}
.professor .boxing .bbox{border-top:2px solid #6b9bc0;border-bottom:2px solid #ddd;padding:20px;}
.professor .boxing .bbox .dot {padding:0 0 0 15px; background:url('../images/sub/blue_dot.jpg') 0 9px no-repeat;color: #111;font-size: 15px;margin:12px 0;font-weight: 600;}
.professor .boxing .bbox .dot span {display: block;font-size: 14px; font-weight: 400;color: #555;line-height: 22px;padding:10px 0 0 0;}


/*  04_01  */
.research .boxing {margin:0 0 80px 0;font-family: 'raleway';}
#con_area .research .boxing h3.c_tit{border-bottom:2px solid #2570b6; padding:0 0 20px 30px;}
.research .boxing  h5{ font-size: 16px;color: #2570b6;font-weight: 600; line-height: 30px;border-bottom: 1px solid #ddd;padding:15px 0;}
.research .boxing  h5 .dot {padding:0 0 0 15px; background:url('../images/sub/blue_dot.jpg') 0 9px no-repeat;color: #111;font-size: 15px;margin:12px 0;font-weight: 900;line-height:22px;}
.research .boxing .img {text-align: center;padding:30px 0;}





/**** mobile layout *************************************************************************************************************/
@media screen and (max-width:640px) {

	body {min-width:320px; width:100%; height:100%;}

	#header_content {width:100%; height:80px;}
	#header {height:80px; }
	#header .logo {top:32px; left:15px;}

	#header .logo a img{height:35px;}

	#header_content:after {content:" "; display:block; clear:both;}

	.top_menu{ right:15px; }
	.top_menu ul li a {padding: 0 10px;font-size: 11px;}


	/* nav */
	#nav {display:block; z-index:1000;}
	#nav {position:absolute; top:80px !important; right:0; width:100%; text-align:left; z-index:900; border-top:1px solid #ddd; background:#fff; }
	#nav li {position:relative; border-bottom:1px solid #ddd; letter-spacing:-0.025em;}
	#nav li a .arrow {position:absolute; top:50%; right:10px; z-index:900;}
	#nav li a .arrow img {width:9px; height:6px;}
	#nav li a {position:relative; color:#151515; font-size:14px; font-weight:600; display:block; line-height:130%; padding:12px 22px 12px 10px;}
	#nav li ul {background:#e1eaf7; }
	#nav li ul li {border-bottom:none; border-top:1px solid #cedcf1;}
	#nav li ul li:first-child {border-top:none;}
	#nav li ul li a {color:#111; font-size:13px; font-weight:600; background:none; line-height:130%;}
	#nav li ul li a span {font-weight:400; color:#ffdf47;}

	nav#gnb {display:none;}
	.allmenu_bt {display:block; position:absolute; top:40px; right:20px; z-index:1000; width:30px;}
	.allmenu_bt a {display:inline-block;}
	.allmenu_bt img {max-width:100%;}



	/* main */

	#mainvisual {min-width:auto; height:auto;padding:0 0 60px 0;  position:relative;background:url('../images/main/mainvisual.jpg') 15% 100% no-repeat;background-size:cover;}
	#mainvisual .mainbox {width:auto;height:100%;padding:0 15px;}
	#mainvisual .main_txt{width:auto; position:static;}
	#mainvisual .main_txt h2{padding:60px 0 0 0; font-size:35px;line-height:35px;font-family:'raleway';}
	#mainvisual .main_txt h2:after{width:200px;margin:20px 0;}
	#mainvisual .main_txt h3{font-size:20px;margin:0 0 10px 0;}
	#mainvisual .main_txt p{font-size:14px;line-height:20px;margin:0 0 10px 0;}

	#mainvisual .slideshow {position:static; width:auto; height:auto;}
	#mainvisual .slideshow div {height:100%;}
	#mainvisual .slideshow div img{width:80%;}

	#mainvisual .slick-dots{bottom:-10px; left:15px;}
	#mainvisual .slick-dots button{width:5px;height:5px;}
	#mainvisual .slick-dots .slick-active button{width:20px;}


	/* section1 */
	.section1 {padding:45px 20px;width:auto;}
	.section1 .about {width:auto; margin:0 auto;}
	.section1 .about h3 {font-size:22px;line-height:22px;}
	.section1 .about p {font-size:13px;line-height:26px;text-align:left;}
	.section1 .about  a {font-size:11px;}


	/* section2 */
	.section2 {padding:30px 0 110px;}
	.section2 .banner {width:auto; padding:0 20px;}
	.section2 .banner ul li {width:31%; margin:0 0 0 10px;}
	.section2 .banner ul li p {width:100%; height:100px;}
	.section2 .banner ul li p img {max-width:100%; height:100%;}
	.section2 .banner ul li a {width:100%; font-size:13px; line-height:13px; left:0; bottom:-80px; height:auto; padding:20px 0;}
	.section2 .banner ul li a span {margin:0 0 10px;}
	.section2 .banner ul li a span img {width:20px;}


	/* section3 */
	.section3 {padding:50px 0;}
	.section3 .notice {width:auto; padding:0 20px;}
	.section3 .notice h3 {font-size:20px; line-height:20px; margin:0 0 20px 0;}
	.section3 .notice p {margin:0 0 20px 0; height:50px;}
	.section3 .notice p img {height:100%;}
	.section3 .notice ul li {width:auto; padding:0 0 0 7%; background-position:3% 50%;}
	.section3 .notice ul li a {width:70%; font-size:14px;}
	.section3 .notice ul li span {right:10px; font-size:13px;}


	/* footer */
	#footer {height:auto; padding:40px 0;}
	#footer_content {width:auto; padding:0 20px;}
	#footer_content strong{font-size:14px;line-height:23px;}
	#footer_content address {font-size:13px; line-height:23px;}
	#footer_content p{font-size:13px;}

	


	/*Quick Menu */
	#quick_menu {display:none;}

	/* sub */
	#subvisual {height:150px;  background-size:cover;background-position:20% center;}
	#subvisual .sub_txt {width:auto; padding:50px 10px 0;}
	#subvisual .path_wrap h3 {font-size:25px; line-height:25px; margin:0 0 15px 0;}
	#subvisual .path_wrap .path p {font-size:13px;}
	#subvisual .path_wrap .path p span {margin: 0 5px;	}

	/* leftmenu */
	#leftmenu {display:none;}
	#leftmenu #lnb {display:none;}
	#cont {width:auto; padding:60px 20px 0;}
	#subtitle {margin:0 0 50px 0;}
	#subtitle h4 {font-size:26px; line-height:28px;padding:0;}
	#subtitle h4.long {font-size:20px;}
    #con_area h3.c_tit{font-size: 18px;padding:0 0 0 25px; background:url('../images/sub/c_tit.jpg') 0 5px no-repeat;margin:0 0 15px 0;}

    
	/* 01_01  */
    .about .top h3{font-size:18px;line-height: 28px;}
    .about .top p.gray{font-size: 14px;margin:0 0 40px 0;}
    .about .top ul {width:auto;}
    .about .top ul li {float:none;width: auto; margin: 0 0 10px 0 ;font-size: 12px;line-height:19px; height:auto; padding:20px;border-radius: 3px;-webkit-border-radius: 3px;-moz-border-radius: 3px;}
	.about .top ul li.long {height:auto;line-height:19px; padding:20px;}
    .about .top ul li  span{width: 80px;padding: 0;font-size: 13px;margin:0 0 12px 0;display: block;border:none;}
    .about .boxing .gray{ padding:20px; line-height: 25px; font-size: 13px;}



    
    
    /* 01_02 */
	.map_area .map {width:auto; margin:0 0 30px 0; height:250px;}
	.map_area .map_info table th {font-size:14px;}
	.map_area .map_info table th span {margin:0 10px 0 0; width:30px;}
	.map_area .map_info table th span img {max-width:100%;} 
	.map_area .map_info table td {font-size:13px; word-break:keep-all; line-height:22px;}


	

    /* 03_01 */

    .professor .top dl dt{float: none;width: auto;text-align: center;}
    .professor .top dl dt img{width: 130px;}
    .professor .top dl dd{float: none;width:auto;margin:0;}
    .professor .top dl dd h3 {font-size: 17px; text-align: center;}
    .professor .top dl dd h3 span {font-size: 12px;}
    .professor .top dl dd .dot {font-size: 13px;}
    .professor .boxing .bbox .dot {font-size: 12px;}
    .professor .boxing .bbox .dot span {font-size: 12px;}



    /*  04_01  */
    .research .boxing  h5{ font-size: 14px;line-height: 24px;}
    .research .boxing  h5 .dot {font-size: 12px;line-height:20px;}
    .research .boxing .img img{width:80%;}




    
    
    
    
    /* member */
	.sub_wrap {width:100%; height:100%; overflow:hidden; background:#f5f5f5; padding:30px 0;}
	.sub_cont {width:auto; padding:0 10px;}
	.cont {padding:0;}


    
    
    
    
}

@media screen and (max-width:320px) {
	
	
	#lnb ul li a {padding:0 20px;}

	/* section2 */
	.section2 .banner ul li {width:32%; margin:0 0 0 1%;}







}