@charset "utf-8";

/******************************************************************
	reset
*******************************************************************/

/* 색상 및 사이즈 변수 처리 */
:root {
	--color-primary: #0a9882;
	--color-partner: #ce7f29;
	--color-customer: #4a38b2;
	--white : #ffffff;
	--gray-100: #f5f5f5;
	--gray-200: #dddddd;
	--gray-300: #dddddd;
	--gray-400: #999999;
	--gray-500: #666666;
	--gray-600: #444444;
	--gray-700 : #222222;
	--heading-size1: 42px;
	--heading-size2: 36px;
	--heading-size3: 32px;
	--heading-size4: 28px;
	--heading-size5: 24px;
	--body-size1: 20px;
	--body-size2: 18px;
	--body-size3: 16px;
	--body-size4: 14px;
	--body-size5: 13px;
	--caption-size1: 12px;
	--caption-size2: 10px;
}

* { margin: 0; padding: 0; border: 0; box-sizing: border-box; line-height: 150%; letter-spacing: -0.72px; }
 
html, body { width: 100%; height: 100%; font-family: 'notokr-regular', 'Malgun Gothic', 'Dotum', sans-serif;  color: var(--gray-700); }
button { background: none; cursor: pointer; font-family:"notokr-medium"; }
a { color: var(--gray-700); text-decoration: none;  }
em { color: var(--gray-700); font-style: revert; }
table { font-family: 'notokr-regular', 'Malgun Gothic', 'Dotum' ,sans-serif; width: 100%; }
input[type="checkbox"], input[type="radio"], input[type="text"], input[type="submit"], input[type="password"], input[type="search"], input[type="number"], input[type="reset"], input[type="email"], input[type="tel"], input[type="search"], input[type="file"], input[type="email"], input[type="date"], input[type="tel"] { -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; } 

/******************************************************************
	header
*******************************************************************/
.header_wrap { border-bottom: 1px solid var(--gray-200);}
.header_wrap > .wrap_inner { display: flex; align-items: center; justify-content: space-between; height: 98px; }
.header_wrap h1 a {  display: inline-block; width: 215px; }
.header_wrap h1 a img{ vertical-align: middle; display: inline-block; width: 100%;} 
.header_wrap .gnb { display: flex; gap: 40px; height: 100%; align-items: center;} 
.header_wrap .gnb > li { position: relative;   display: flex; align-items: center; height: 100%;}
.header_wrap .gnb > li > a {font-size: var(--body-size2);font-family:"notokr-medium";color: var(--gray-700);  }
.header_wrap .gnb > li > a::after { display: block; content: ""; width: 0; height: 3px; position: absolute; left: 50%; bottom: -1px; background-color: var(--gray-700); z-index: 5; transition: all 0.3s }
.header_wrap .gnb > li:hover > a::after {width: 100%; left: 0; }
.header_wrap .gnb > li.active > a::after {width: 100%; left: 0;  } 

/******************************************************************
	footer 
*******************************************************************/
.footer_wrapper{border-top: 2px solid #eee;}
.footer_wrap{padding: 75px 0 50px 80px;height: 260px;}
.footer_wrap .footer_logo{margin-right: 95px;}
.footer_wrap .footer_logo a,
.footer_wrap .footer_logo a img{display: block;}
.footer_wrap .footer_text{line-height: 1.5; font-size: 14px; font-family: 'NotoSans', 'Malgun Gothic', 'Dotum' ,sans-serif; color: #666; font-weight: bold;}
.footer_wrap .footer_text .footer_text_last{margin-top: 10px;}

/******************************************************************
	common 
*******************************************************************/
.wrap_inner{width: 1240px; margin: 0 auto; padding: 0 20px;}
.mt60 { margin-top: 60px;}
.mb60 { margin-bottom: 60px;}
.mb140 { margin-bottom: 140px;} 
.pb200 { padding-bottom: 200px;}

.btn-top { opacity: 0; visibility: hidden; pointer-events: none; transition: 0.3s; display:flex; align-items: center; justify-content: center; position:fixed; bottom:20px; right:40px; z-index:8; width:52px; height:52px; padding: 10px; background: #ffffff url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_scroll_top.svg") no-repeat center / 32px auto ;  border-radius: 50%; border: 1px solid #dddddd; box-shadow: 0 4px 16px 0 rgba(0,0,0, 0.1); }
.btn-top.on { opacity: 1; visibility: visible; pointer-events: auto;}

/* tab */
.tab-list { display: flex; align-items: center; }
.tab-list.center { justify-content: center;}
.tab-list.medium > li > button { width: 120px;}
.tab-list.large > li >button  { width: 240px;}
.tab-list > li > button { display: inline-block; font-size: var(--body-size2);  color: var(--gray-700);  font-weight: 500; border-radius: 100px;  padding: 10px 20px; min-width: 73px; }

.tab-list > li:hover > button { background-color: var(--gray-100);}
.tab-list > li.active > button { color: var(--white); background-color: var(--gray-700);}

.tab-panel { display: none;}
.tab-panel.active { display: block;}

/* chip */
.chip { display: inline-block; border: 1px solid var(--color-primary); color: var(--color-primary); border-radius: 100px; background-color: var(--white); padding: 6px 10px; font-size: var(--body-size4); font-family:"notokr-medium"; line-height: 1; font-style: normal;}
.chip.partner { border-color: var(--color-partner); color: var(--color-partner);}
.chip.customer { border-color: var(--color-customer); color: var(--color-customer);}

/* card */
.card-list { display: flex; gap: 20px; flex-wrap: wrap; width: 100%;}
.card-list > li { background-color: var(--gray-100); }
.card-list.grid-4 > li  { width: calc((100% - 60px) / 4); } 
.card-list.grid-2 > li  { width: calc((100% - 20px) / 2); } 
.card-item > a { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 24px; width: 100%; }
.card-item .text2 { font-size: var(--body-size1); color: var(--gray-700); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; word-break: break-word; text-overflow: ellipsis; -webkit-line-clamp: 2; line-clamp: 2;  letter-spacing: -0.4px; min-height: 60px;}
.card-item .date { display: inline-block; font-size: var(--body-size4); color: var(--gray-400); }

/* subpage-layout */
.sub-page .content-wrap { padding-bottom: 200px;}
.sub-page .sub-title-wrap { padding: 60px 0;}
.sub-page .sub-title-wrap > .title { font-size: var(--heading-size2);  font-weight: bold; letter-spacing: -1.44px; }
.sub-page .sub-title-wrap > .desc { font-size: var(--body-size3);  padding-top: 12px;}

/* search */
.search-box { display: inline-block; position: relative; }
.search-box > .search { display: inline-block;width: 480px;height: 48px;border: 1px solid var(--gray-200);border-radius: 100px;background-color: var(--white);padding: 12px 52px 12px 20px;font-size: var(--body-size3); color: var(--gray-700);font-family: 'notokr-regular', 'Malgun Gothic', 'Dotum' ,sans-serif; }
.search-box > .search:not([readonly]):focus { outline: 1px solid var(--color-primary);}
.search-box > .search:not(:disabled):focus { outline: 1px solid var(--color-primary);}
.search-box > .search::placeholder { color: var(--gray-400);}
.search-box .search-btn { position: absolute; right: 20px; top: calc(50% - 12px); display: flex; justify-content: center; align-items: center; z-index: 5}
.search-box .search-btn > i { display: inline-block; width: 24px; height: 24px; background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_search.svg") no-repeat center / contain; }

/* no-data */
.no-data { display: flex;  flex-direction: column; align-items: center; padding: 60px 0;}
.no-data > p { color: var(--gray-500); font-size: var(--body-size2); margin-top: 16px;}
.no-data > p > .bold { font-weight: bold; color: var(--gray-600);}
.no-data .ico-wrap { width: 42px; height: 42px; display: inline-block;}

/* table - top */
.total-num-wrap {  display: block; padding: 12px 0; border-bottom: 2px solid var(--gray-700); font-size: var(--body-size2); }
.total-num-wrap .color { color: var(--color-primary); }

/* table */
.tbl-style th, .tbl-style td { color: var(--gray-700); padding: 24px 10px; font-size: var(--body-size2); text-align: center;}
.tbl-style thead th { background-color: var(--gray-100);  font-weight: normal; font-family:"notokr-medium";} 
.tbl-style tbody th, .tbl-style tbody td {border-bottom: 1px solid var(--gray-200);}
 
.tbl-style tbody tr.notice-top { font-family:"notokr-medium"; } 
.tbl-style tbody td.left { text-align: left; }
.tbl-style tbody td.gray500 {  color: var(--gray-500); font-family:"notokr-regular";} 
.tbl-style tbody td > .ellipsis { max-width: 100%;overflow: hidden; display: -webkit-inline-box; -webkit-box-orient: vertical; word-break: break-word; text-overflow: ellipsis; -webkit-line-clamp: 1; line-clamp: 1;  color: var(--gray-700);  vertical-align: middle; }

/* table - pagination */
.page_nav_wrap { display: flex; justify-content: center; margin-top: 60px;}
.page_nav { display: flex; gap: 8px; align-items: center;}

.page_nav > li { display: flex; justify-content: center; align-items: center; width: 28px; height: 28px; line-height: 1.8; position: relative;} 
.page_nav > li::after { content: ""; display: none; width: 100%; height: 100%; position: absolute; top: calc(50% - 14px); left: 0; background-color: var(--gray-700); border-radius: 100px;} 
.page_nav li > a { display: inline-block; font-size: var(--body-size3); color: var(--gray-600); height: 100%; line-height: 1.8;}

.page_nav .current { display: inline-block; font-size: var(--body-size3); color: var(--white); height: 100%; line-height: 1.8; font-weight: 400 !important; z-index: 2;  position: relative;}
.page_nav li.active::after {  display: inline-block;}

.page_nav .page-btn { width: 100%; text-align: center;}
.page_nav .page_first { background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_first.svg") no-repeat center / auto 12px;}
.page_nav .page_prev { background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_prev.svg") no-repeat center / auto 12px;}
.page_nav .page_next { background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_prev.svg") no-repeat center / auto 12px; transform: rotate(180deg);}
.page_nav .page_end { background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_first.svg") no-repeat center / auto 12px; transform: rotate(180deg);}

/* board */ 
.board-nav-wrap .nav-area  { display: flex; flex-direction: column; margin-bottom: 60px; border-top: 1px solid var(--gray-200); }
.board-nav-wrap .nav-area > a { display: flex; gap: 20px; padding: 16px; border-bottom: 1px solid var(--gray-200); font-size: var(--body-size4); }
.board-nav-wrap .nav-area .title { display: flex; align-items: center; gap: 10px; font-weight: 400!important; flex-shrink: 0; }
.board-nav-wrap .nav-area .title::after { content: ""; display: inline-block; width: 18px; height: 18px; background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_notice_prev.svg") no-repeat center / 18px auto; transform: rotate(90deg); }
.board-nav-wrap .nav-area .next .title::after { transform: rotate(-90deg); }
.board-nav-wrap .ico-btn { display: flex; padding: 8px 12px; border: 1px solid var(--gray-700); font-size: var(--body-size4); color: var(--gray-700); gap: 4px; }
.board-nav-wrap .ico-btn::before { display: inline-block; content: ""; width: 20px; height: 20px; background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_link.svg") no-repeat center / 18px auto; transform: rotate(180deg); }

/* popup */ 
body.pop-open { overflow: hidden;}
.popup { position: fixed; inset: 0;  display: none;  z-index: 100; }
.popup.active { display: block;} 
/* .popup .popup-overlay { display: none; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.3); } */
.popup .popup-inner { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 800px; max-height: 70vh;  background: #ffffff; overflow: hidden; border-radius: 16px; box-shadow: 0 6px 24px 0 rgba(0,0,0, 0.15); }
.popup .popup-inner .btn-close { display: inline-block; width: 24px; height: 24px; background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_close.svg") no-repeat center / contain; }
.popup .popup-inner .popup-top  { display: flex; justify-content: space-between;  padding: 20px; }
.popup .popup-inner .popup-top .title {  font-size: var(--body-size3); } 

/* popup-swiper */
.popup .popup-content .swiper-wrap { position: relative; } 
.popup .popup-content .swiper-wrap .swiper-slide { height: 500px; }
.popup .popup-content .swiper-wrap .img-wrap { display: block;  width: 100%;  height: 100%; }
.popup .popup-content .swiper-wrap .img-wrap > img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
 
.popup .popup-content .swiper-wrap .swiper-prd-prev.swiper-button-disabled { display: none;} 
.popup .popup-content .swiper-wrap .swiper-prd-next.swiper-button-disabled { display: none;} 
.popup .popup-content .swiper-wrap .swiper-prd-prev, 
.popup .popup-content .swiper-wrap .swiper-prd-next  { display: inline-block;  width: 48px;  height: 48px; border-radius: 50%; position: absolute; left: 20px; top: calc(50% - 24px); background: rgba(0, 0, 0, 0.2) url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_arrow_wh.svg") no-repeat center / 24px; z-index: 30; cursor: pointer; }
.popup .popup-content .swiper-wrap .swiper-prd-next { left: auto; right: 20px; transform: rotate(180deg); }
.popup .popup-content .swiper-wrap .swiper-prd-pagination { position: absolute; z-index: 10; display: flex; right: 20px; left: auto; bottom: 20px; width: fit-content; padding: 2px 10px;  font-size: var(--body-size4); color: var(--gray-300);  font-family:"notokr-medium"; border-radius: 100px; background: rgba(0, 0, 0, 0.5) }
.popup .popup-content .swiper-wrap .swiper-prd-pagination .swiper-pagination-current { color: var(--white); padding-right: 2px; }

/******************************************************************
	main 
*******************************************************************/
.main .banner .banner_slide_wrap {width: 100%; min-width: 1240px; }
.main .banner .banner_slide_wrap .swiper-slide{height: 469px;width: 1200px; position: relative; }
.main .banner .banner_slide_wrap .swiper-slide img{width: 100%;height: 100%;display: block; object-fit: cover; }
.main .banner .banner_slide_wrap .swiper-slide .slide_text_box {position: absolute;top: 141px;left: 50%; margin-left: -600px; font-size: var(--heading-size1); color: var(--white); letter-spacing: -2px; max-width: 1060px; line-height: 150%;}
.main .banner .banner_slide_wrap .swiper-slide .slide_text_box > .slide_text_tit { font-family:"notokr-bold";}
.main .banner .banner_slide_wrap .swiper-slide .slide_text_box > .slide_text_desc { font-size: var(--body-size1); margin-top: 16px; }
.main .banner .banner_slide_wrap .swiper-button-prev,
.main .banner .banner_slide_wrap .swiper-button-next {width: 48px;height: 48px;left: 50%;right: inherit;transform: translate(-50%, -50%); background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_arrow_bg.svg") no-repeat center / contain;}
.main .banner .banner_slide_wrap .swiper-button-prev{margin-left: -652px;}
.main .banner .banner_slide_wrap .swiper-button-next{ margin-left: 652px; transform: translate(-50%, -50%) rotate(180deg);}
.main .banner .banner_slide_wrap .swiper-button-prev::after { content: '';} 
.main .banner .banner_slide_wrap .swiper-button-next::after { content: '';} 



.main .main-sec .title-wrap { display: flex; justify-content: space-between; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--gray-700);}
.main .main-sec .title-wrap h2 { font-size: var(--heading-size3);font-family:"notokr-medium";color: var(--gray-700); }
.main .main-sec .title-wrap .btn-more-view { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; padding: 10px; border: 1px solid var(--gray-700); border-radius: 50%; background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_link.svg") no-repeat center / 30px auto; }
.main .main-sec .title-wrap .btn-more-view:hover { background-color: var(--gray-700); background-image: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_link_wh.svg"); transition: all 0.4s ease-in-out;}
.main .tab-list { margin-bottom: 27px;}

/******************************************************************
	notice-detail-wrap
*******************************************************************/
.notice-detail-wrap .notice-detail__head { padding-top: 60px; }
.notice-detail-wrap .notice-detail__head h4 { font-size: var(--heading-size2); font-family:"notokr-medium"; letter-spacing: -1.44px; }
.notice-detail-wrap .notice-detail__head .title-area { border-bottom: 1px solid #000000; padding-bottom: 40px; }
.notice-detail-wrap .notice-detail__head .meta { display: flex;  align-items: center; gap: 10px;  margin-top: 20px; }
.notice-detail-wrap .notice-detail__head .meta .date { font-size: var(--body-size3); color: var(--gray-500);  }
.notice-detail-wrap .notice-detail__head .file-area { display: flex; padding: 16px; border-bottom: 1px solid var(--gray-200); font-size: var(--body-size4); }
.notice-detail-wrap .notice-detail__head .file-area .title { display: inline-block; font-family:"notokr-medium"; width: 108px; }
.notice-detail-wrap .notice-detail__head .file-list { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 10px 20px; }
.notice-detail-wrap .notice-detail__head .file-list .file-name { display: flex; align-items: center; gap: 4px; }
.notice-detail-wrap .notice-detail__head .file-list .file-name:hover { text-decoration: underline; }
.notice-detail-wrap .notice-detail__head .file-list .ico-downlod { display: inline-block; width: 18px; height: 18px; background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_download.svg") no-repeat center / 18px auto; }
.notice-detail-wrap .notice-detail__body { min-height: 500px; padding: 50px 16px; }

/******************************************************************
	prd-info-detail-wrap
*******************************************************************/
.prd-info-detail-wrap h4 { font-size: var(--heading-size2); font-family:"notokr-medium"; letter-spacing: -1.44px; padding: 60px 0 40px; }
.prd-info-detail-wrap .tbl-style th, .prd-info-detail-wrap .tbl-style td { font-size: var(--body-size3);}
.prd-info-detail-wrap .tbl-wrap { padding-bottom: 40px; border-top: 1px solid var(--gray-700);}
.prd-info-detail-wrap td .img-items { display: flex; gap: 16px; }
.prd-info-detail-wrap td .img-items .img-item__button { display: inline-block; width: 180px; height: 180px; position: relative; }
.prd-info-detail-wrap td .img-items .img-item__button > img { width: 100%; height: 100%; object-fit: cover; }
.prd-info-detail-wrap td .img-items .img-item__button::after { content: ""; display: inline-block; width: 40px; height: 40px; position: absolute; top: 10px; right: 10px; border-radius: 8px;  background: rgba(0, 0, 0, 0.2) url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_expand.svg") no-repeat center / 24px; opacity: 0; visibility: hidden; transition: opacity 0.3s ease; }
.prd-info-detail-wrap td .img-items .img-item__button:hover::after { opacity: 1; visibility: visible; }
.prd-info-detail-wrap .board-nav-wrap  .nav-area { border-top: none; }

/******************************************************************
	guide-wrap  
*******************************************************************/
.guide-wrap .guide-list { display: flex; flex-direction: column; gap: 20px;}
.guide-wrap .guide-list h4 { font-size: var(--body-size2); font-weight: bold; padding: 20px 0 20px 16px; border-bottom: 1px solid var(--gray-700); position: relative;}
.guide-wrap .guide-list h4::before { display: inline-block; content: ""; width: 8px; height: 8px; border-radius: 50%; background-color: var(--gray-700);  position: absolute; left: 0; top: 28px;}
.guide-wrap .guide-list li { word-break: keep-all;}
.guide-wrap .guide-list dl { display: grid; grid-template-columns: 180px 1fr; }
.guide-wrap .guide-list dt { align-content: center; text-align: center; font-family:"notokr-medium"; }
.guide-wrap .guide-list dt, dd { font-size: var(--body-size3); margin: 0; border-bottom: 1px solid  var(--gray-200); padding: 24px 10px; letter-spacing: -0.64px; }
.guide-wrap .guide-caption { font-size: var(--body-size4); letter-spacing: -0.56px; margin-top: 20px;}
.guide-wrap .guide-list .sub-list { font-size: var(--body-size3); padding: 24px 10px; letter-spacing: -0.64px;}

/******************************************************************
	certi-wrap 
*******************************************************************/
.certi-wrap .link-list { width: 100%;display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px; }  
.certi-wrap .link-item > a {  display: block; width: 100%; height: 100%; padding: 20px; background-color: var(--gray-100);}
.certi-wrap .link-item img { display: block; width: 245px; height: 120px; }
.certi-wrap .link-item .title { display: block; width: 100%; font-size: var(--body-size1); color: var(--gray-700); letter-spacing: -0.8px; margin: 16px 0 8px; position: relative; padding-right: 36px;}
.certi-wrap .link-item .title::after { display: inline-block; content: ""; width: 30px; height: 30px; border: 1px solid var(--gray-700); border-radius: 50%; position: absolute; right: 0; top: calc(50% - 15px); background: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_link.svg") no-repeat center / 20px auto; } 
.certi-wrap .link-item .desc { font-size: var(--body-size4); color: var(--gray-500); letter-spacing: -0.56px;}
.certi-wrap .link-item a:hover .title::after { background-color: var(--gray-700); background-image: url("//contents-prd.ezwelfare.net/ezwel-image/welfare_new/images/customer/safety/icons/ico_link_wh.svg"); transition: all 0.4s ease-in-out;}