@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700&display=swap&subset=korean');

@font-face {
    font-family: 'BitgoeulGwangju';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_seven@1.2/Bitgoeul_Light.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'BitgoeulGwangju';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_seven@1.2/Bitgoeul_Medium.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'BitgoeulGwangju';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_seven@1.2/Bitgoeul_Bold.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

/*Common*/
*{margin:0;padding:0; box-sizing: border-box;}
html,body{width:100%;height:100%}
html{overflow-y:scroll}
body{background-color:#fff;*word-break:keep-all;-ms-word-break:keep-all;
-webkit-text-size-adjust: 100% !important;-moz-text-size-adjust: 100% !important;-ms-text-size-adjust: 100% !important;}
body,h1,h2,h3,h4,h5,h6,th,td,li,dt,dd,a,p,input,textarea,select,option,button{
	color:#000;
	font-family:"BitgoeulGwangju","Pretendard","Noto Sans KR","돋움",dotum,sans-serif; word-break: keep-all;
	font-size:14px;font-weight:normal; line-height: 1.4;
}
img,fieldset,iframe{border:0 none}
ul,ol,li{list-style:none}
em,address{font-style:normal}
img,input,select,textarea{vertical-align:middle}
a{color:#000;text-decoration:none;cursor:pointer}
a:hover{color:#000;text-decoration:none}
button,label{cursor:pointer;_cursor /**/:hand}
button *{position:relative}
textarea{overflow:auto}
option{padding-right:6px}
.input_text, textarea{*margin:-1px 0;padding-right:1px}
.input_check, .input_radio{width:13px;height:13px}
.blind, legend, caption{text-indent:-9999px;font-size:0;line-height:0;overflow:hidden}
hr{display:none}
legend{*width:0}
:root legend{margin-top:-1px;font-size:0;line-height:0}
caption{*line-height:0}
img{max-width:100%;}


/* header */
#header{position:fixed;left:0;top:0;width:100%;height: 80px; z-index:999; background: #fff;}
.head{position:relative;transition:all 0.3s;}
.head .subBg{
content:'';
position: absolute;
top:80px;
background-color: #f5f5f5;
width: 100%;
height: 0;
transition: all 0.4s;
}
.head h1{height: 80px; display: flex;align-items: center;justify-content: flex-start;flex:1;position: relative;}
.head h1 a{
display:block;
width:158px;height:30px;
background:url(/images/common/logo_color.png) no-repeat center / contain;
background-size:contain;
text-indent:-9999px;
transition: all 0.4s;
position: absolute;
z-index: 1001;
}
.head h1 .thumbMenu{
position: absolute;
bottom: 0;
width: 100%;
}
.head h1 .thumbMenu .subMenu {
z-index: 1;
transition: all 0.4s;
overflow: hidden;
height: 0;
width: 100%;
position: absolute;

}
.head h1 .thumbMenu .menuwrap {
padding: 65px 0;
}
.head h1 .thumb{
max-width: 364px;
width: 100%;
aspect-ratio: 364 / 240;
background:url(/images/common/header_thumbMenu.png) no-repeat center / cover;
padding: 40px 30px;
}
.head h1 .thumb p{
font-size: var(--font-size-24);
color: #fff;
line-height: 1.4;
text-align: left;	
}
.head .inner {
max-width: 1480px;
margin: 0 auto;
position: relative;
width: 92%;
display: flex;
}
.head .pcNav{margin-right: 100px;}
.head .pcNav>ul{display:flex;align-items:center;justify-content:flex-end;position:relative;z-index:100;}
.head .pcNav>ul>li{
height:80px;	
position: relative;
}
.head .pcNav>ul>li>a{
display: block;
width: 10vw;
padding: 0px 10px;
font-size: var(--font-size-22);
line-height: 80px;
text-align: center;
max-width: 190px;
min-width: 120px;
font-family:"Pretendard","Noto Sans KR","돋움",dotum,sans-serif; word-break: keep-all;
}
.head .gnb{
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
z-index: 3000;
cursor: pointer;
}
.head .gnb .btnMenu{
padding: 10px;
}
.head .gnb .btnMenu-wrap {
width: 23px;
height: 23px;
position: relative;
}
.head .gnb .btnMenu-wrap::after,
.head.on .gnb .btnMenu-wrap::after{
transition: all 0.4s;
transform: scale(0);
content:'';
position: absolute;
width: 8px;
height: 8px;
background-color: var(--main-color);
top:50%;
left: 50%;
border-radius: 50%;
transform: translate(-50%,-50%) scale(0);
}
.head.on .gnb .btnMenu-wrap::after {
transform: translate(-50%,-50%) scale(1);
}
.head .gnb .btnMenu .btnMenu-wrap div{
width: 7px;
height: 7px;
position: absolute;	
border-radius: 50%;
}
.head .gnb .btnMenu .btnMenu-wrap div:nth-child(1),
.head.on .gnb .btnMenu .btnMenu-wrap div:nth-child(1){
background-color: #fff;
background-color: var(--main-color);
top:0;
left:0;
}
.head .gnb .btnMenu .btnMenu-wrap div:nth-child(2),
.head.on .gnb .btnMenu .btnMenu-wrap div:nth-child(2){
background-color: #fff;
background-color: #065290;
top:0;
right:0;
}
.head .gnb .btnMenu .btnMenu-wrap div:nth-child(3),
.head.on .gnb .btnMenu .btnMenu-wrap div:nth-child(3){
background-color: #fff;
background-color: #065290;
bottom:0;
left:0;
}
.head .gnb .btnMenu .btnMenu-wrap div:nth-child(4),
.head.on .gnb .btnMenu .btnMenu-wrap div:nth-child(4){
background-color: #fff;
background-color: var(--main-color);
bottom:0;
right:0;
}
.head .pcNav .subMenu{
text-align: center;
width: 100%;
transition: height .3s ease;
overflow: hidden;
z-index: 1;
height: 0;
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.pcNav .subMenu::after {
content:'';
position: absolute;
z-index: 2;
right: 0;
top:0;
width: 1px;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
}
.pcNav .subMenu .menuwrap {
padding: 65px 0;
}
.pcNav .subMenu .menuwrap a{
display: block;
color: #666;
font-weight: 500;
padding: 12px 10px;
font-size: var(--font-size-19);
font-family:"Pretendard","Noto Sans KR","돋움",dotum,sans-serif;
transition: all 0.4s;
}
.pcNav .subMenu .menuwrap a:hover{
color: var(--main-color);
text-decoration: underline;
text-underline-offset:5px;
}

.head.white h1 a{
background: url(/images/common/logo_w.png) no-repeat center / contain;
}
.head.white .pcNav>ul>li>a{color: #fff;}
.head.white .pcNav>ul>li>a{color: #fff;}
.head.white .gnb .btnMenu-wrap::after,
.head.white .gnb .btnMenu .btnMenu-wrap div{
background-color: #fff;
}
.head.on{background-color: #fff}
.head.on h1 a{
display:block;
width:158px;height:30px;
background:url(/images/common/logo_color.png) no-repeat center / contain;
background-size:contain;
text-indent:-9999px;
transition: all 0.4s;
}
.head.on .pcNav>ul>li>a{
color: #000;
}
.head.on .gnb .btnMenu-wrap::after{
background-color: var(--main-color);
}


#allMenu{
position:fixed;left:0;top:0;z-index:1000;
width:100%;height:100vh;
background:#F5F5F5;
transition: all 1s;
display: none;
}
#allMenu.on {
display: block;
}
.allMenu .allmenuwrap{
margin-top: 80px;
padding: 30px 15px;
}
.allMenu ul {
border-top: 1px solid #ccc;
}
.allMenu ul > li {
border-bottom: 1px solid #ccc;
}
.allMenu ul > li > a{
font-family:"Pretendard","Noto Sans KR","돋움",dotum,sans-serif;
font-size: var(--font-size-30);
color: #333;
padding: 20px 0;
display: block;
}
.allMenu ul > li >  ul {
display: none;
}
.allMenu ul > li >  ul > li {
border-bottom: none;
}
.allMenu ul > li >  ul > li > a{
font-size: var(--font-size-19);
color: #666;
padding: 10px 0;
display: inline-block;
font-family:"Pretendard","Noto Sans KR","돋움",dotum,sans-serif;
display: block;
}


/* footer */
#sec6 * {
font-family:"Pretendard","Noto Sans KR","돋움",dotum,sans-serif;
}

#sec6 {
width: auto;
height: auto !important;
}

.foot {
background-color: #111;
}

.foot .inner {
max-width: 1480px;
margin: 0 auto;
position: relative;
width: 92%;
}

.foot .container {
display: flex;
align-items: flex-start;
justify-content: space-between;
padding: 50px 0;
}

.foot .content {
display: flex;
align-items: flex-start;
justify-content: flex-start;
gap:80px;
}

.foot_logo {
flex-shrink: 0;
}

.foot .address {
width: 100%;
display: flex;
flex-wrap: wrap;
row-gap:18px;
}

.foot .address dl {
display: flex;
flex-wrap: wrap;
gap:10px;
align-items: flex-start;
justify-content: flex-start;
}

.foot .address dt {
font-size: var(--font-size-18);
color: #fff;
}

.foot .address dd {
font-size: var(--font-size-18);
color: #B3B3B3;
}

.foot .address .addr {
width: 100%;
}

.foot .address .tel dd,
.foot .address .fax dd{
padding-right: 30px;
margin-right: 30px;	
position: relative;
}

.foot .address .tel dd::after{
content:'';
position: absolute;
width: 1px;
height: 90%;
right: 0;
top:50%;		
transform: translateY(-50%);
background-color: #D9D9D9;
}

.foot .page-top{
background: none;
border: 1px solid #B3B3B3;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}

.copy-container {
border-top: 1px solid rgba(255, 255, 255, 0.2);
padding: 25px 0;
}

.copy-container .copy {
font-size: var(--font-size-18);
color: #B3B3B3;
}

@media screen and (max-width: 950px){
.head .pcNav>ul {display: none;}
.foot .content {
flex-direction: column;
gap:20px;
position: relative;
}
.foot .address {width: 88%;}
.foot .page-top {
position: absolute;
top:0;
right: 0;
}

}

@media screen and (max-width: 812px){
.sub_tab {align-items: center;}
}




/* popup */
.pop1 .video-box {position: relative;}
.pop1 .video-box .play-button{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.pop1 .video-box .play-button button {
background: none;
border: 1.6px solid #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
width: 110px;
height: 110px;
position: relative;
}