@charset "UTF-8";

.skip{display:block; position:absolute; top:-30px; left:0; width:100%; color:#333; line-height:30px; background:#fff; text-align:center; z-index:110;}
.skip:focus{top:0;}

.dot{width: 3px;height: 3px;content: ''; clear: both;background-color: #fff;display: inline-block;position: absolute;top: 50%;margin-left: 10px;}
.inner{width: 1180px;margin: 0 auto;}

.header {border-top: 40px solid #008fc5;}
.header .inner {position: relative;}
.header h1 {position: absolute;top: 28px;left: 0;}
.header h1 a{display: block;width: 271px; height: 47px;background: url(../img/logo.png) no-repeat top left; text-indent: -99999px;font-size: 0;}
.menuGroup{height: 100px; border-bottom:1px solid #ddd; line-height: 100px;}
.menuGroup nav .menu{position: absolute;top: 0;right: 0;z-index: 1000;}
.menuGroup nav .menu li{float: left;text-align: center;position: relative;}
.menuGroup nav .menu li a{display:block; min-width:200px;  text-align:center;font-size:20px;font-weight: 500;color: #000;}
.menuGroup nav .menu li:hover a{color: #008fc5}
.menuGroup nav .menu li ul{display: none;position: absolute;top: 100px;left: 0; border-right:1px solid #ddd;}
.menuGroup nav .menu li:first-child ul{border-left:1px solid #ddd;}
.menuGroup nav .menu li ul a{font-size:16px;font-weight: 400; color:#666666; line-height: 60px;}
.menuGroup nav .menu li:hover ul li a{color: #666666;font-weight: 400;}
.menuGroup nav .menu li:hover ul li a:hover{color: #fff;font-weight: 500;background-color: #008fc5;}
.menuGroup nav .gnbBg{position:absolute; top:140px; left:0; width:100%; height:0px;
	background-color: #fff; z-index: 100;
}
@media screen and (max-width:1200px){
    .inner{width: auto;}

	.header{border-top:50px solid #fff; background:#fff;}
	.header h1{position: absolute;top: -38px;left: 0;margin-left: 20px;}
	.header h1 a{width:142px; height:25px; background-image:url(../img/logo_m.png); background-size:142px 25px;}
	.menuGroup{height: 50px;line-height: 50px;}
    .menuGroup nav .menu {position: relative;}
	.menuGroup nav .menu li{float: none;text-align: left;float:none; border-bottom:1px solid #ddd; text-align:left;}
	.menuGroup nav .menu li a{min-width: 100%;text-align: left;font-size: 15px;}
	.menuGroup nav .menu li:hover a{font-weight: 500; color:#000;}
	.menuGroup nav .gnbBg{display: none;}
	
    .menuGroup .gnbWrap .menu>li>a{position:relative;width:100%;font-weight: 500;padding-left: 20px;padding-right: 20px;}
    .menuGroup .gnbWrap .menu>li>a:after{content:""; display:block; position:absolute; top:50%; right:20px; width:10px; height:10px; margin-top:-5px; border:solid #aaa; border-width:0 0 2px 2px;
        -webkit-transform:rotate(-45deg);
        -moz-transform:rotate(-45deg);
        -ms-transform:rotate(-45deg);
        transform:rotate(-45deg);
    }
    .menuGroup .gnbWrap .menu>li>.active{color:#008fc5;}
    .menuGroup .gnbWrap .menu>li>.active:after{margin-top:0;
        -webkit-transform:rotate(135deg);
        -moz-transform:rotate(135deg);
        -ms-transform:rotate(135deg);
        transform:rotate(135deg);
    }
    .menuGroup .gnbWrap .menu ul{display:none; position:relative; top:0; left:0; padding:0; min-width:auto; margin:0; border:0; background:#f9f9f9; border-right:0;
        -webkit-transform:translate(0, 0);
        -moz-transform:translate(0, 0);
        -ms-transform:translate(0, 0);
        transform:translate(0, 0);
		
    }
	.menuGroup .gnbWrap .menu ul li{border-bottom: 0;}
    .menuGroup .gnbWrap .menu ul a{padding:14px 20px 14px 20px;font-size: 13px;line-height: 1;position: relative;}
    .menuGroup nav .menu li:first-child ul{border-left:0;}
}

.btn_m_openGnb{display:none; position:absolute; top:16px; right:20px; width:19px; height:16px; background-image:url(../img/Mico_m_gnb.png); background-repeat:no-repeat; background-size:19px 36px; font-size:0; text-indent:-99999px; z-index:100;}
.menuGroup .btn_m_closeGnb{display:none; position:absolute; top:16px; right:20px; width:19px; height:17px; background:url(../img/Mico_m_gnb.png) no-repeat 0 -20px; background-size:19px 36px; font-size:0; text-indent:-99999px; z-index:1110;background-position: 0 -19px;}

@media screen and (max-width:1200px){
    .btn_m_openGnb{display:block;}
    .menuGroup .btn_m_closeGnb{display:block;}
    .menuGroup{position:fixed; top:0; right:-83%; left:auto; width:83%; height:100%; margin-left:0; overflow-y:auto; background:#fff; z-index:1100;}
}

/*utilGroup*/
.menuGroup .inner{position: relative;}
.menuGroup .utilGroup li{float: left;line-height: 30px;}
.menuGroup .utilGroup li+li{margin-left: 23px;}
.menuGroup .utilGroup li a{color: #fff;}
.menuGroup .utilGroup .util01{position: absolute;top: -35px;left: 0;}
.menuGroup .utilGroup .util02{position: absolute;top: -35px;right: 0;}

@media screen and (max-width:1200px){
	.menuGroup .utilGroup{position: relative; top: 0px;padding: 25px; border-bottom: 1px solid #ddd; background-color: #008fc5;	}
	.menuGroup .utilGroup li a{font-size: 12px;}
	.menuGroup .utilGroup .util01{display: none;}
	.menuGroup .utilGroup .util02{position: absolute;top: 7px;left: 20px;} 
}


.dim{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:1000;}

 
/* footer */
.footer{position:relative; background:#343536; z-index:100;}
.footer .familySite{border-bottom:1px solid #484848;}
.footer .familySite .form_select{float:left;position:relative; z-index:1;}
.footer .familySite .form_select>button{width:180px;padding: 18px 39px 18px 20px;border-right:1px solid #47494a; color:#999999;font-size: 14px;}
.footer .familySite .form_select:first-child>button{border-left:1px solid #484848;}
.footer .familySite .form_select .linkList{display:none; position:absolute; bottom:48px; left:0; width:100%; max-height:375px; padding:5px 0; background:#2e2d34; border:1px solid #484848; overflow-y:auto;}
.footer .familySite .form_select .linkList a{display:block; padding:5px 10px; color:#6c6c6c; font-size:14px;}
.footer .familySite .form_select .linkList a:hover{color:#eee;}
.footer .familySite .form_select:after{content:""; display:block; position: absolute; top:22px; right:20px; width:10px; height:10px; border:solid #6d6d71; border-width: 2px 0px 0px 2px;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg);
}
.footer .familySite .form_select.is-opened:after{top:17px; right:20px; border-width:2px 0 0 2px;
    -webkit-transform:rotate(-135deg);
    -moz-transform:rotate(-135deg);
    -ms-transform:rotate(-135deg);
    transform:rotate(-135deg);
}
.footer .familySite .form_select.is-opened .linkList{display: block;}
.footer .familySite .link{display:block; color:#6c6c6e; font-size:14px; font-weight:200; line-height:50px; float: right;
    -webkit-transition:color 0.3s ease;
    -moz-transition:color 0.3s ease;
    -ms-transition:color 0.3s ease;
    transition:color 0.3s ease;
}
.footer .familySite .link:hover{color:#fefefe;}

.footer .f_info{position:relative; padding:35px 100px 35px 180px; color:#979797;}
.footer .tit{position:absolute; top:50px; left:0; width:151px; height:29px; background:url(../img/f_logo.png) no-repeat top center; font-size:0; text-indent:-99999px; background-size:151px 29px;}
.footer .addr li{width: 50%;float: left;line-height: 180%;font-size: 14px;font-weight: 200;}
.footer .addr li span{font-weight: 500;}
.footer address{margin-top:10px; color:#777777;font-weight: 200;font-size: 12px;}

@media screen and (max-width:1200px){
	.footer .inner{padding: 0;width: 100%;}
    .footer .familySite{position:relative;}
    .footer .familySite .inner{margin:0;width: 100%;}
	.footer .familySite .box{display: block;}
	.footer .familySite .form_select{width: 50%;}
    .footer .familySite .form_select>button{width:100%; height:32px;  border-top:1px solid #3f3f3f; font-size:12px;font-weight: 200;text-align: left;padding:10px 20px;}
    .footer .familySite .form_select:first-child>button{border-left:0;}
    .footer .familySite .form_select.is-opened>button{border-top:0;}

    .footer .familySite .form_select .linkList{bottom:32px; border-width:1px 0 0 0;border-bottom:1px solid #484848;}
	.footer .familySite .form_select .linkList a{font-size: 12px;padding: 10px 20px;}
    .footer .familySite .form_select:after{content:""; display:block; position: absolute; top:12px; right:20px; width:10px; height:10px; border:solid #6d6d71; border-width: 1px 0px 0px 1px;}
	
	.footer .f_info{padding: 20px;  font-size:12px;position: relative;}
    .footer .tit{position: relative; top:0; left:0; width:107px; height:20px; background-image:url(../img/f_logo_m.png); background-size:107px 20px;margin-bottom: 20px;}
	.footer .addr li{float: none;width: 100%;font-size: 11px;}
    .footer address{margin-top:10px;font-size: 11px;}
    .footer address span{display:block;}
	.footer .familySite .link{position: absolute;top:34px;right: 20px;z-index: 90;}
}