@charset "utf-8";

@media screen and (min-width: 2000px) {
	html, body {font-size: .5vw !important;}
}

.inner {max-width:158rem; width:100%; margin:0 auto; }

/* 서브 기능 관리버튼 수정 */
body.sub ._fnctWrap ._fnctAdmin,
body.sub.edit ._objTool  {left: 0 !important; top: auto !important; right: auto !important; bottom: 0 !important;}
body.sub.edit ._multipleDivObjTool {top: 0 !important;}

.sub #_contentBuilder ._objTag,
.sub #_contentBuilder ._objHtml,
.sub #_contentBuilder ._objImage,
.sub #_contentBuilder ._objWidget,
.sub #_contentBuilder ._objHeading {z-index: auto !important;}

/* [S] 맨위로*/
.btn-top{position: fixed; right: 1rem; bottom: 3rem; width: 6rem; height: 6rem;opacity: 0;transition: .25s;z-index: 100;}
.btn-top.fix {bottom: 5rem;opacity: 1;}
.btn-top button{width: 100%; height: 100%; background: url(../../images/common/ic-top-button.png) no-repeat center center; font-size: 0;}

@media screen and (min-width: 1921px) {
	.btn-top button{width: 6rem;height: 6rem;background-size: cover;}
}
/* [E] 맨위로*/

/* [S] 스크롤바*/
::-webkit-scrollbar {width: 1rem !important;height: 1rem !important;}
/* [E] 스크롤바*/


/* [S] header */
header {position: absolute; left: 0; top: 0; z-index: 100; width: 100%; transition: background .35s;}
header .header-inner {display: flex; justify-content: space-between; align-items: center; max-width:182rem; width:100%; height: 9rem; margin:0 auto;}
header .logo {width: 16.4rem;}
header .logo .color {display: none;}
header .logo img {width: 100%;}
header .logo a {font-size: 0;}
header .sub-logo {display: flex; align-items: center;}
header .sub-logo .name {position: relative; margin-left: 2rem; padding-left: 2rem; font-family: sl; font-size: 2rem; color: #ffffff;}
header .sub-logo .name::before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);width: 1px; height: 1rem; background: #fff;}
header .sub-logo .name span {position: relative; top: .2rem;}
header .util {display: flex;}
header .util .link-btns {display: flex; align-items: center;}
header .util .link-btns li {margin-left: 2.8rem;}
header .util .link-btns a {display: flex; align-items: center; font-family: sm; font-size: 1.8rem; color: #fff;}
header .util .link-btns a:hover {color: #02f3c6;}
header .util .link-btns .ico a::before {content: ''; position: relative; top: -.2rem; display: block; margin-right: 1.8rem;}
header .util .link-btns .ico1 a::before {width: 2.3rem; height: 2.2rem; background: url(../../images/common/ic-header-util1.png) no-repeat center / 2.3rem auto;}
header .util .link-btns .ico1 a:hover::before {background: url(../../images/common/ic-header-util1-on.png) no-repeat center / 2.3rem auto;}
header .util .link-btns .ico2 a::before {width: 3rem; height: 2.1rem; background: url(../../images/common/ic-header-util2.png) no-repeat center / 3rem auto;}
header .util .link-btns .ico2 a:hover::before {background: url(../../images/common/ic-header-util2-on.png) no-repeat center / 3rem auto;}

header .head-convert {position: relative; padding-left: 2.5rem;margin-right: .3rem;z-index: 1;}
header .head-convert #google_translate_element {display: none;}
header .head-convert .list-convert {overflow: hidden; position: absolute; left: auto; top: 170%; width: 11.6rem; max-height: 0; background: #fff; border: 1px solid #fff; border-radius: .5rem; transition: max-height .5s; opacity: 0;}
header .head-convert .list-convert.on {max-height: 150px; border: 1px solid #d1d1d1; opacity: 1;}
header .head-convert .list-convert ul {padding: .5rem 0;}
header .head-convert .list-convert li {padding: .3rem 0;}
header .head-convert .list-convert li:last-child {border: 0}
header .head-convert > button {position: relative; padding: 0 1.9rem 0 3.9rem; font-family: pm; font-size: 1.8rem; color: #fff;}
header .head-convert > button::before {content: ''; position: absolute; left: 0; top: 0rem; width: 2.5rem; height: 2.5rem; background: url('../../images/common/ic-lang.png') no-repeat center / cover;}
header .head-convert > button::after {content: ''; position: absolute; right: 0; top: 1.1rem; width: .7rem; height: .5rem; background: url('../../images/common/arr-lang-white.png') no-repeat center;}
header .head-convert .tip {position: absolute; left: -99999px; top: 170%; width: 41.6rem; padding: 1rem 1.5rem; background: rgba(255,255,255,1); border-radius: .5rem; font-family: 'ppr'; font-size: 1.4rem; border: 1px solid #d1d1d1; color: #666; opacity: 0; transition: opacity .75s;}
header .head-convert .tip.on {left: auto; opacity: 1;}
header .head-convert .tip button {display: inline-block; margin-top: .5rem; padding: .5rem 1rem; background: #003477; border-radius: .5rem; color: #fff;}

@media screen and (max-width:1000px) {
	header .head-convert > button {font-size: 1.6rem;}
	header .head-convert > button::before {top: -.5rem;}
	header .head-convert > button::after {top: .6rem;}
}

@media screen and (max-width:768px) {
	.main header .head-convert {padding-left: 1rem;}
	.main header .head-convert > button {padding: 0 1.5rem 0 2.3rem; text-indent: -99999px;}
	.main header .head-convert .list-convert {left: -2.8rem;}
	.main header .head-convert .tip.on {left: -12rem; width: 27.6rem;}
}


.main header {position: absolute;}

/* .main header.scrolled {background: #fff; box-shadow: 0 .2rem 1rem rgba(0,0,0,.05);}
.main header.scrolled .logo .color {display: block;}
.main header.scrolled .logo .white {display: none;}
.main header.scrolled .sub-logo .name span {color: #222222;}
.main header.scrolled .sub-logo .name::before {background: #222222;}
.main header.scrolled .util a {color: #222222;}
.main header.scrolled .util a:hover {color: #00aace;}
.main header.scrolled .util .ico1 a::before {background: url(../../images/common/ic-header-util1-color.png) no-repeat center / 2.3rem auto;}
.main header.scrolled .util .ico1 a:hover::before {background: url(../../images/common/ic-header-util1-color-on.png) no-repeat center / 2.3rem auto;}
.main header.scrolled .util .ico2 a::before {background: url(../../images/common/ic-header-util2-color.png) no-repeat center / 3rem auto;}
.main header.scrolled .util .ico2 a:hover::before {background: url(../../images/common/ic-header-util2-color-on.png) no-repeat center / 3rem auto;} */

@media screen and (max-width:1800px) {
	.main header .header-inner {padding:0 2rem;}
}

@media screen and (max-width:1000px) {
	.main header .logo {width: 14rem;}
}

@media screen and (max-width:768px) {
	.main header .header-inner {height: 6.5rem;}
	.main header .logo {width: 11rem;}
	.main header .util .link-btns a {font-size: 1.4rem;}
	.main header .util .link-btns li {margin-left: 2rem;}
	.main header .util .link-btns .ico a::before {margin-right: 1rem;}
	.main header .util .link-btns .ico1 a::before {width: 2rem; height: 1.8rem; background-size: 2rem auto !important;}
	.main header .util .link-btns .ico2 a::before {width: 2.5rem; height: 1.8rem; background-size: 2.5rem auto !important;}
}

.sub header .sub-logo .logo {flex-shrink: 0;}
.sub header .sub-logo .name {margin-right: 1rem;}
.sub header .util .link-btns a:hover {color: #45d5ff;}
.sub header .util .link-btns .ico1 a:hover::before {background-image: url(../../images/common/ic-header-util1-2-on.png)}
.sub header .util .link-btns .ico2 a:hover::before {background-image: url(../../images/common/ic-header-util2-2-on.png)}

@media screen and (max-width:1800px) {
	.sub header .header-inner {padding:0 2rem;}
}

@media screen and (max-width:1000px) {
	.sub header .util .link-btns li {margin-left: 1.8rem;}
	.sub header .util .link-btns .ico a::before {margin-right: 1rem;}
}

@media screen and (max-width: 970px) {
	.sub header .head-convert {padding-left: 1rem;}
	.sub header .head-convert > button {padding: 0 1.5rem 0 2.3rem; text-indent: -99999px;}
	.sub header .head-convert .list-convert {left: -2.8rem;}
	.sub header .head-convert .tip.on {left: -12rem; width: 27.6rem;}
}

@media screen and (max-width:850px) {
	.sub header .logo {width: 15rem;}
	.sub header .sub-logo .name {margin-left: 1.5rem;padding-left: 1.5rem;font-size: 1.7rem;}
	
}

@media screen and (max-width:768px) {
	.sub header .header-inner {height: 8.3rem;}
	.sub header .logo {width: 11.2rem;}
	.sub header .sub-logo .name {margin-left: 1rem;padding-left: 1rem;font-size: 1.4rem;}
	.sub header .util .link-btns li {margin-left: 2.5rem;}
	.sub header .util .link-btns a {flex-direction: column;align-items: center;font-size: 1.2rem;}
	.sub header .util .link-btns a span {display: none;}
	.sub header .util .link-btns .ico a::before {margin-right: 0;}
	.sub header .util .link-btns .ico1 a::before {width: 2rem; height: 1.8rem; margin-bottom: 0;background-size: 2rem auto !important;}
	.sub header .util .link-btns .ico2 a::before {width: 2.5rem; height: 1.8rem; margin-bottom: 0;background-size: 2.5rem auto !important;}
}

/* [E] header */

/* [S] footer */
footer {position: relative; background: #191C2E; padding:4rem 0;}
footer .footer-inner {max-width:182rem; width:100%; margin:0 auto; display: flex; flex-direction: row-reverse; justify-content: space-between;}
footer .right {display: flex; flex-direction: column-reverse; justify-content: start;}
footer .footer-logo {display: flex; justify-content: end;}
footer .footer-sns {margin-bottom: 1.7rem;}
footer .footer-sns ul{display: flex;}
footer .footer-sns .fb {background:url(../../images/common/ic-fb.png) no-repeat center / 1.1rem auto;}
footer .footer-sns .insta {background:url(../../images/common/ic-insta.png) no-repeat center / 2.2rem auto;}
footer .footer-sns .youtube {background:url(../../images/common/ic-youtube.png) no-repeat center / 2.1rem auto;}
footer .footer-sns .blog {background:url(../../images/common/ic-blog.png) no-repeat center / 4.4rem auto;}
footer .footer-sns a {display: inline-block; text-indent: -9999rem; width: 6rem; height:4rem;}
footer .address {position: relative; margin-bottom: 1.5rem;}
footer .address li {color:#9198BF; font-size: 1.8rem; font-family: sl; margin-bottom: 0.5rem; display: flex;}
footer .address li span {color: #9198BF;}
footer .address li:last-child {margin-bottom: 0;}
footer .address strong {font-family: sm; font-size: 1.8rem; color:#fff; display: inline-block; width: 11.5rem; flex-shrink: 0;}
footer .copyright {font-size: 1.6rem; color:#5B5D69; font-family: sl;}

@media screen and (max-width:1800px) {
	footer .footer-inner {padding:0 2rem;}
}

@media screen and (max-width:1200px) {
	footer .address li {font-size: 1.6rem;}
	footer .address strong {font-size: 1.6rem; width: 10.5rem;}
	footer .copyright {font-size: 1.4em;}
}

@media screen and (max-width:768px) {
	footer {padding:3.7rem 0 4rem 0;}
	footer .footer-inner {flex-direction: column-reverse;}
	footer .address {display: grid; grid-template-columns: 1fr 1fr; }
	footer .address li {justify-content: center; margin-bottom: 1rem;}
	footer .address li:first-child {grid-area:1 / span 2; flex-direction: column; align-items: center;}
	footer .address li:nth-child(2) {justify-content: end; margin-right: 10px;}
	footer .address li:nth-child(3) {justify-content: start; margin-left: 10px;}
	footer .address strong {width: auto; margin-right: 7px;}
	footer .address li:first-child strong {margin-right: 0;}
	footer .right {align-items: center;}
	footer .left {margin-bottom: 3.7rem;}
	footer .footer-sns {margin-bottom: 0.5rem;}
	footer .footer-sns .fb {background-size:0.8rem;}
	footer .footer-sns .insta {background-size:1.7rem;}
	footer .footer-sns .youtube {background-size:1.8rem;}
	footer .footer-sns .blog {background-size:3.5rem;}
	footer .copyright {text-align: center;}
}

@media screen and (max-width:600px) {
	footer .footer-logo {width: 15rem;}
	footer .footer-sns a {width: 5rem;}
	footer .address li {font-size: 1.6rem;}
	footer .address strong {font-size: 1.6rem;}
	footer .copyright {font-size: 1.4rem;}
}

@media screen and (max-width: 500px) {
	footer {transform: translateY(-1px);}
	footer::before {content: '';position: absolute;left: 0;bottom: -1px;width: 100%;height: 1px;background: #191C2E;}
}

/* [E] footer */