@charset "utf-8";
														 
								  

/* all */
.container { width:1280px; }

.boardIcon:before { display:inline-block; font-weight:500; }
.icoNotice:before { content:'[공지사항]'; color:#00a59e;  }
.icoNew:before { content:'[NEW]'; color:#fa582b; }

.mainTitle { margin-bottom:15px; font-size:16px; font-weight:500; }
								  

.leftBox { float:left; }
.rightBox { float:right; }

		   

/* section1 */
.section1 { background:#f4f4f4; padding:40px 0; }
.section1 .leftBox { width:71%; height:100%; }
.section1 .rightBox { width:27%; height:100%; }
.rowGroup1 { /* 2023.04.03 */ height:380px; }
.rowGroup2 { height:150px; margin-top:25px; }

/* mainVisual */
.slick-slider,
.slick-list, 
.slick-track { height:100%; }

#mainContainer { position:relative; overflow:hidden; 		/* 2023.04.03 */ width:100%;}

.mainVisual .slick-slide { position:relative; }
.mainVisual img { display:block; position:relative; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; margin:0 auto; object-fit:cover; }

.mainControlArrow button { position:absolute; top:50%; transform:translateY(-50%); width:38px; height:38px; background-color:rgba(0,0,0, 0.6); background-position:center; background-repeat:no-repeat; font-size:0; }
.mainControlArrow .prev { left:0; background-image:url('/template/common/tmpt/ico_prev1.png'); }
.mainControlArrow .next { right:0; background-image:url('/template/common/tmpt/ico_next1.png'); }
.mainControlBtnBox { position:absolute; right:25px; bottom:13.5px; font-size:0; cursor:pointer; }
.mainControlBtnBox .pause span { display:inline-block; width:2px; height:11px; margin:0 1.5px; background:#fff; }

.slick-dots { position:absolute; right:0; bottom:0; background:rgba(0,0,0, 0.5); padding:10px 0; padding-left:25px; padding-right:52px; text-align:center; }
.slick-dots li { display:inline-block; margin:0 5px; }
.slick-dots li button { width:12px; height:12px; margin-top:-6px; border-radius:50%; background:#fff; font-size:0; }
.slick-dots .slick-active button { width:25px; border-radius:6px; background:#0852af; }

/* 로그인 */
.loginBox { background:#fff; padding:32px 25px; 		/* 2023.04.03 */ display:none;}
.loginBox input { border-bottom:1px solid #d8d8d8; padding:10px 11px; font-size:15px; }
.loginBox .inputBox input,
.loginBox .loginBtn { width:100%; }

.loginBox #userName { margin-top:10px; }
.loginBox #password { margin-top:18px; }

.loginBox .savdId { margin-top:12px; color:#555; font-size:13px; }

.loginBox .loginBtn { margin-top:30px; background-color:#0852af; padding:17px 0; text-align:center; color:#fff; font-size:16px; font-weight:700; }
.loginBox .bar { margin-left:4px; padding-left:15px; }
.loginBox .bar:before { background:#b1b4b7; }
.loginLink { margin-top:20px; font-weight:500; }

/* 로그인 후 221111 추가 */
.loginBox .welcomeText { margin:22px 0; font-size:17px; line-height:1.4; }
.loginBox .welcomeText .name { color:#0852af; }
.loginBox .myInfo { border-top:1px solid #d8d8d8; padding-top:19px; }
.loginBox .myInfo ul li { display:inline-block; margin-right:5px; }
.loginBox .myInfo ul li:nth-child(2n) { margin-right:0; }
.loginBox .myInfo ul li:last-child { width:100%; margin-top:14px; margin-left:0; padding-left:0; }
.loginBox .myInfo ul li:last-child:before { display:none; }
.loginBox .myInfo ul li:last-child dl dd { width:calc(100% - 50px); }
.loginBox .myInfo ul li:last-child dl dd .ellipsis { width:100%; }

.loginBox .myInfo ul li dl dt,
.loginBox .myInfo ul li dl dd { display:inline-block; vertical-align:middle; }

.loginBox .myInfo ul li dl dt { margin-right:9px; color:#808080; }
.loginBox .myInfo ul li dl dd { color:#222; font-weight:500; }
.loginBox .myInfo ul li dl dd .ellipsis { width:76px; line-height:1.1; }
.loginBox .loginBtn.logout { background-color:#99a2b2; color:#fff; }


/* 즐겨찾는메뉴 */
.favMenu { background:#fff; padding:35px 15px; letter-spacing:-1px; }
.favMenu a { display:block; width:100%; height:100%; }
.favMenu .favMenuItem { position:relative; display:inline-block; width:19.3%; text-align:center; }
.favMenu .favMenuItem:after { display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:50px; background:#ddd; }
.favMenu .favMenuItem:last-child:after { display:none; }
.favMenu .favMenuItem span { display:block; padding-top:16px; }

.favMenu .favMenuItem a,
.favMenu .favMenuItem a:hover img { transition:all .15s linear; }

.favMenu .favMenuItem a:hover { color:#0852af; }
.favMenu .favMenuItem a:hover img { transform:translateY(-5px); }

/* 220905 추가 */
.menuMore { display:none; }


		   

/* 환율정보 */
.exchangeBox { background:linear-gradient(160deg, #1983e6, #36a99d); padding:24px; }
.exchangeBox .titleBox { color:#fff; }
.exchangeBox .titleBox .amount { display:inline-block; margin-left:7px; }
.exchangeBox .titleBox .date { font-size:13px; }
.exchangeBox .titleBox .date:before { display:inline-block; width:12px; height:11px; margin-right:8px; background:url('/template/common/tmpt/ico_cal1.png'); }

.exchangeBox table { width:100%; text-align:center; font-size:13px; }
																																																					   

.exchangeBox table th, 
.exchangeBox table td { border:1px solid rgba(221,221,221, 0.8); padding:10px 0; font-weight:400; }

.exchangeBox table th { width:25%; background:rgba(221,221,221, 0.8); }
.exchangeBox table td { color:#fff; }

																		  

/* section2 */
.section2 { margin-top:60px; margin-bottom:50px; }

.section2 .leftBox,
.section2 .rightBox { width:48.8%; }

/* 게시판 */
.boardBox a { display:block; width:100%; height:100%; }

.boardBox .boardTop { background:#ecf0f4; }
.boardBox .boardTop a { padding:17px 0; color:#777; }

.boardBox .tabList { font-size:15px; font-weight:500; }
.boardBox .tabItem { display:inline-block; width:32%; text-align:center; }
.boardBox .tabItem.active a { background:#0852af; color:#ecf0f4; }

.boardPanel { display:none; }
.boardPanel.active { display:block; }

.boardPanel .boardNew { margin-bottom:24px; border-bottom:1px solid #e2e2e2; padding:26px 0; }

.boardPanel .boardNew .date,
.boardPanel .boardNew .textGroup { float:left; }

.boardPanel .boardNew .date { width:12%; text-align:center; }
.boardPanel .boardNew .date .day { color:#0852af; font-size:39px; }
.boardPanel .boardNew .date p { margin-top:10px; color:#555; font-size:16px; font-weight:500; }
.boardPanel .boardNew .textGroup { width:calc(100% - 12%); padding-left:18px; }
.boardPanel .boardNew .boardTitle { width:100%; margin-bottom:15px; font-size:16px; font-weight:500; }
.boardPanel .boardNew .boardTitle a { color:#111; }
.boardPanel .boardNew .boardCon { color:#555; line-height:1.5; }

.boardPanel .boardItem { position:relative; margin-top:20px; padding:0 15px; color:#555; }
.boardPanel .boardItem:before { display:block; position:absolute; left:0; top:42%; transform:translateY(-50%); width:3px; height:3px; background:#0852af; }

.boardPanel .boardItem .boardTitle { display:inline-block; width:67%; color:#555; font-weight:500; }
.boardPanel .boardItem .date { float:right; }

.boardPanel .boardNew .boardTitle a:hover,
.boardPanel .boardItem .boardTitle:hover { text-decoration:underline; } 

/* 갤러리 */
.galleryBox ul li { overflow:hidden; }
.galleryBox img { display:block; position:relative; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; margin:0 auto; object-fit:cover; }
.galleryBox a { display:block; width:100%; height:100%; }

.galleryBox .galleryItem { height:251px; }
.galleryBox .galleryThumbList { margin-top:2px; }
.galleryBox .galleryThumbItem { float:left; width:33% !important; height:78px; margin-right:0.5%; background:#111; }
.galleryBox .galleryThumbItem:last-child { float:right; margin-right:0; }
.galleryBox .galleryThumbItem img { opacity:0.5; }
.galleryBox .galleryThumbItem.slick-current img { opacity:1; }

																											 

/* 하단배너 */
.bannerBox { margin-top:50px; }
.bannerBox .banner { position:relative; border:2px solid #e0e0e0; padding:13px 30px; }
.bannerList { margin-left:12%; }
.bannerList li { position:relative; width:200px; height:46px; margin-right:33px; padding-right:33px; }
.bannerList li a { display:block; width:100%; height:100%; }

.bannerList li:before,
.bannerList li:after { display:block; position:absolute; top:50%; right:0; width:3px; height:3px; border-radius:50%; background:#a5a5a5; }

.bannerList li:before { margin-top:-5px; }
.bannerList li:after { margin-top:2px; }
.bannerList img { margin-top:3px; }

.bannerControlBox { position:absolute; left:30px; top:50%; transform:translateY(-50%); }
.bannerControlBox a { display:block; width:100%; height:100%; }

.bannerControlBox li { display:inline-block; width:24px; height:24px; border:1px solid #c9c9c9; text-align:center; vertical-align:middle; }

.bannerControlBox button { width:100%; height:100%; background-position:center; background-repeat:no-repeat; }
.bannerControlBox .prev { background-image:url('/template/common/tmpt/ico_prev2.png'); }
.bannerControlBox .next { background-image:url('/template/common/tmpt/ico_next2.png'); }

.bannerControlBox .controlBtn,
.bannerControlBox button { background-color:#fff; font-size:0; }

.bannerControlBox .pause { padding:6px 0; }
.bannerControlBox .pause span { display:inline-block; width:2px; height:10px; margin:0 1.5px; background:#355fe1; }
.bannerControlBox .play { background-image:url('/template/common/tmpt/ico_play2.png'); background-position:center; background-repeat:no-repeat; }



/* ---------------------------------------- 반응형 ---------------------------------------- */
/* ---------------------------- PC ---------------------------- */
@media all and (max-width: 1600px) {
   
}

@media all and (max-width: 1440px) {
   
}

@media all and (max-width: 1366px) {
   
}

@media all and (max-width: 1280px) {
    /* all */
    .container { width:95%; }
    
    /* 로그인 후 221111 추가 */
    .loginBox .myInfo ul li.bar { margin-left:0; }
    .loginBox .myInfo ul li dl dd .ellipsis { max-width:68px; }
}

@media all and (max-width: 1200px) {
    /* 로그인 */
    .loginBox { padding:25px; }
    .loginBox .loginBtn { margin-top:20px; padding:10px 0; }
    .loginLink .f_l { width:100%; margin-bottom:10px; }
    .loginLink .f_r { display:block; float:left !important; }
    
    /* 로그인 후 221111 추가 */
    .loginBox .welcomeText { margin:16px 0; font-size:16px; }
    .loginBox .myInfo ul li { width:calc((100% / 2) - 4px); }
    .loginBox .myInfo ul li.bar:before { display:none; }
    
    .loginBox .myInfo ul li dl dt,
    .loginBox .myInfo ul li dl dd { display:block; }
    
    .loginBox .myInfo ul li dl dd { margin-top:5px; }
    .loginBox .myInfo ul li dl dd .ellipsis { max-width:100%; }
    
    /* 자주 찾는 메뉴 */
    .favMenu .favMenuItem { width:16%; }
    
    /* 환율정보 */
    .exchangeBox { padding:20px; }
    .exchangeBox .titleBox { margin-bottom:5px; }
    .exchangeBox .titleBox .mainTitle { width:100%; margin-bottom:7px; font-size:15px; }
    .exchangeBox .titleBox .date { display:block; float:left !important; }
    
    /* 게시판 */
    .boardBox .tabItem { width:24.2%; }
    .boardPanel .boardNew .date p { font-size:15px; }
}


/* ---------------------------- 태블릿 ---------------------------- */
@media all and (max-width: 1024px) {
    /* section1 */
    .section1 .leftBox,
    .section1 .rightBox { width:100%; }
        
    .rowGroup2 { height:unset; }
    
    /* 로그인 */
    .section1 .loginBox { display:none; }
    
    /* 환율정보 */
    .exchangeBox { margin-top:2.5rem; }
    
    .exchangeBox .titleBox,
    .exchangeBox .titleBox .mainTitle { margin-bottom:1rem; }
    
    
    /* 게시판 */
    .boardPanel .boardNew .date { width:15%; }
    .boardPanel .boardNew .textGroup { width:calc(100% - 15%); }
    
    /* 하단배너 */
    .bannerBox { margin-top:30px; }
}

@media all and (max-width: 820px) {
   /* section2 */
    .section2 { margin-top:3rem; margin-bottom:3rem; }
    
    .section2 .leftBox,
    .section2 .rightBox { width:100%; float:none; }
    
    .section2 .rowGroup1 { height:unset; }
    
    /* 갤러리 */
    .galleryBox { margin-top:4rem; }
}

@media all and (max-width: 750px) {
    /* 자주 찾는 메뉴 */
    /* 더보기 버튼 미적용 */
    /* .favMenu { padding-left:0.5%; padding-right:0.5%; }
    .favMenu .favMenuItem { width:33%; }
    .favMenu .favMenuItem:nth-child(3n):after { display:none; } */
    
    /* 더보기 버튼 적용 */
    .favMenu { overflow:hidden; position:relative; height:21rem !important; padding-left:2%; padding-right:2%; }
    .favMenu .favMenuItem { width:19.2%; }
    .favMenu .favMenuItem:nth-last-child(1) { display:none; margin-top:3rem; }
    .favMenu .favMenuItem:after { display:none; }
    
    .menuMore { display:block; margin-top:3rem; background-color:#0852af; }
    .menuMore a { padding:1rem; text-align:center; color:#fff; }
    
    .favMenu.active { height:auto !important; }
    .favMenu.active .favMenuItem { display:inline-block !important; }
    
    /* 하단배너 */
    .bannerList { padding-left:35px; }  
}


/* ---------------------------- 모바일 ---------------------------- */
@media all and (max-width: 640px) {
    /* mainVisual */
    .section1 .rowGroup1 { height:26.5rem; }
    
    /* 자주 찾는 메뉴 */
    .favMenu .favMenuItem { width:24%; }
    .favMenu .favMenuItem:nth-last-child(2) { display:none; margin-top:3rem; }
}

@media all and (max-width: 490px) {
    /* section1 */
    .section1 { padding:2rem 0; }
    
    /* mainVisual */
    .section1 .rowGroup1 { height:21rem; }
    
    /* 하단배너 */
    .bannerBox .banner { padding:13px 15px; }
    .bannerList li { margin-right:10px; padding-right:10px; }
    .bannerControlBox { left:15px; }
}

@media all and (max-width: 460px) {
    /* mainVisual */
    .section1 .rowGroup1 { height:17rem; }
    .mainControlArrow button { width:30px; height:30px; background-size:30%; }
    
    .slick-dots { padding:8px 0; padding-left:10px; padding-right:35px; }
    .slick-dots li button { width:10px; height:10px; }
    .mainControlBtnBox { right:13px; bottom:11px; }
    
   /* 자주 찾는 메뉴 */
    .favMenu { height:17rem !important; padding:20px 15px; }
    .favMenuList { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; font-size:1.3rem; }
    .favMenu .favMenuItem { width:32%; }
    .favMenu .favMenuItem:nth-last-child(3) { display:none; margin-top:2rem; }
    .menuMore { margin-top:2rem; }
    
    /* 게시판 */
    .boardPanel .boardNew { padding:20px 0; }
    .boardPanel .boardNew .textGroup { width:calc(100% - 20%); }
    .boardPanel .boardNew .date { width:20%; }
    .boardPanel .boardNew .date p { font-size:1.4rem; }
    .boardPanel .boardNew .boardTitle { font-size:1.5rem; }
    
    /* 갤러리 */
    .galleryBox .galleryItem { height:15rem; }
    .galleryBox .galleryThumbItem { height:6rem; }
    
    /* 하단배너 */
    .bannerBox .banner { padding:.5rem 1.5rem; }
    .bannerList { margin-top:1rem; padding-left:6rem; }
    .bannerList li:before { margin-top:-10px; }
    .bannerList li:after { margin-top:-4px; }
}

@media all and (max-width: 385px) {
   /* 게시판 */
    .boardBox .tabItem { width:24%; font-size:1.4rem; }
}

@media all and (max-width: 340px) {
   /* 하단배너 */
    .bannerList { margin-bottom:1rem; }
    .bannerList li { margin-left:0; margin-right:0; padding:0 !important; }
    
    .bannerList li:before,
    .bannerList li:after { display:none; }
    
    .bannerList img { width:80%; margin:0 auto; }
}