@charset "UTF-8";

.addwel .content_head {width: 100% !important; max-width: none !important; padding: 100px 0 0; background:linear-gradient(to top, #DBF8FF, #FFF); display: flex; flex-direction: column; align-items: center; gap: 48px;}
.addwel .content_head .inner {width: 100%; max-width: 1920px !important; padding: 0 160px; margin: 0 auto; display: flex; flex-direction: column; align-items: center;}
.addwel .btn_inquiry {display: flex; justify-content: center; align-items: center; gap: 12px; height: 86px; padding: 18px 44px; border-radius: 42px; border: 1.5px solid transparent; background: linear-gradient(#FFF, #FFF) padding-box, linear-gradient(90deg, #00FFF6 0%, #4896FF 69%, #ED48FF 95%) border-box; font-size: 24px; font-weight: 600; color: #419FFE;}
.addwel .btn_inquiry:hover {background: linear-gradient(#DCF8FF, #DCF8FF) padding-box, linear-gradient(90deg, #00FFF6 0%, #4896FF 69%, #ED48FF 95%) border-box;}
.addwel .btn_inquiry .ic_chat {display: inline-block; width: 24px; height: 24px; background: url(/images/addwel/ic_chat.svg) no-repeat center / contain;}
.addwel .content_head .btn_wrap {margin: 0 !important;}
.addwel .content .visual_cards img {width: 100%; max-width: 1606px; display: block;}
.addwel .content_head .visual_wrap {width: 100%; padding: 0 200px; margin: 0 !important; display: flex; justify-content: center;}
.addwel .content_head .title_wrap {margin-bottom: 40px;} 
.addwel .content_head .title_wrap .main_title {margin-bottom:16px;}
.addwel .content_head .title_wrap .desc {font-size:20px; color:#888;}
.addwel .content_head .title_wrap .main_title .desc {margin-top: 16px; display: block;}
.addwel .area_bulb {width:100%; padding:90px 0; background-image:url(/images/addwel/bg_bulb_blue.png) !important; background-size:cover;}
.addwel .area_bulb h2 {color:#fff; font-weight:300;}
.addwel .area_bulb .bold {font-weight:600;}
.addwel .area_bulb .title_wrap {text-align:center;}
.addwel .area_function {padding: 96px 0; margin: 0 auto; width: 100%;}
.addwel .area_function_bg {padding: 96px 0; margin: 0 auto; width: 100%; background-color:#F7FBFF;}
.addwel .area_function .inner {max-width: 1200px;}
.addwel .area_function .title_wrap .title p { display: block; width: 100%; margin: 0;}
.addwel .area_function .title_wrap .title,
.addwel .area_function_bg .title_wrap .title {max-width: 1200px !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; margin-bottom: 32px !important;}
.addwel .area_function_bg .inner {max-width: 1200px !important; width: 100% !important;}
.addwel .area_function .title_wrap { display:flex; flex-direction:column; margin-bottom:32px;}
.addwel img {max-width: 100%; height: auto; display: block;}
.addwel .area_function .title_wrap .title p.label,
.addwel .area_function_bg .title_wrap .title p.label {display:inline-block; width:auto; padding:5px 10px; border-radius:8px; line-height:140%;}
.addwel .area_function .title_wrap .title p.label.blue,
.addwel .area_function_bg .title_wrap .title p.label.blue {font-size: 17px; font-weight: 400; color:#2097F5; background-color:#E6F4FF;}
.addwel .area_function_bg .card_wrap {width: 100%; display: flex; flex-wrap: wrap; gap: 24px; max-width: 1200px; margin: 0 auto; justify-content: space-between;}
.addwel .area_function_bg .card_wrap .card {flex: 1 1 calc(50% - 12px); max-width: calc(50% - 12px);}
.addwel .area_function_bg .card_wrap .card img {width: 100%; height: auto; display: block;}

@keyframes marqueeToLeft {
  0% {
    left: 0;
  }
  100% {
    left: -100%;
  }
}

@keyframes marqueeToRight {
  0% {
    right: 0;
  }
  100% {
    right: -100%;
  }
}

/* 복지몰 개편 */
.addwel_new .area_banner {width: 100%; padding: 100px 0; background-image: url(../images/addwel_new/img_addwel_new_pc_bg_01.png); background-size: cover;}
.addwel_new .area_banner .title_wrap {margin-bottom:0; text-align: center;}
.addwel_new .area_banner .title span.bold {font-size: 40px; font-weight:600; line-height: 150%; color: #fff !important;}
.addwel_new .area_banner .title {font-size: 40px; font-weight:400; line-height: 150%; color: #fff !important;}
.addwel_new .area_function .info_card.integration {display:flex; flex-direction:row; border-radius:20px; overflow:hidden;}
.addwel_new .area_function .desc {font-size:18px; color:#888;}
.addwel_new .area_uncomfortable .card_wrap .card .desc {display: block; padding-top: 8px; font-size: 18px; color: #777;}




@media (max-width: 999px) {  
  .addwel .area_function .title_wrap .title,
  .addwel .area_function_bg .title_wrap .title {max-width: 100% !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; margin-bottom: 24px !important;}
  .addwel .area_function .title_wrap,
  .addwel .area_function_bg .title_wrap {align-items: flex-start !important; text-align: left !important;}
  .addwel .area_function .title_wrap .title,
  .addwel .area_function_bg .title_wrap .title {align-items: flex-start !important; text-align: left !important;}
  .addwel .content_head {padding: 40px 0 0 !important; gap: 0px !important;}
  .addwel .content_head .inner,
  .addwel_new .content_head .inner {width: 100% !important; padding: 0 24px !important; align-items: center !important;}

  .addwel .content_head .visual_wrap {width: 100% !important; max-width: 100% !important; padding: 0 20px !important; margin-top: 0 !important; margin-bottom: 0 !important; display: flex; justify-content: center; align-items: flex-end !important;}
  .addwel .content_head .visual_cards img {width: 100% !important; height: auto !important; max-width: 100% !important; display: block;}
  .addwel .btn_wrap {margin-bottom: 40px; gap: 15px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
  .addwel .btn_inquiry {display: flex; justify-content: center; align-items: center; gap: 12px; height: 72px; padding: 18px 44px; border-radius: 42px; border: 1.5px solid transparent; background: linear-gradient(#FFF, #FFF) padding-box, linear-gradient(90deg, #00FFF6 0%, #4896FF 69%, #ED48FF 95%) border-box; font-size: 20px; font-weight: 600; color: #419FFE;}
  .addwel .btn_inquiry:hover {background: linear-gradient(#E9FAFF, #E9FAFF) padding-box, linear-gradient(90deg, #00FFF6 0%, #4896FF 69%, #ED48FF 95%) border-box;}
  .addwel .btn_inquiry .ic_chat {display: inline-block; width: 24px; height: 24px; background: url(/images/addwel/ic_chat.svg) no-repeat center / contain;}
  .addwel .content_head .btn_inquiry {height: 72px !important; padding: 12px 32px !important; font-size: 20px !important; border-radius: 42px !important; gap: 10px !important;}
  .addwel .content_head .btn_inquiry .ic_chat {width: 20px !important; height: 20px !important;}
  .addwel .content_head .btn_wrap {width: 100% !important; margin-bottom: 40px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: center !important;}
  .addwel .content_head .btn_inquiry {width: 100% !important; max-width: 360px !important; height: 72px !important; padding: 18px 32px !important; font-size: 20px !important;}

  .addwel_new .content_head {padding:0 !important;}
  .addwel_new .area_banner {background-image: url(../images/addwel_new/img_addwel_new_mo_bg_01.png);}
  .addwel_new .area_banner .title,
  .addwel_new .area_banner .title span.bold {font-size:18px;}

}



@media (max-width: 768px) {

  .addwel .area_function_bg .card_wrap {display: flex; flex-direction: column; gap: 16px; width: 100%; max-width: 100%; margin: 0 auto;}
  .addwel .area_function_bg .card_wrap .card {max-width: 100%; width: 100%;}
  .addwel .area_function_bg .card_wrap .card img {width: 100% !important; height: auto; display: block;}
  .addwel .content_head {padding:0 !important; gap: 28px;}
  .addwel .content_head .inner {padding: 0 24px !important; max-width: 100% !important;}
  .addwel .area_function .title_wrap .title p.label.blue,
  .addwel .area_function_bg .title_wrap .title p.label.blue {font-size: 14px; font-weight: 400; color:#2097F5; background-color:#E6F4FF;}
}


@media (max-width: 480px) {

  .addwel .content_head .title_wrap .desc {font-size:16px; color:#888;}
}