@charset "UTF-8"; 

/* header(MAIN) */
.header_main { position: fixed; padding: 20px 100px; width: 100%;}
.header_main .header_wrapper { display: flex; justify-content: space-between; align-items: center; width: 100%;}
.header_main .header_logo a { background-image: url(/static/images/common/logo/logo_white.png);}
.header_main .header_ham { width: 30px; height: 30px; background: url(/static/images/main/ico/ico_ham_black.png);}

.menu_pop { position: fixed; left: 0; top: 0; width: 100%; height: 100%; visibility: hidden; opacity: 0; transition: all .2s;}
.menu_pop.active { visibility: visible; opacity: 1;}
.menu_pop_dimmed { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.8);}
.menu_pop_whole { width: 800px; height: 100%; position: absolute; right: -800px; top: 0; padding: 20px 100px 100px; border-left: 20px solid #e61d30; background: url(/static/images/main/logo/menu_pop_logo.png) no-repeat right bottom #fff; transition: right .2s linear;}
.menu_pop.active .menu_pop_whole { right: 0;}
.menu_pop_logoWrap { width: 100%; display: flex; justify-content: space-between; align-items: center; margin-bottom: 120px;}
.menu_pop_logo { width: 227px; height: 40px; background: url(/static/images/common/logo/logo_black.png) no-repeat center;}
.menu_pop_close { width: 32px; height: 32px; background: url(/static/images/main/ico/ico_close_red.png) no-repeat center;}

.menu_gnb_depth1 a:hover { color: #e61d30; transition: color .2s;}
.menu_gnb_depth1 > li { margin-bottom: 95px;}
.menu_gnb_depth1 > li > a { font-size: 22px; font-weight: 500; padding-bottom: 30px; border-bottom: 1px solid #e0e0e0;}
.menu_gnb_depth1 > li > a[target="_blank"] { padding-right: 21px; background: url(/static/images/main/ico/ico_blank_black.png) no-repeat 105px 6px;}
.menu_gnb_depth1 > li > a[target="_blank"]:hover { background-image: url(/static/images/main/ico/ico_blank_red.png); transition: all .2s;}
.menu_gnb_depth2 { padding-top: 30px;}
.menu_gnb_depth2 > li { float: left; margin-right: 85px;}
.menu_gnb_depth2 > li:last-child { margin-right: 0;}

.menu_info { color: #888888; font-size: 14px; width: 100%; height: 100px; position: absolute; right: 0; bottom: 0; background: #eeeeee; display: flex; justify-content: center; align-items: center;}
.menu_info li { display: inline-block; }
.menu_info li::after { display: inline-block; width: 1px; height: 11px; background: #888888; content: ''; margin: 0 14px;}
.menu_info li:last-child::after { display: none;}
.menu_info li a { display: inline;}

/* visual(MAIM) */
.main_visual { padding: 0 220px 150px 0;}
.main_visual_box { width: 100%; height: 790px; padding: 250px 0 0 100px; background: url(/static/images/main/bg/main_visual_bg01.jpg) no-repeat center; background-size: cover; color: #fff;}
.main_visual_box .visual_tit { font-size: 50px; line-height: 70px; font-weight: 200;}
.main_visual_box .visual_tit b { font-weight: 500;}
.main_visual_box .visual_btn { width: 190px; height: 50px; line-height: 48px; margin-top: 45px; text-align: center; font-size: 18px; background: rgba(0, 0, 0, 0.2); border-radius: 50px; border: 1px solid #fff; transition: all .2s;}
.main_visual_box .visual_btn:hover { color: #333; background: #fff;}

/* main_cont */
/* 2022-11-17 수정 : S */
.main_cont { position: absolute; bottom: 50px; width: 100%; display: flex; justify-content: flex-end; padding-right: 50px;}
.main_cont_list > li { float: left; width: 450px; height: 258px; padding: 50px; display: flex; flex-direction: column; justify-content: space-between; box-shadow: 10px 5px 30px rgba(0, 0, 0, 0.1); position: relative;} /* 20221222 수정 */
.main_cont_list > li:nth-child(1) { background: #e61d30; color: #fff;}
.main_cont_list > li:nth-child(2) { background: #dddddd;}
.main_cont_list > li:nth-child(3) { background: #fff; display: block;}
.main_cont_wrap { display: flex; justify-content: space-between; align-items: center;}
.cont_tit { font-size: 36px; font-weight: 500;}
.cont_desc { font-size: 18px; text-decoration: underline; text-underline-offset: 4px; font-family: "Inter", sans-serif;}
.cont_btn { width: 24px; height: 24px; background: no-repeat center; background-size: 24px;} /* 20221222 수정 */
.cont_btn.cont_btn_big { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-position: calc(100% - 50px) 50px;} /* 20221222 추가 */
.main_cont_list li .cont_btn { background-image: url(/static/images/main/ico/ico_btn_black.png);}
.main_cont_list li:nth-child(1) .cont_btn { background-image: url(/static/images/main/ico/ico_btn_white.png);}
.main_reports_state { margin-top: 20px; border-top: 1px solid #cccccc; height: 110px; overflow: hidden; padding-top: 10px;}
.main_reports_list {display: flex;flex-direction: column;} /* 20230110 추가 */
.main_reports_state .main_reports_list li { display: flex; align-items: center; margin-bottom: 10px;height: 26.3333px;} /* 20230110 수정 */
.main_reports_state .state { width: 41px; line-height: 24px; color: #fff; font-size: 14px; text-align: center;}
.main_reports_state .state.com { background: #e61d30;}
.main_reports_state .state.ing { background: #113c70;}
.main_reports_state .state.sub { background: #888888;}
.main_reports_state .title { width: calc(90% - 76px); padding: 0 20px 0 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.main_reports_state .date { font-size: 14px; color: #999999; width: 35px;}
/* 2022-11-17 수정 : E */

/* fadeEffect */
.fadeUp { transition-delay: .4s; }

/* 고객의소리 버튼 */
.customer_btn { width: 120px; height: 120px; position: fixed; right: 50px; top: 130px; background: url(/static/images/main/ico/ico_customer.png) no-repeat center 27px #cda772; font-size: 18px; font-weight: 500; padding-top: 80px; color: #fff; text-align: center; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);}

/* MainPopup */
.swiper-container-horizontal>.swiper-pagination-bullets { bottom: 30px;}
.swiper-pagination-bullet { width: 10px; height: 10px; box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.2); background: #fff; opacity: 1;}
.swiper-pagination-bullet-active { background: #888888;}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 5px;}

.MainPopup { width: 450px;}
.pop_close_wrap { padding: 30px 20px; border-top: 1px solid #cccccc; display: flex; justify-content: space-between; align-items: center;}
.MainPopup_close { width: 20px; height: 20px; background: url(/static/images/common/ico/ico_pop_close.png);}