:root {
    --color-primary-cyan: #008689;
    --color-primary-cyanindark: #00B5B8;
    --color-secondary-blue: #F0F5FC;
    --color-secondary-cyan: #F2F9F9;
    --color-secondary-blue: #F0F5FC;
    --color-neutral-black-100: #000000;
    --color-neutral-gray1-100: #111111;
    --color-neutral-black-75: #000000BF;
    --color-neutral-gray2: #5A5A5A;
    --color-neutral-black-50: #00000080;
    --color-neutral-gray3: #888888;
    --color-neutral-gray1-50: #11111180;
    --color-neutral-gray4: #E5E5E5;
    --color-neutral-white-100: #FFFFFF;
    --color-neutral-white-75: #FFFFFFBF;
    --color-neutral-white-50: #FFFFFF80;
   }
   
   html {width: 100%; height:100%;} 
   body {position:fixed; width: 100%; height:100%;} 
   
   /* 추가 */
   body #wrap {width: 100%;}
   
   body #wrap .container {width: 100%; font-family: Inter, 'Spoqa Han Sans Neo', 'sans-serif';}
   
   .section{width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; gap: 30px; flex-direction: column;}
   /* .container.dark-mode .section{background-color: var(--color-neutral-black-100); width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; gap: 30px;} */
   /* 추가 */
   
   /* header */
   #sub_header {position: fixed; display: block !important; height: 60px;}
   #sub_header.fix{ z-index: 201;}
   #sub_header .sub_header_con{background: var(--color-neutral-gray1-100); height: 60px; width: 100vw; display: flex; justify-content: center; align-items: center;}
   #sub_header .donga_logo {left: 40px; margin-left: 0; position: absolute;}
   #sub_header .hero_contents_logo {width: 126px; position: absolute; z-index: 1;}
   #sub_header .right_box {top: auto; display: flex; position: absolute; right: 40px;}
   #sub_header .right_box .btn_reply { margin-left: 24px;}
   .modal.share_box {left: -10rem; top: 5rem;}
   
   .main_view{padding-bottom: 0;}
   .da_corp_foot{ margin-top: 0;}
   .sub_page .logo { width: 12.6rem; height: 2.36rem;}
   .da_corp_foot .info_list_wrap{padding: 2.6rem 0;}
   .da_corp_area {padding: 0 0 2rem;}
   
   /* BYLINE */
   .byline {position: relative; width: 100%; padding: 70px calc((100% - 1280px) / 2 + 95px) 0px calc((100% - 1280px) / 2 + 95px); box-sizing: border-box; color: var(--color-neutral-gray1-100); background: var(--color-neutral-white-100); border-top: 1px solid #3d3d3d; font-family: Inter, "Spoqa Han Sans Neo", "sans-serif";} 
   .byline .byline_title { letter-spacing: -0.03em; font-weight: 600; line-height: 150%; font-size: 16px; } 
   .byline .byline_text { line-height: 150%; font-size: 16px; margin: 8px 0 0 0; width: 640px; letter-spacing: -0.32px; } 
   .byline .make_list { margin: 32px 0 0 0; width: 60%; display: flex; align-items: flex-start; flex-direction: column; } 
   .byline .make_list li { margin-bottom: 8px; position: relative; width:100%;}
   .byline .link_wrap_header {position: relative; margin: 160px 0 0 0; border-bottom: 2px solid var(--color-neutral-black-50);}
   .byline .link_wrap_header .move_btn_list { position: absolute; right: 0; bottom: 8px; display: flex; justify-content: flex-end; align-items: center; gap: 12px;}
   .byline .link_wrap { position: relative; display: flex; padding: 32px 0 0 0; gap: 32px; justify-content: space-between; } 
   .byline .link_wrap .link_to_news_wrap {display: flex; justify-content: flex-start; align-items: flex-start; overflow: hidden; gap: 24px;}
   .byline .link_wrap .link_to_news_wrap .link_to_news { width: calc(50% - 12px); flex-shrink: 0; transition: 0.5s;}
   #footer img { width: unset; vertical-align: initial; } 
   .bottom_wrap { width: 100%; background: var(--color-neutral-white-100); position: relative; }
   #the_original, #footer_wrap { position: relative; background: var(--color-neutral-white-100); } 
   
   /*The original*/
   #the_original {width: 100%; padding: 120px calc((100% - 1280px) / 2 + 95px) 160px calc((100% - 1280px) / 2 + 95px); box-sizing: border-box;}
   #the_original .theoriginal_cont .tit_cont { position: relative; padding-bottom: 8px; margin-bottom: 32px; border-bottom: 2px solid var(--color-neutral-white-50);}
   #the_original .theoriginal_cont .tit_cont .tit{ font-size: 22px; line-height: 150%; font-weight: 600; font-family: Inter, 'Spoqa Han Sans Neo', 'sans-serif';}
   #the_original .theoriginal_cont .theoriginal_story { overflow: visible; display: flex; justify-content: space-between; align-items: flex-start; gap: 30px;}
   #the_original .theoriginal_cont .theoriginal_story li {float: none; margin-left: 0; width: 100%;}
   #the_original .theoriginal_cont .theoriginal_story li a { width: 100%; }
   #the_original .theoriginal_cont .theoriginal_story li a .thumb img {border: 2px solid var(--color-neutral-gray4); width: 100%; height: auto;}
   #the_original .theoriginal_cont .theoriginal_story li a .thumb img:hover {border: 2px solid var(--color-primary-cyan); width: 100%; height: auto;}
   #the_original .theoriginal_cont .theoriginal_story li a .cont_info {width: 100%;}
   #the_original .theoriginal_cont .theoriginal_story li a .cont_info .tit {padding-top: 16px; font-size: 18px; line-height: 150%; font-weight: 700; font-family: Inter, 'Spoqa Han Sans Neo', 'sans-serif'; color: var(--color-neutral-gray1-100); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; white-space: normal;}
   #the_original .theoriginal_cont .theoriginal_story li a .cont_info .txt {padding-top: 8px; font-size: 16px; line-height: 150%; font-family: Inter, 'Spoqa Han Sans Neo', 'sans-serif'; color: var(--color-neutral-gray2); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; white-space: normal;}
   
   /*  dark */
   .byline, #the_original {    background: var(--color-neutral-black-100); color: var(--color-neutral-white-100);}
   #the_original .theoriginal_cont .theoriginal_story li a .cont_info .tit{color: var(--color-neutral-white-100);}
   #the_original .theoriginal_cont .theoriginal_story li a .cont_info .txt{color: var(--color-neutral-gray4);}


   @media all and (max-width: 1280px) {
    .main_view {max-width: none;}
    .byline { padding: 120px 95px 0 95px; }
    #the_original {padding: 120px 95px 120px 95px;}
   } 
   
   
   @media all and (max-width: 1079px) {
    #header.sub_page progress {inset: 5.8rem 0 0;}
    .byline .link_wrap { flex-direction: column; }
    .byline .link_wrap .link_to_news_wrap { width: 100%; align-items: flex-start;}
    .sub_page .logo { width: 10.7rem; height: 2.4rem;}
   } 
   
   @media all and (max-width: 876px){
    /* byline */
    .byline { padding: 120px 16px 0 16px;} 
    .byline .make_list {width: auto;} 
    .byline .byline_text { width: auto; }
   
    /* header */
    #sub_header .donga_logo {width: 65px; left: 16px;}
    #sub_header .right_box {right: 16px;}
    #sub_header .right_box .btn_reply {margin-left: 8px;}
   
    /* The original */
    #the_original {padding: 120px 16px 120px 16px;}
    #the_original .theoriginal_cont .tit_cont { padding-bottom: 24px; position: inherit;}
    #the_original .theoriginal_cont .theoriginal_story{ flex-direction: column; }
    #the_original .theoriginal_cont .theoriginal_story li { width: 100%; }
    #the_original .theoriginal_cont .theoriginal_story li a{ display: flex; justify-content: flex-start; align-items: center; gap: 15px; }
    #the_original .theoriginal_cont .theoriginal_story li a .thumb img {height: 65px; width: auto;}
    #the_original .theoriginal_cont .theoriginal_story li a .cont_info .tit {font-size: 16px; padding-top: 0;}
    #the_original .theoriginal_cont .theoriginal_story li a .cont_info .txt {font-size: 13px; padding-top: 2px; -webkit-line-clamp: 2;}
    #the_original .theoriginal_cont .theoriginal_story li a .thumb img:hover {border: 2px solid var(--color-neutral-gray4);width:auto;height: 65px;}
}
   
   @media all and (max-width: 767px){
       #header.sub_page progress {inset: 5.8rem 0 0;}
   }
   
   @media all and (max-width: 640px){
       #header.sub_page #gnb{display: block; width: 100px;}
       #header.sub_page #gnb img{width: 100%;}
       #header.sub_page .donga_logo a .logo{width: 75px !important;}
   }
   
   @media all and (max-width: 480px) {
    .byline .link_wrap_header .move_btn_list {display: none;}
    .byline .link_wrap {padding: 16px 0 0 0;}
    .byline .link_wrap .link_to_news_wrap { flex-direction: column; }
    .byline .link_wrap .link_to_news_wrap .link_to_news { width: 100%; }
   
    #the_original .theoriginal_cont .tit_cont {padding-bottom: 24px; margin-bottom: 16px;}
    #the_original .theoriginal_cont .tit_cont .tit {line-height: 140%;}
    #the_original .theoriginal_cont .theoriginal_story li a .cont_info .txt { display: none; }
    #the_original .theoriginal_cont .theoriginal_story li a {align-items: flex-start;}
   } 