/* ==================================================
     공통레이아웃
  ================================================== */
.skip_menu {position: absolute;left: 0;top: 0;width: 100%;margin: 0 auto;z-index: 999;}
.skip_menu a {outline: 3px solid red;display: block;position: absolute;left: 0;padding: 10px 20px;height: 50px;line-height: 30px;color: #fff;background: #000;width: 100%;text-align: center;font-size: 18px;box-sizing: border-box;}
.skip_menu a:link,.skip_menu a:visited,.skip_menu a:active {top: -10000px;}
.skip_menu a:hover,.skip_menu a:focus {top: 3px;}
.sub_visual{position:relative;width:100%;height:615px;border-radius:0 0 80px 80px;}
.sub_title{display:flex;height:100%;font-family:var(--secondary-title-font);font-size:60px;font-weight:bold;color:#fff;letter-spacing:1px;text-shadow:0 0 20px rgba(0,0,0,.3);align-items:center;justify-content:center;}
.sub_visual_nav{position:relative;display:flex;width:45%;border-radius:38px 38px 0 0;background:#fff;padding:0 20px;bottom:66px;left:50%;transform:translateX(-50%);align-items:center;}
.sub_visual_nav a,.sub_visual_nav .snb_wrap{position:relative;height:66px;}
.sub_visual_nav>a::after,.sub_visual_nav .snb_wrap::after{position:absolute;display:inline-block;content:"";width:1px;height:20px;background:#d9d9d9;right:0;top:50%;transform:translateY(-50%);}
.sub_visual_nav .snb_wrap:last-child::after{display:none;}
.sub_visual_nav::before,.sub_visual_nav::after{position:absolute;content:"";width:41px;height:41px;bottom:0;}
.sub_visual_nav::before{background:url(/publish/usr/images/common/sub_visual_nav_left.png);left:-40px;}
.sub_visual_nav::after{background:url(/publish/usr/images/common/sub_visual_nav_right.png);right:-40px;}
.sub_visual_nav .snb_wrap{width:calc((100% - 66px)/2);}
.snb_title{width:100%;height:100%;font-size:20px;font-weight:500;text-align:left;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:0 60px 0 20px;border:none;background:url(/publish/usr/images/component/icon_select.png) no-repeat calc(100% - 20px) center;}
.snb_select{position:absolute;display:none;width:100%;background:#fff;padding:10px;overflow:hidden;top:calc(100% + 4px);border-radius:8px;box-shadow:2px 3px 4px 0 rgba(0, 0, 0, .08);}
.snb_select a{display:flex;height:40px;font-size:16px;padding:0 20px;justify-content:flex-start;align-items:center;}
.snb_select a:hover{background:var(--primary-light-color);color:var(--primary-color);border-radius:8px;}
.active .snb_select{width:100%;height:auto;left:0;border:1px solid #f0f0f0;}

.company .sub_visual{background:url(/publish/usr/images/company/visual.jpg);}
.major_result .sub_visual{background:url(/publish/usr/images/major_result/visual.jpg);}
.platform_tech .sub_visual{background:url(/publish/usr/images/platform_tech/visual.jpg);}

.con_title{display:flex;margin:80px 0 36px 0;flex-direction:column;}
.con_title .summary{font-family:var(--secondary-title-font);font-size:24px;margin:0 0 12px 0;}
.con_title .summary.black{font-family:var(--primary-title-font);}
.con_title .title{font-family:var(--secondary-title-font);font-size:36px;}

.box{background:#f2f4f6;border-radius:40px;}


/* ==================================================
     Company
  ================================================== */

/* 설립배경 */
.overview{text-align:center;}
.overview_contents_top{background:url(/publish/usr/images/company/corp_bg.png) no-repeat center 80px;}
.overview .txt strong{font-family:var(--secondary-title-font);font-size:52px;font-weight:bold;}
.overview .txt strong span{font-family:var(--secondary-title-font);font-weight:bold;}
.overview .txt p{font-family:var(--secondary-title-font);font-size:24px;}
.overview .card{display:flex;padding:90px 0 280px 0;gap:46px;justify-content:center;}
.overview .card li{position:relative;display:flex;width:calc((100% / 4) - 90px);height:363px;padding:0 30px;text-align:left;color:#fff;border-radius:24px;flex-direction:column;justify-content:flex-end;}
.overview .card li:nth-child(2n){transform:translateY(52px);}
.overview .card li:nth-child(1){background:url(/publish/usr/images/company/card_01.png) no-repeat center;}
.overview .card li:nth-child(2){background:url(/publish/usr/images/company/card_02.png) no-repeat center;}
.overview .card li:nth-child(3){background:url(/publish/usr/images/company/card_03.png) no-repeat center;}
.overview .card li:nth-child(4){background:url(/publish/usr/images/company/card_04.png) no-repeat center;}
.overview .card .number,.overview .card .title{font-family:var(--secondary-title-font);font-weight:bold;}
.overview .card .number{position:absolute;font-size:20px;top:25px;right:25px;}
.overview .card .title{display:block;font-size:24px;font-weight:bold;}
.overview .card .summary{font-size:16px;opacity:0.8;margin:0 0 32px 0;word-break:keep-all;}

.overview .circles{position:relative;justify-content:space-between;padding:0 180px;margin:80px 0;}
.overview .circles::after{position:absolute;content:"";width:45%;height:1px;border:1px dashed var(--primary-color);right:180px;z-index:-1;}
.overview .circles,.overview .circles .left{display:flex;align-items:center;}

.overview .circles .left, .overview .circles .right{position:relative;}
.overview .circles .left::after, .overview .circles .right::after{position:absolute;content:"";width:16px;height:16px;border-radius:100%;top:50%;transform:translateY(-50%);}
.overview .circles .left::after{background:var(--primary-color);right:-8px;}
.overview .circles .right::after{border:1px solid var(--primary-color);background:#fff;left:-8px;}

.overview .circle.line{position:relative;display:flex;width:400px;height:400px;font-family:var(--secondary-title-font);font-size:32px;color:var(--primary-color);background:#fff;border:1px solid var(--primary-color);border-radius:100%;justify-content:center;align-items:center;}
.overview .circle.line:first-child{z-index:2;background:transparent;}
.overview .circle.line:first-child::after{position:absolute;content:"+";width:20px;height:40px;font-family:var(--secondary-title-font);font-size:32px;font-weight:bold;right:18px}
.overview .circle.line:last-child{margin:0 0 0 -60px;}

.overview .circle.fill{position:relative;display:flex;width:460px;height:460px;font-family:var(--secondary-title-font);font-size:40px;color:#fff;background:var(--primary-color);border-radius:100%;justify-content:center;align-items:center;}
.overview .circle.fill::after{position:absolute;content:"";width:calc(100% + 60px);height:calc(100% + 60px);background:url(/publish/usr/images/company/obg_deco.png) no-repeat center center;left:-30px;top:-30px;z-index:-1;}

/* 조직도 */
.org_list{display:flex;flex-wrap:wrap;gap:48px 58px;}
.org_list>li{width:calc((100% / 2) - 29px);padding:40px;background:#f2f4f6;border-radius:20px;}
.org_name{display:flex;flex-direction:column;}
.org_name span{font-size:16px;font-weight:700;}
.org_name strong{font-family:var(--secondary-title-font);font-size:28px;font-weight:700;}
.org_list .list{display:flex;list-style:disc;margin:12px 0 0 0;padding:0 20px;flex-direction:column;gap:4px;}
.org_list .list .summary{font-size:14px;color:#444;text-indent:28px;}

/* 오시는 길 */
.location_list{display:flex;flex-direction:column;gap:80px;}
.location_list>li{display:flex;gap:60px;align-items:center;}
.location_area{width:760px;height:500px;border-radius:20px;background:#f2f4f6;}

.location_list .title{display:flex;margin:0 0 20px 0;font-size:36px;align-items:center;gap:12px;}
.location_list .location{width:32px;height:42px;background:url(/publish/usr/images/component/location.png) no-repeat center;}
.location_list .info{width:calc(100% - 820px);}
.location_list .info p{font-size:20px;font-weight:400;}

.location_list .boxs{display:flex;margin:40px 0 0 0;flex-direction:column;gap:20px;}
.location_list .boxs li{display:flex;height:80px;font-size:20px;font-weight:bold;background:#f2f4f6;border-radius:20px;justify-content:center;align-items:center;gap:12px;}
.location_list .phone{width:40px;height:40px;background:url(/publish/usr/images/component/phone.png) no-repeat center center;}
.location_list .email{width:40px;height:40px;background:url(/publish/usr/images/component/email.png) no-repeat center center;}
.location_list .btn_map{width:100%;height:80px;font-size:20px;font-weight:bold;margin:20px 0 0 0;border:1px solid #000;border-radius:100px;;}

/* 연혁 */
.history_area{position:relative;display:flex;height:818px;gap:89px;overflow:hidden;}
.history_year{position:sticky;width:600px;display:flex;height:900px;flex-shrink:0;flex-direction:column;top:0;}
.year_item{position:absolute;text-align:right;opacity:0;transform:translateY(-100PX);transition:opacity 0.6s ease-in-out, transform 0.6s ease-in-out;top:0;left:0;}
.year_item.active{opacity:1;transform:translateY(0);}
.year_item strong{font-family:var(--secondary-title-font);font-size:60px;font-weight:bold;}
.year_item .img_box{margin:20px 0 0 0;border-radius:20px;overflow:hidden;}
.history_month {position:absolute;width:100%;max-height:100%;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none;}
.month_ul{display:flex;width:calc(100% - 690px);flex-direction:column;margin:0 0 0 auto;}
.month_ul:first-child li:first-child{border-top:1px solid #e0e0e0;}
.month_ul li{border-bottom:1px solid #e0e0e0;}
.month_ul dl{display:flex;padding:40px 0;gap:60px;align-items:flex-start;}
.month_ul dd{width:calc(100% - 80px);}
.month_ul dd p:nth-child(n+2){margin:36px 0 0 0;}
.month_ul .month{width:80px;font-family:var(--secondary-title-font);font-size:24px;font-weight:bold;color:var(--primary-color);letter-spacing:-0.5px;}
.month_ul strong{font-size:20px;font-weight:600;;}
.month_ul .summary{display:block;font-size:20px;font-weight:400;color:#444;margin:8px 0 0 0;}

.history_month.active{position:fixed;left:0;top:207px;}
.active .month_ul{width:calc(100% - 903px);margin:0 5.7% 0 auto;}


/* ==================================================
     Major Result
  ================================================== */

.figure_content{display:flex;gap:65px;align-items:center;}
.figure_content.column{flex-direction:column;align-items:flex-start;}

.figure_content .box{display:flex;width:50%;padding:50px 30px;justify-content:center;align-items:center;box-sizing:border-box;}
.figure_content .box img{mix-blend-mode:multiply;}
.figure_content.column .box{width:100%;margin:20px 0 60px 0;}
.figure_content.column .figure_desc{width:100%;}

.figure_desc{display:flex;flex-direction:column;gap:24px;}
.figure_desc li{min-height:30px;font-size:24px;font-weight:400;text-indent:32px;}
.figure_desc.circle li{background:url(/publish/usr/images/component/list_circle.png) no-repeat left 8px;}
.figure_desc.square li{background:url(/publish/usr/images/component/list_square.png) no-repeat left 8px;}

/* Anti Cancer */
.cancer .figure_content .box img{mix-blend-mode:darken;}

/* R&D */
.rd .figure_content.column{gap:40px;}
.rd .figure_content .box{margin:0;}
.rd .figure_content .box:first-child img{mix-blend-mode: normal;}

/* Pipeline Summary */
.pipeline table{table-layout:fixed;width:100%;border-spacing:12px;border-collapse:separate;}
.pipeline thead th{font-family:var(--primary-title-font);font-size:20px;font-weight:500;padding:10px 0;background:#AFBCDF;border-radius:8px;word-break:break-all;}
.pipeline thead tr:nth-child(2) th{height:44px;font-size:16px;background:#EBEFF7;}

.pipeline tr>th,.pipeline tr>td{height:84px;padding:10px 0;border-radius:8px;font-size:20px;font-weight:500;line-height:1.2;text-align:center;word-break:break-all;}
.pipeline tbody th{background:#f4f4f4;}
.pipeline tbody td{position:relative;border:1px solid #e0e0e0;background:#fff;}
.pipeline tbody td[colspan="6"]{border:2px solid #cbd7ff;}
.pipeline .graph{position:absolute;width:100%;top:50%;transform:translateY(-50%);}
.pipeline .graph span{position:relative;display:flex;height:30px;border-radius:30px 0 0 30px;background:linear-gradient(90deg, #DBE5FF 0%, #3B5BB0 100%);color:#fff;text-shadow:0 0 5px rgba(0,0,0,0.3);justify-content:center;align-items:center;left:10px}
.pipeline .graph span::after{position:absolute;content:"";width:51px;height:70px;background:url(/publish/usr/images/major_result/polygon_blue.png) no-repeat center center;right:-44px;}
.pipeline .graph.purple span{background:linear-gradient(90deg, #EFEDF7 0%, #5F48B0 100%);}
.pipeline .graph.purple span::after{background:url(/publish/usr/images/major_result/polygon_purple.png) no-repeat center center;}
.pipeline .graph.orange span{background:linear-gradient(90deg, #FFEADF 0%, #FF8748 100%);}
.pipeline .graph.orange span::after{background:url(/publish/usr/images/major_result/polygon_orange.png) no-repeat center center;}
.pipeline .graph1 span{width:calc((100% / 6) - 20px);}
.pipeline .graph2 span{width:calc((100% / 6)*2 - 100px);}
.pipeline .graph3 span{width:calc((100% / 6)*3 - 100px);}
.pipeline .graph4 span{width:calc((100% / 6)*4 - 100px);}
.pipeline .graph5 span{width:calc((100% / 6)*5 - 100px);}


.pipeline ul{display:flex;}
.pipeline ul li{height:42px;border-right:1px dashed #bbc8ea;font-size:16px;font-weight:bold;flex-grow:1;}
.pipeline ul li:last-child{border:0;}
.pipeline tr:first-child ul li:nth-child(5){flex-grow:0.5;color:#3b5bb0;}

.pipeline .purple+ul li{color:#5F48B0;}
.pipeline .purple+ul li:nth-child(4){flex-grow:1.2;}
.pipeline .orange+ul li{color:#FF8748;}
.pipeline .orange+ul li:nth-child(5){flex-grow:1.2;}




/* ==================================================
     Platform Tech
  ================================================== */
.dl_wrap{display:flex;width:100%;gap:32px;}
.dl_wrap dl{width:50%;}
.dl_wrap dt{font-size:20px;font-weight:700;text-align:center;padding:11px 36px;background:var(--secondary-light-color);border-radius:8px;}
.dl_wrap dt span{display:block;font-size:16px;font-weight:400;}
.dl_wrap dd{display:flex;height:calc(100% - 100px);background:#f2f4f6;border-radius:8px;margin:36px 0 0 0;justify-content:center;align-items:center;}
.dl_wrap dd img{mix-blend-mode:darken;}


/* background */
.background .figure_content .box img{mix-blend-mode:normal;}

/* autophagy */
.step_ul{display:flex;width:100%;align-items:center;gap:12px;}
.step_ul li:not(.next){display:flex;width:calc(100%/6);min-height:91px;font-size:20px;font-weight:500;text-align:center;padding:0 10px;background:#f2f4f6;border-radius:20px;justify-content:center;align-items:center;box-sizing:border-box;}

.autophagy .box:nth-child(2){margin:0;}




@media (max-width: 1400px){

  /* ==================================================
     공통레이아웃
  ================================================== */
  .sub_visual_nav{width:80%;}

  /* ==================================================
     Company
  ================================================== */

  /* 설립배경 */
  .overview .card li{width:calc((100% / 4) - 60px);}

  /* 오시는 길 */
  .location_area{width:660px;}



}

@media (max-width: 1280px){

   /* ==================================================
     공통레이아웃
  ================================================== */
  .sub_title{font-size:40px;}
  .sub_visual{height:480px;}
  .sub_visual_nav{width:65%;}
  .sub_visual_nav .snb_wrap{width:calc(100% - 66px);}
  .con_title{margin:80px 0 16px 0;}
  .con_title .title{font-size:28px;}
  .con_title .summary{font-size:20px;}

  .platform_tech .sub_visual{background-position:75% center;}

  /* ==================================================
     Company
  ================================================== */

  /* 설립배경 */
  .overview .card{flex-wrap:wrap;}
  .overview .card li{width:calc((100% / 2) - 60px);height:485px;}
  .overview .card li:nth-child(1),.overview .card li:nth-child(2),.overview .card li:nth-child(3),.overview .card li:nth-child(4){background-size:cover;}

  .overview .circles, .overview .circles .left{flex-direction:column;}
  .overview .circles{gap:120px;}
  .overview .circles::after{width:1px;height:45%;right:50%;bottom:0;transform:translateX(-50%);}
  .overview .circles .left::after{left:50%;bottom:-8px;top:auto;transform:translateX(-50%);}
  .overview .circles .right::after{left:50%;top:-8px;transform:translateX(-50%);}
  .overview .circle.line:last-child{margin:-60px 0 0 0;}
  .overview .circle.line:first-child::after{bottom:10px;right:45%;transform:translateX(-50%);}

  /* 오시는 길 */
  .location_list>li{flex-wrap:wrap;gap:30px}
  .location_area{width:100%;}
  .location_list .info{width:100%;}
  .location_list .boxs{flex-direction:row;}
  .location_list .boxs li{width:50%;}
  .location_list .boxs li:only-child{width:100%;}
  
  /* 연혁 */
  .history_area{flex-direction:column;}
  .history_year{display:none;}
  .month_ul{position:relative;width:90%;padding:100px 0 0 0;margin:0 auto;}
  .month_ul::after{position:absolute;content:"";width:100%;height:70px;top:0;font-family:var(--secondary-title-font);font-size:52px;font-weight:bold;}
  .month_ul:last-child{margin:160px auto 0 auto;}
  #year_2023::after{content:"2023";}
  #year_2022::after{content:"2022";}

  /* ==================================================
     Platform Tech
  ================================================== */

  /* autophagy */
  .step_ul{flex-wrap:wrap;}
  .step_ul li:not(.next){width:calc((100%/3) - 40px);}
  .step_ul li:nth-child(6){display:none;}

  /* ==================================================
     Major Result
  ================================================== */

  .figure_desc{gap:12px;}
  .figure_desc li{font-size:20px;}

  .figure_content.column .box{margin:20px 0;}

  /* Pipeline Summary */
  .pipeline .table_wrap{width:100%;overflow:auto;}
  .pipeline table{width:1024px;border-spacing:6px;}
  .pipeline tr>th, .pipeline tr>td{height:60px;font-size:14px;}
  .pipeline .graph span{font-size:14px;}
  .pipeline .graph span::after{background-size:60% auto;right:-38px;}
  .pipeline .graph.purple span::after,.pipeline .graph.orange span::after{background-size:60% auto;right:-38px;}
  .pipeline tr:first-child ul li:nth-child(5),.pipeline .purple+ul li:nth-child(4),.pipeline .orange+ul li:nth-child(5){font-size:14px;}

  .pipeline ul li{display:flex;justify-content:center;align-items:center;}

  .pipeline .graph1 span{width:calc((100% / 6) - 20px);}
  .pipeline .graph2 span{width:calc((100% / 6)*2 - 60px);}
  .pipeline .graph3 span{width:calc((100% / 6)*3 - 60px);}
  .pipeline .graph4 span{width:calc((100% / 6)*4 - 60px);}
  .pipeline .graph5 span{width:calc((100% / 6)*5 - 60px);}

  .rd .figure_content.column{gap:0;}

}


@media (max-width: 768px){

  /* ==================================================
     공통레이아웃
  ================================================== */
  .sub_visual{height:500px;border-radius:0 0 40px 40px;;}
  .sub_visual_nav{height:66px;}
  .sub_visual_nav>a{display:none;}
  .sub_visual_nav .snb_wrap{width:calc(100% / 2);}

  .con_title .title{font-size:28px;}


  /* ==================================================
     Company
  ================================================== */

  /* 설립배경 */
  .overview .txt strong{font-size:40px;line-height:1.4;}
  .overview .txt strong span{display:block;}
  .overview .card{gap:20px;}
  .overview .card li{width:calc((100% / 2) - 20px);height:400px;}

  .figure_content.row{flex-direction:column;gap:20px;}
  .figure_content.row .box{width:100%;}

  .figure_desc{width:100%;gap:12px;}
  .figure_desc li{font-size:18px;}
  .figure_desc.square li{text-indent:26px;background:url(/publish/usr/images/component/list_square.png) no-repeat left 4px;}
  .figure_desc.circle li{text-indent:26px;background:url(/publish/usr/images/component/list_circle.png) no-repeat left 4px;background-size:auto 20px;}

  /* 조직도 */
  .org_list{gap:20px}
  .org_list>li{width:100%;}

  /* 오시는 길 */
  .location_list .boxs{flex-direction:column;}
  .location_list .boxs li{width:100%;}
  
  /* 연혁 */
  .month_ul{padding:80px 0 0 0;}
  .month_ul::after{font-size:36px;}

  .month_ul .month{width:60px;font-size:20px;}
  .month_ul dl{padding:20px 0;gap:20px;}
  .month_ul dt{padding:2px 0 0 0;}
  .month_ul dd p:nth-child(n+2){margin:18px 0 0 0;}
  .month_ul strong{font-size:18px;}
  .month_ul .summary{font-size:16px;}

  /* ==================================================
     Platform Tech
  ================================================== */
  .dl_wrap{flex-direction:column;gap:60px;}
  .dl_wrap dl{width:100%;}
  .dl_wrap dd{margin:20px 0 0 0;;}
}

@media (max-width: 640px){


  /* ==================================================
     공통레이아웃
  ================================================== */
  .sub_visual_nav .snb_wrap{width:100%;}
  .sub_visual_nav .snb_wrap:nth-child(2){display:none;}
  .content_title h3{font-size:40px;}


  /* ==================================================
     Company
  ================================================== */

  /* 설립배경 */
  .overview .txt strong{font-size:28px;}
  .overview .txt p{font-size:18px;margin:8px 0 0 0;}
  .overview .card{gap:36px;padding:90px 0 120px 0;}
  .overview .card li{width:100%;}
  .overview .card li:nth-child(2n){transform:none;;}
  .overview .card .title br{display:none;}

  .overview .circles{padding:0;margin:40px 0 80px 0;gap:60px;}
  .overview .circles::after{height:50%;right:49.5%;}
  .overview .circle.line{width:200px;height:200px;font-size:18px;}
  .overview .circle.line:last-child{margin:-40px 0 0 0;}
  .overview .circle.line:first-child::after{height:20px;font-size:24px;bottom:14px;right:40%;}
  .overview .circle.fill{width:260px;height:260px;font-size:20px;;}
  .overview .circle.fill::after{width:calc(100% + 20px);height:calc(100% + 20px);left:-10px;top:-10px;background-size:100% auto;}
  .overview .circles .left::after, .overview .circles .right::after{width:12px;height:12px;}
  .overview .circles .left::after{bottom:-5px;}

  /* ==================================================
     Platform Tech
  ================================================== */

  /* autophagy */
  .step_ul{flex-direction:column;}
  .step_ul li:not(.next){width:100%;}
  .step_ul li.next img{transform:rotate(90deg);}
  .step_ul li:nth-child(6){display:block;}
}

@media (max-width: 500px){
	
 /* ==================================================
    Company
 ================================================== */
 
 /* 연혁 */
 .month_ul dl{flex-direction:column;gap:12px;}
 .month_ul dd{width:100%;}
}