@charset "utf-8";
@import url('/design/common/css/Pretendard.css');
@import url('./font/EliceDXBaeumOTF_Regular.css');
@import url('./font/EliceDXBaeumOTF_Bold.css');
@import url('./font/SUIT.css');

::-webkit-scrollbar {width:18px;}
::-webkit-scrollbar-thumb {border:5px solid #fff; border-radius:20px; background:#ccc;}
::-webkit-scrollbar-track {background:#fff; border-radius:20px;}

* {box-sizing: border-box;}
html { word-break: keep-all; word-wrap:break-word; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; -o-text-size-adjust: none; font-size:1px; scrollbar-face-color:#c1c1c1; scrollbar-shadow-color:#f1f1f1; scrollbar-highlight-color:#f1f1f1; scrollbar-arrow-color:#c1c1c1; overflow-x:hidden !important; }
body {color:#323232; word-break:keep-all; word-wrap:normal; overflow-x: hidden;font-weight:400;font-size:18px;line-height:1.7; letter-spacing:-0.2px;font-family: 'Pretendard', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;}
input, select, textarea { font-family: 'Pretendard'; font-size:17px; }
button, input[type="text"], input[type="submit"] { font-size:18px; font-family:'Pretendard',sans-serif; -webkit-appearance: none; -webkit-border-radius: 0;}
li {list-style-type:none;}
a {color: inherit;}

@media all and (max-width:768px){
    html { font-size:0.9px; }
}
@media all and (max-width:480px){
    html { font-size:0.85px; }
}

.wrap {width: calc(100% - 80rem); max-width: 1600rem;margin: 0 auto;}
@media all and (max-width:980px) {
    .wrap {width: calc(100% - 60rem);}
}
@media all and (max-width:720px) {
    .wrap {width: calc(100% - 40rem);}
}

/* PC내비 */
#header > .wrap {display: flex;justify-content: space-between;align-items: center;height: 100rem;}
#header .logo a {display: block; text-indent: -9999px; background: url('../img/layout/h_logo_231211.png') no-repeat center center; background-size: contain; width: 245rem; height: 45rem;}

.pc_nav {display: flex;justify-content: space-between;align-items: center;}
.pc_nav > nav {margin-right: 80rem;}
.pc_nav .depth01{height: 100%;}
.pc_nav .depth01 > li{display: inline-block; margin-right: 80rem; }
.pc_nav .depth01 > li:last-child{margin-right: 0;}
.pc_nav .depth01 > li > a{font-family: 'Elice DX Baeum OTF', sans-serif;font-size: 22rem;font-weight: 700; display: block; line-height: 100rem;color: #323232;}

.pc_nav .gnb{display: none;transition: 0.2s;border-top: 1px solid rgba(0,0,0,0.1); border-bottom: 2px solid #ff9600; box-shadow: 0px 20px 20px rgba(0,0,0,0.1); position: absolute; width: 100%; left: 0; top: 100rem; z-index: 100; background: #fff;}

.pc_nav .gnb .gnb_wrap{display: flex; max-width: 1400rem; margin: 0 auto;}
.pc_nav .gnb .gnb_tit{width: 30%; padding: 40rem 10rem 50rem; border-right: 1px dashed rgba(0,0,0,0.1);}
.pc_nav .gnb .gnb_tit h2{font-family: 'Elice DX Baeum OTF', sans-serif;margin-bottom: 15rem; font-size: 30rem; font-weight: 700;}

.pc_nav .gnb .gnb_tit p{font-size: 17rem; line-height: 1.5;}

.pc_nav .depth02{width: 70%; padding: 40rem 0 30rem 50rem;}
.pc_nav .depth02 li{display: inline-block; margin-right: 20rem; margin-bottom: 20rem; width: calc((100% - 110rem)/ 4); }
.pc_nav .depth02 li a{color: #202026; font-size: 18rem; position: relative; padding: 9rem 0 9rem 20rem; display: block; background: #f5f5f5; border-radius: 7rem; transition: 0.2s;}
.pc_nav .depth02 li a:hover{background: #ff9600; font-weight: 500; color: #fff; border-radius: 7rem;}

.pc_nav .depth01 li a[target="_blank"] span{position: relative; padding-right: 22rem;  background: url('../img/content/t_blank.png') no-repeat right;}
.pc_nav .depth02 li a[target="_blank"]:hover span{background-image: url('../img/content/t_blank_wt.png');}

.pc_nav .lang {margin: 0 30rem 0 30rem;}
.pc_nav .lang a {font-family: 'Elice DX Baeum OTF', sans-serif; font-size: 17rem; font-weight: 700;line-height: 100rem;}

.h_sns {display: flex;flex-wrap: wrap;}
.h_sns > li:not(:first-child) {margin-left: 25rem;}
.h_sns > li > a {display:block; text-indent: -99999rem; width: 30rem;height: 30rem;background: url('../img/layout/h_snsicon.png') no-repeat;background-size:400%;}
.h_sns > li.instar > a {background-position: 0 0;}
.h_sns > li.fb > a {background-position: 33.5% 0;}
.h_sns > li.blog > a {background-position: 67% 0;}
.h_sns > li.ytube > a {background-position: 100% 0;}

.nav_open{display:block; background: url('../img/layout/navopen.png') no-repeat; width: 36rem; height: 20rem; text-indent: -9999px;background-size: contain;}

@media all and (max-width:1400px){
    .pc_nav .depth01 > li {margin-right: 60rem;}
}

@media all and (max-width:1270px) {
    .pc_nav {display: none;}
}

/* 모바일내비 */
#mnav_open {display: none;}
.mnav{display: none; position: fixed; right: 0; top: 0; width: 100%; height: 100%; z-index: 400;}
.mnav::before{content:''; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); transition:all 0.85s cubic-bezier(0.43, 0.03, 0.21, 1);}
.mnav nav{position: absolute; right: -100%; top: 0; background: #fff; width: 100%; max-width: 375rem; height: 100%; z-index: 20; transition: all 0.5s ease-in-out; transition-delay: 0.3s;}

.m_top{display: flex; flex-wrap: wrap;padding: 10rem;}
.m_top .lang{padding-left: 16rem; padding:2rem 10rem; width:100%; text-align:center; border-radius:50px; border:1px solid #ddd;}
.m_top .lang a{font-size: 20rem; color: #323232; font-family: 'Elice DX Baeum OTF', sans-serif; margin-right: 5rem;font-weight: 700;}

.m_sns {width: 100%;padding: 20rem}
.m_sns .h_sns {justify-content: center; margin: 0 auto;}
.m_sns .h_sns > li {margin: 0 12rem !important;}
.m_sns .h_sns > li > a {width: 35rem; height: 35rem;}

.mnav nav .m_logo{text-indent: -9999px; background: url('../img/layout/m_logo_231219.png') no-repeat center center; background-size:contain; width: 128rem; height: 40rem; margin: 10rem;}

.mnav nav .depth01{border-bottom: 1px solid #eee;}
.mnav nav .depth01 > li > a{display: block; font-family: 'Elice DX Baeum OTF', sans-serif; font-size: 20rem; font-weight: 400;color: #323232; padding: 10rem 26rem ; border-top: 1px solid #eee;  position: relative;}

.mnav nav .depth01 > li > a::before{position: absolute; content: ""; width: 9rem; height: 9rem; border-left: 2rem solid #323232; border-bottom: 2rem solid #323232; background: transparent; transform: rotate(-45deg); right: 20rem; top: 18rem;}

.mnav nav .depth01 > li.on > a{font-weight: 700;}
.mnav nav .depth01 > li.on > a::before{border-width: 3rem;transform: rotate(135deg);top:23rem;}
.mnav nav .depth01 > li.on > a + .depth02{display: block;}

.mnav nav .depth02{display: none; padding: 6rem; background: #f3f3f3; border-top: 1px solid #eee;}
.mnav nav .depth02 > li > a{display: block; color: #202026; font-size: 18rem; padding: 5rem 10rem 5rem 26rem;}
.mnav nav .depth02 > li > a span{position: relative; padding-left: 14rem;}
.mnav nav .depth02 > li > a span::before{position: absolute; content: ""; width: 4rem; height: 4rem; background: #ababab; left: 0; top: 50%; transform: translateY(-50%); border-radius: 50rem;}

.mnav nav .depth02 > li.on > a{text-decoration: underline; font-weight: 600;}
.mnav nav .depth02 > li.on > a span::before{background-color: #202026;}

.mnav .depth01 li a[target="_blank"] span{position: relative; padding-right: 22rem;  background: url('../img/content/t_blank_small.png') no-repeat right 4rem center; background-size: 14rem;}

#mnav_close{position: absolute; right: 14rem; top: 20rem; width: 40rem; height: 40rem; text-indent: -9999px;}
#mnav_close::before,
#mnav_close::after{position: absolute; content: ""; left: 50%; top: 0; width: 3rem; height: 30rem; background: #202026;  transform: rotate(45deg);}
#mnav_close::after{transform: rotate(135deg);}

@media all and (max-width:1270px) {
    #mnav_open {display: block;}
}

/*footer*/
#footer {background: #f8f8f8;padding:70rem 0 40rem;position: relative;}
#footer .wrap::after {content: '';display: block;clear: both;}
/* #footer .wrap > div:first-child {float:left;} */
/* #footer .wrap > div:last-child {float: right;} */
#footer .f_link {display: flex; flex-wrap: wrap; align-items: center;}
#footer .f_link li {margin-right: 36rem;line-height: 1;}
#footer .f_link li a {font-size: 18rem; font-weight: 600;}
#footer .f_link li.privacy a {text-decoration: underline;}
#footer .address {margin-top: 35rem;}
#footer .address p {font-size: 16rem;margin-bottom: 16rem;line-height: 1.3;}
#footer .address p strong {font-weight: 600;margin-right: 16rem;}
#footer .address p strong:not(:first-child) {margin-left: 36rem;}
#footer .copyright {font-size: 14rem; font-weight: 600; color: #8c8b8b;margin-bottom: 35rem;line-height: 1.3;}
#footer .f_sns > div {display: flex;flex-wrap: wrap;align-items: center;line-height: 1;}
#footer .f_sns p.tit {font-size: 24rem;font-weight: 800;}
#footer .f_sns p.txt {font-size:16rem;padding-left: 44rem;position: relative;}
#footer .f_sns p.txt::before {content: '―';position: absolute;top: 0;left: 14rem;}
#footer .f_sns > ul {display: flex;flex-wrap: wrap;margin-top: 25rem;}
#footer .f_sns > ul > li:not(:first-child) {margin-left: 65rem;}
#footer .f_sns > ul > li > a {display:block;font-size: 14rem;font-weight: 600;padding-top: 50rem;position: relative;}
#footer .f_sns > ul > li > a::before {content: '';display: block;width: 40rem;height: 40rem;background: url('../img/layout/f_snsicon.png') no-repeat;background-size:400%;position: absolute;top: 0; left: 50%; transform: translateX(-50%);}
#footer .f_sns > ul > li.instar > a::before {background-position: 0 0;}
#footer .f_sns > ul > li.fb > a::before {background-position: 33.5% 0;}
#footer .f_sns > ul > li.blog > a::before {background-position: 67% 0;}
#footer .f_sns > ul > li.ytube > a::before {background-position: 100% 0;}

@media all and (max-width:1200px){
	#header > .wrap {height: 80rem;}

}

@media all and (max-width:970px){
	#footer .wrap{display: flex; flex-direction: column-reverse;}
    #footer .wrap > div {width: 100%;}
	#footer .wrap > div:last-child {margin-bottom:40rem;}


}
@media all and (max-width:480px){
    #footer .address p {margin-bottom: 10rem;font-size: 15rem;}
    #footer .address p strong {display:block;width: 100%;}
    #footer .address p strong:not(:first-child) {margin-left: 0;margin-top: 10rem;}
    #footer .copyright {font-size: 12rem;}
	#footer .wrap > div:last-child {margin-bottom:30rem;}

}
@media all and (max-width:400px) {
    #footer .f_sns > ul {justify-content: space-between;}
    #footer .f_sns > ul > li:not(:first-child) {margin-left: 10rem;}
}

.go_top{display: block; position: absolute; bottom: 295rem; right: 50rem; width: 64rem; height: 64rem; background: #323232; border-radius: 50rem; opacity: 0;z-index: 30;text-align: center; padding-top: 26rem;}
.go_top span {font-size: 16rem;font-weight: 500;color: #fff; text-align: center; padding-top: 18rem;position: relative;line-height: 1;}
.go_top span::before {position: absolute;content:'';display: block;width: 18rem;height: 11rem;background: url('../img/layout/gotop.png') no-repeat center; background-size: contain;top:0;left: 50%;transform: translateX(-50%);}
.go_top.fixed{bottom: 30rem; position: fixed;}

@media all and (max-width:1900px) {
    .go_top{right: 30rem; bottom:auto; top:-22rem;}
}

@media all and (max-width:970px) {
	.go_top {top:20rem;}
}

@media all and (max-width:500px) {
	.go_top {top:10rem;}
}

.go_link { position:fixed; display:flex; align-items:center; justify-content:center; right:10rem; bottom:30rem; width:150rem; height:150rem; font-weight:600; z-index:100; }
.go_link::before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url('/design/42gyeongsan/img/layout/quick_bg.png') no-repeat center/cover; animation: rotate-center 4s ease-in-out infinite both; }
.go_link div { align-content:center; text-align:center; width:110rem; height:110rem; background:#00babb; font-size:16rem; color:#fff; line-height:1.1; border-radius:50%; }
.go_link div p {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.go_link span { display:block; color:#fff443;}
@keyframes rotate-center {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@media all and (max-width:480px) {
  .go_link {zoom:80%;}
}

/*외국어*/
#header .wrap.en .logo a {background: url('/design/egsia/img/layout/h_logo-en.png') no-repeat center center; background-size:contain; width:300rem;}
#header .wrap.en .mnav nav .m_logo{background: url('/design/egsia/img/layout/m_logo-en.png') no-repeat center center; background-size:contain;}

#header .wrap.en .pc_nav .depth02{width: 70%;padding: 40rem 0 30rem 40rem;}
#header .wrap.en .pc_nav .depth02 li{display: inline-block;margin-right: 15rem;margin-bottom: 20rem;width: calc((100% - 45rem)/ 3);}
#header .wrap.en .pc_nav .depth02 li a{color: #202026; font-size: 18rem; position: relative; padding: 9rem 15rem 9rem 15rem; display: block; background: #f5f5f5; border-radius: 7rem; transition: 0.2s;}


@media all and (max-width:1115px) {
	#footer .wrap.en{display: flex; flex-direction: column-reverse;}
	#footer .wrap.en > div:last-child {margin-bottom:40rem;}

}


@media all and (max-width:500px) {
    #footer .wrap.en .address p {font-size: 15rem;}
	#footer .wrap.en > div:last-child {margin-bottom:30rem;}
}
