/* common */
.w1300{width: 1300px; margin: 0 auto;}
#wrap{width: 100%; overflow: hidden; position: relative;}
/* common */

/* header */
#header{width: 100%; background: #fff;}
.h-wrap{height: 110px; padding: 0 45px; box-sizing:border-box; border-bottom: 1px solid #ddd;}
.logo{width: 228px; margin: 19px 140px 0 0; float: left;}
.logo a{height: 82px; display: block;}
.logo a img{width: 100%; display: block;}
.gnb{width: 1100px; float: left;}
.depth01{width: 100%; margin: 0; padding: 0;}
.depth01 > li{width: 16.6%; float: left; text-align: center; position: relative;}
.depth01 > li:nth-of-type(4){width: 17%;}
.depth01 > li > a{font-size: 20px; line-height:109px; letter-spacing:0; font-weight: 500; color: #333; display: block;}
.gnbBg{display: none; height: 250px; top: 109px; left: 0; width: 100%; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; box-sizing:border-box; z-index: 4; position: absolute; background: #fff;}
.depth02{display: none; height: 250px; padding: 25px 0; top: 109px; left: 0; width: 100%; border: 1px solid #ddd; border-left: 0; position: absolute; z-index: 5; box-sizing:border-box; background: #fff;}
.depth02.bdL{border-left: 1px solid #ddd;}
.depth02 li{margin-bottom: 15px;}
.depth02 li:last-of-type{margin-bottom: 0;}
.depth02 li a{font-size: 15px; line-height:20px; letter-spacing:-0.05em; font-weight: 400; color: #666; word-break:keep-all;}
.depth01 > li:hover > a{color: #00a0e9;}
.depth01 > li:hover .depth02{background: #00a0e9; border-top: 0;}
.depth01 > li:hover .depth02:after{width: 12px; margin-left: -6px; height: 7px; top: 0; left: 50%; content:""; position: absolute; z-index: 2; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.uvfpubbytor.xe%2Sjfei%2Svzntrf2%2Sqrcgu02Neebj.cat) center center no-repeat; background-size: cover;}
.depth01 > li:hover .depth02 li a{color: rgba(255,255,255,0.7);}
.depth01 > li:hover .depth02 li a:hover{color: #fff;}

.h-right{margin-top: 31px; float: right; font-size: 0;}
.h-member{padding-top: 18px; margin-right: 30px; display: inline-block; vertical-align: top; font-size: 0; box-sizing:border-box;}
.h-member > a{font-size: 15px; line-height:1; letter-spacing:0; font-weight: 400; color: #666; display: inline-block; vertical-align: top;}
.h-member > span{margin: 0 10px; font-size: 15px; line-height:1; letter-spacing:0; font-weight: 400; color: #747474; display: inline-block; vertical-align: top;}
.menu{width: 50px; display: inline-block; vertical-align: top;}
.menu a{height: 50px; display: block;}
.menu a img{width: 100%; display: block;}
/* header */

/* quick */
#quick{bottom: 90px; left: 50%; margin-left: 900px; width: 50px; position: fixed; z-index: 5;}
#quick a{height: 50px; display: block;}
#quick a img{width: 100%; display: block;}
/* quick */

/* footer */
#footer{width: 100%; background: #fff; border-top: 1px solid #e5e5e5;}
.f-wrap{padding: 45px 0; width: 100%; max-width:1300px; margin: 0 auto; box-sizing:border-box;}
.f-right{width: 230px; margin-top: 5px; float: right;}
.family{margin-bottom: 20px; position: relative;}
.family > p{padding: 0 40px 0 20px; font-size: 14px; line-height:43px; height: 45px; letter-spacing:0; font-weight: 400; color: #555; box-sizing:border-box; border: 1px solid #ddd; position: relative; cursor:pointer;}
.family > p span{top: 18px; right: 18px; width: 12px; height: 8px; position: absolute; display: block;}
.family > p span img{width: 100%; display: block;}
.family > p span img.on{display: none;}
.family > p.on span img.off{display: none;}
.family > p.on span img.on{display: block;}
.family > ul{display: none; padding: 20px; bottom: 45px; left: 0; width: 100%; z-index: 2; position: absolute; box-sizing:border-box; border: 1px solid #ddd; border-bottom: 0; background: #fff;}
.family > ul li{margin-bottom: 10px;}
.family > ul li:last-of-type{margin-bottom: 0;}
.family > ul li a{font-size: 14px; line-height:24px; letter-spacing:0; font-weight: 400; color: #555; display: block;}
.f-visitant{font-size: 0;}
.f-visitant > article{margin-right: 10px; font-size: 15px; line-height: 25px; letter-spacing:-0.02em; font-weight: 400; color: #333; display: inline-block; vertical-align: top;}
.f-visitant > article:last-of-type{margin-right: 0;}
.f-visitant > article b{padding: 0 15px; font-size: 14px; line-height:25px; border-radius: 10px; margin-right: 5px; letter-spacing:0; font-weight: 500; color: #fff; display: inline-block; vertical-align: top; box-sizing:border-box;}
.f-visitant > article.all b{background: #00a0e9;}
.f-visitant > article.day b{background: #1c5cb0;}
.f-logo{width: 186px; margin-right: 80px; float: left;}
.f-logo > img{width: 100%; display: block;}
.f-adr{float: left;}
.f-adr > p{font-size: 15px; line-height:25px; letter-spacing:0; font-weight: 400; color: #888;}
.f-adr > p em{height: 10px; margin: 8px 10px 0; width: 1px;  background: #dadada; display: inline-block; vertical-align: top; font-style: normal;}
.f-adr > span.copy{font-size: 14px; line-height:25px; letter-spacing:0; font-weight: 400; color: #888; display: block;}
.f-nav{margin-bottom: 5px; font-size: 0;}
.f-nav a{font-size: 16px; line-height: 22px; letter-spacing:0; font-weight: 400; color: #222; display: inline-block; vertical-align: top;}
/* footer */




.pc{display: block;}
.mo{display: none;}
/* 미디어 쿼리 */
@media all and ( max-width: 1800px ) {
/* header */
.logo{margin: 19px 60px 0 0;}
.gnb{width: 1000px;}
/* header */

/* quick */
#quick{left: auto; right: 0; margin-left: 0;}
/* quick */
}

@media all and ( max-width: 1600px ) {
/* header */
.h-wrap{padding: 0 20px;}
.logo{margin: 19px 20px 0 0;}
.gnb{width: 850px;}
/* header */
/* quick */
#quick{left: auto; right: 0; margin-left: 0;}
/* quick */
}

@media all and ( max-width: 1400px ) {
/* header */
.h-wrap{padding: 0 20px;}
.gnb{width: 780px;}
.depth01 > li > a{font-size: 18px;}
.depth02 li a{font-size: 14px;}
/* header */
/* quick */
#quick{left: auto; right: 0; margin-left: 0;}
/* quick */
}

@media all and ( max-width: 1300px ) {
/* common */
.w1300{width: 100%;}
/* common */

/* header */
.logo{width: 180px; margin: 23px 10px 0 0;}
.logo a{height: 64px; display: block;}
.gnb{width: 680px; float: left;}

.h-right{margin-top: 36px;}
.h-member{padding-top: 15px; margin-right: 20px;}
.h-member > a{font-size: 11px;}
.h-member > span{margin: 0 10px; font-size: 12px;}
.menu{width: 40px;}
.menu a{height: 40px;}
/* header */
/* quick */
#quick{left: auto; right: 0; margin-left: 0;}
/* quick */
}

@media all and ( max-width: 1100px ) {
/* header */
.logo{width: 180px; margin: 23px 10px 0 0;}
.logo a{height: 64px; display: block;}
.logo a img{width: 100%; display: block;}
.gnb{width: 580px; float: left;}
.depth01 > li > a{font-size: 16px;}
.depth02 li a{font-size: 13px;}
/* header */
/* quick */
#quick{left: auto; right: 0; margin-left: 0;}
/* quick */
}

@media all and ( max-width: 1000px ) {
/* common */
.w1300{width: 96%;}
/* common */

/* header */
.pc{display: none;}
.mo{display: block;}
.mo-h-wrap{padding-left: 30px; height: 110px; box-sizing:border-box;}
.mo-logo{width: 228px; margin-top:18px; float: left;}
.mo-logo a{height: 82px; display: block;}
.mo-logo a img{width: 100%; display: block;}
.mo-menu{width: 120px; float: right;}
.mo-menu a{height: 110px; display: block;}
.mo-menu a img{width: 100%; display: block;}
.moGnb{position: absolute; top: 0; right: -100%; width: 100%; height: 100%; z-index: 10; background: #fff;}
.moMember{padding: 48px 80px 0 30px; height: 130px; background: #00a0e9; box-sizing:border-box;}
.moMember > a{font-size: 35px; line-height:1; letter-spacing:0; font-weight: 500; color: #fff; display: inline-block; vertical-align: top;}
.moMember > span{margin: 0 20px; font-size: 35px; line-height:1; letter-spacing:0; font-weight: 500; color: #fff; display: inline-block; vertical-align: top;}
.moClose{top: 44px; right: 30px; width: 40px; position: absolute; z-index: 1;}
.moClose a{height: 39px; display: block;}
.moClose a img{width: 100%; display: block;}
.moDepth01{width: 100%; margin: 0; padding: 0;}
.moDepth01 > li{border-bottom: 1px solid #e4e4e4;}
.moDepth01 > li > a{padding: 0 30px; font-size: 40px; line-height:134px; letter-spacing:0; font-weight: 500; color: #333; display: block; position: relative;}
.moDepth01 > li > a > span{right: 30px; width: 29px; height: 17px; margin-top: -8.5px; top: 50%; display: block; position: absolute;}
.moDepth01 > li > a > span img{width: 100%; display: block;}
.moDepth01 > li > a > span img.on{display: none;}
.moDepth01 > li.on > a > span img.off{display: none;}
.moDepth01 > li.on > a > span img.on{display: block;}
.moDepth02{display: none; padding: 30px; width: 100%; background: #f7f7f7; border-top: 1px solid #e4e4e4; box-sizing:border-box;}
.moDepth02 li a{font-size: 35px; line-height:95px; letter-spacing:0; font-weight: 500; color: #777; display: block;}
/* header */

/* footer */
.f-wrap{padding: 60px 0 50px; width: 96%;}
.f-right{width: 100%; margin-top: 0; float: none;}
.family{margin-bottom: 30px; position: relative;}
.family > p{padding: 0 70px 0 40px; font-size: 22px; line-height:63px; height: 65px; letter-spacing:0; font-weight: 400; color: #555; box-sizing:border-box; border: 1px solid #ddd; position: relative; cursor:pointer;}
.family > p span{top: 24px; right: 40px; width: 23px; height: 16px; position: absolute; display: block;}
.family > ul{display: none; padding: 20px; bottom: 65px; left: 0; width: 100%; z-index: 2; position: absolute; box-sizing:border-box; border: 1px solid #ddd; border-bottom: 0; background: #fff;}
.family > ul li a{font-size: 22px; line-height:32px; letter-spacing:0; font-weight: 400; color: #555; display: block;}
.f-visitant{font-size: 0;}
.f-visitant > article{margin-right: 20px; font-size: 30px; line-height: 40px; letter-spacing:-0.02em; font-weight: 400; color: #333; display: inline-block; vertical-align: top;}
.f-visitant > article:last-of-type{margin-right: 0;}
.f-visitant > article b{padding: 0 30px; font-size: 25px; line-height:40px; border-radius: 20px; margin-right: 5px; letter-spacing:0; font-weight: 500; color: #fff; display: inline-block; vertical-align: top; box-sizing:border-box;}
.f-visitant > article.all b{background: #00a0e9;}
.f-visitant > article.day b{background: #1c5cb0;}
.f-logo{display: none;}
.f-adr{margin-top: 50px; width: 100%; float: none;}
.f-adr > p{font-size: 22px; line-height:35px; letter-spacing:0; font-weight: 400; color: #888;}
.f-adr > p em{height: 18px; margin: 9px 20px 0; width: 1px;  background: #dadada; display: inline-block; vertical-align: top; font-style: normal;}
.f-adr > p span {display:block;}
.f-adr > p span em {display:none;}
.f-adr > span.copy{font-size: 22px; line-height:35px; letter-spacing:0; font-weight: 400; color: #888; display: block;}
.f-nav{margin-bottom: 10px; font-size: 0;}
.f-nav a{font-size: 25px; line-height: 1; letter-spacing:0; font-weight: 400; color: #222; display: inline-block; vertical-align: top;}
/* footer */
/* quick */
#quick{left: auto; right: 0; margin-left: 0;}
/* quick */

}

@media all and ( max-width: 760px ) {
/* header */
.mo-h-wrap{padding-left: 3.9473684211vw; height: 14.4736842105vw;}
.mo-logo{width: 30vw; margin-top:2.3684210526vw;}
.mo-logo a{height: 10.7894736842vw;}
.mo-menu{width: 15.7894736842vw;}
.mo-menu a{height: 14.4736842105vw;}
.moMember{padding: 6.3157894737vw 10.5263157895vw 0 3.9473684211vw; height: 17.1052631579vw;}
.moMember > a{font-size: 4.6052631579vw;}
.moMember > span{margin: 0 2.6315789474vw; font-size: 4.6052631579vw;}
.moClose{top: 5.7894736842vw; right: 3.9473684211vw; width: 5.2631578947vw;}
.moClose a{height: 5.1315789474vw;}
.moDepth01 > li > a{padding: 0 3.9473684211vw; font-size: 5.2631578947vw; line-height:17.6315789474vw;}
.moDepth01 > li > a > span{right: 3.9473684211vw; width: 3.8157894737vw; height: 2.2368421053vw; margin-top: -1.1184210526vw;}
.moDepth02{padding: 3.9473684211vw;}
.moDepth02 li a{font-size: 4.6052631579vw; line-height:12.5vw;}
/* header */

/* footer */
.f-wrap{padding: 7.8947368421vw 0 6.5789473684vw;}
.family{margin-bottom: 3.9473684211vw;}
.family > p{padding: 0 9.2105263158vw 0 5.2631578947vw; font-size: 2.8947368421vw; line-height:8.2894736842vw; height: 8.5526315789vw;}
.family > p span{top: 3.1578947368vw; right: 5.2631578947vw; width: 3.0263157895vw; height: 2.1052631579vw;}
.family > ul{padding: 2.6315789474vw; bottom: 8.5526315789vw;}
.family > ul li{margin-bottom: 1.3157894737vw;}
.family > ul li a{font-size: 2.8947368421vw; line-height:4.2105263158vw;}
.f-visitant > article{margin-right: 2.6315789474vw; font-size: 3.9473684211vw; line-height: 5.2631578947vw;}
.f-visitant > article b{padding: 0 3.9473684211vw; font-size: 3.2894736842vw; line-height:5.2631578947vw; border-radius: 2.6315789474vw; margin-right: 0.6578947368vw;}
.f-adr{margin-top:  6.5789473684vw;}
.f-adr > p{font-size: 2.8947368421vw; line-height:4.6052631579vw;}
.f-adr > p em{height: 2.3684210526vw; margin: 1.1842105263vw 2.6315789474vw 0;}
.f-adr > span.copy{font-size: 2.8947368421vw; line-height:4.6052631579vw;}
.f-nav{margin-bottom: 1.3157894737vw;}
.f-nav a{font-size: 3.2894736842vw;}
/* footer */
/* quick */
#quick{bottom: 23.4375vw; width: 7.8125vw;}
#quick a{height: 7.8125vw;}
/* quick */

}