:root {
    --main-color: #CF152D;
  }


/* 헤더 */ 
#hd {display: none; }
#header {position: fixed; width: 100%; height:80px; z-index: 999; transition: ease .4s;}
#header .header_wrap {width: 100%; display: flex; ; align-items: center; justify-content: space-between; padding: 0 10%;  z-index: 1000; position: fixed; transition:ease .4s; background-color:rgba(0,0,0,0.04); backdrop-filter: blur(8px); z-index: 1000; box-sizing: border-box;}
#header .header_wrap .header_logo a{background:url(/img/biorheologics_logo_on.svg) no-repeat center; background-size:auto 26px; display:block;}
#header .header_wrap .header_logo img{height:26px; opacity:1;}

#header .header_wrap .header_center{ transition:ease .4s; padding:0 5%;}
#header .header_wrap .header_center .gnb {display: flex; align-items: center;}
#header .header_wrap .header_center .gnb li{display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100px; transition: ease .3s;}
#header .header_wrap .header_center .gnb li .header_fix {color: #FFF; text-align: center; font-size: 16px; font-style: normal; display: flex; align-items: center; justify-content: center; font-weight:400; line-height: normal; height: 80px; width: 100%; transition: ease .2s;}
#header .header_wrap .header_center .gnb li:hover .header_fix {opacity: .6; transition:ease .4s;}  

#header .header_wrap .header_right {display: flex; align-items: center; gap: 16.5px; justify-content: flex-end;}
#header .header_wrap .header_right .language {color: #fff; font-size: 16px; font-style: normal; font-weight: 700; line-height: normal; position:relative; display: flex; align-items: center; letter-spacing: 0.5px;}
#header .header_wrap .header_right .language:hover{opacity:.8;}
#header .header_wrap .header_right .btn_menu a {width: 100%; height: 100%; display: block; font-size:0;}
#header .header_wrap .header_right .btn_menu a:hover{opacity:.8;}
#header .header_wrap .header_right .btn_menu rect {fill: #fff; transition:ease .6s;}





#header .header_wrap .header_right .language { cursor: pointer;}
#header .header_wrap .header_right .language .language_more {filter:drop-shadow(0 0 6px rgba(0, 0, 0, 0.20)); position: absolute; top: 35px; border-radius: 5px;  background-color: #fff;
     left: -14px; display: flex; flex-direction: column; align-items: center; display: none;}
#header .header_wrap .header_right .language .language_more a{display: flex; align-items: center; justify-content: center; padding: 10px 20px; color: #151515; font-size: 13px;}
#header .header_wrap .header_right .language .language_more:before {border: 1px solid transparent; content: ''; display: block;
	border-right: 6px solid transparent; border-bottom: 7px solid #fff; border-left: 6px solid transparent; width: 0; height: 0; margin: 0 auto; position:absolute; top:-8px; left:0; right:0;}
#header.main_hover .header_wrap .header_right .language svg {width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; color: var(--main-color);}

#header .header_wrap:has(.header_center:hover) {background-color: #fff;}

#header .header_wrap.depth2 {display: flex; transition: ease .6s; top:-400px; z-index: -1;  position: fixed; left: 0;}
#header .header_wrap.depth2 .gnb_sub {display: flex; justify-content: center; border-left: 1px solid rgba(0, 0, 0, 0.05); margin: 0 auto;}
#header .header_wrap.depth2 .gnb_sub > li {width: 170px; border-right: 1px solid rgba(0, 0, 0, 0.05); padding: 15px 10px 40px; transition: ease .3s; opacity: 0;}
#header .header_wrap.depth2 .gnb_sub > li:hover {background-color: #f9f9f9;}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li{display: flex; justify-content: center; flex-direction: column; align-items: center; width: 100%;}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li a {line-height: 37px; display: flex; width: 100%; justify-content: center; align-items: center; color: #505050;
    text-align: center; font-size: 16px; font-style: normal; font-weight: 400; letter-spacing: -0.2px; transition: ease .3s;}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li a i {margin-left: 5px; font-size: 20px; transform: rotate(180deg); transform-origin: center; transition: ease .3s;}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li:hover > a{font-weight: 600; color: var(--main-color);}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li:hover a i {color: var(--main-color); transform: rotate(0deg);}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li .sub_lists {padding: 5px 0; width: 100%; display: none;}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li:hover .sub_lists {display: flex; flex-direction: column;}
#header .header_wrap.depth2 .gnb_sub li .gnb_lists li .sub_lists li a {font-size: 15px; font-weight: 400; line-height: 30px;}
#header .m_only{display: none;}


#header .header_wrap.depth2.en .gnb_sub li .gnb_lists li a{font-size:15px; line-height:31px;}



#header.sub_page .header_wrap{backdrop-filter: inherit; background: none;}
#header.sub_page .header_wrap .header_center .gnb li .header_fix b{color:#fff;}


#header.fixed .header_wrap { background-color: rgba(255,255,255,0.7); backdrop-filter: blur(4px);}
#header.fixed .header_wrap .header_logo img {opacity:0; transition:ease .4s;}
#header.fixed .header_wrap .header_center .gnb li .header_fix {color: #151515;}
#header.fixed .header_wrap .header_right .btn_menu rect {fill: #151515;}
#header.fixed .header_wrap .header_right .language {color: #151515; cursor: pointer;}
#header.sub_page.fixed .header_wrap .header_center .gnb li .header_fix b{color:var(--main-color);}





#header.on .header_wrap{background-color: #fff;}
#header.on .header_wrap .header_logo img {opacity:0;}
#header.on .header_wrap .header_center .gnb li {width: 120px;}
#header.on .header_wrap .header_center .gnb li a {color: #151515;}
#header.on .header_wrap .header_center .gnb li .header_fix b {color:var(--main-color);}

#header.on .header_wrap.depth2.pc_only {top:80px; opacity: 1; border-top:1px solid #eee; max-height: fit-content; background-color: #fff; z-index: -1; }
#header.on .header_wrap.depth2.pc_only .gnb_sub > li {opacity: 1;}
#header.on .header_wrap.depth2.pc_only .gnb_sub > li {width: 180px;}

#header.on .header_wrap .header_right .language{color:#151515}
#header.on .header_wrap .header_right .btn_menu rect{fill:#151515}








#header .pc_nav {position: fixed; width: 100%; height: 100vh; background-color:rgba(0,0,0,0.8); justify-content: center; backdrop-filter: blur(10px); top: -200%;left: 0; z-index: 999; transition: ease .6s; display: flex; flex-direction: column;}
#header .pc_nav.active {top: 0;}
#header .pc_nav .btn_menu {position: absolute; right: 30px; top: 30px;}


#header .pc_nav > div.side_menu{padding-bottom:30px;}
#header .pc_nav > div.side_menu h1{font-size:55px; color:#fff; padding: 0 10%; margin-bottom:70px; opacity:0; transition:0.6s; transition-delay: .6s;}
#header .pc_nav > div.side_menu h1 span{font-weight:500;}
#header .pc_nav > div.side_menu > ul {width:100%; box-sizing:border-box; display: grid; grid-template-columns: repeat(5, 1fr); flex-direction: row; padding: 0 10%; margin-left:-30px;}
#header .pc_nav > div.side_menu > ul > li { padding:0 30px; border-right:1px solid rgba(255,255,255,0.08); position:relative; bottom:-20px; opacity:0; transition:0.6s;}
#header .pc_nav > div.side_menu > ul > li:nth-child(1){transition-delay: 0.9s;}
#header .pc_nav > div.side_menu > ul > li:nth-child(2){transition-delay: 1.1s;}
#header .pc_nav > div.side_menu > ul > li:nth-child(3){transition-delay: 1.3s;}
#header .pc_nav > div.side_menu > ul > li:nth-child(4){transition-delay: 1.5s;}
#header .pc_nav > div.side_menu > ul > li:last-child{border:0; transition-delay: 1.7s;}
#header .pc_nav > div.side_menu > ul > li > a {padding:5px 0; font-size:30px; font-weight: 400; display: flex; align-items: center; color:#fff;}
#header .pc_nav > div.side_menu > ul > li > a i { font-size: 22px; font-weight: 600; display: flex; align-items: center; margin-left: 20px;}
#header .pc_nav ul li .gnb_lists2 { display: flex;  width: 100%; flex-direction: column; padding-top: 15px;}
#header .pc_nav ul li .gnb_lists2 li {margin-right: 30px;}
#header .pc_nav ul li .gnb_lists2 a{display: flex; align-items: center; font-size: 17px; line-height: 1.3; padding:10px 0; font-weight: 300; color:#888; transition:ease .4s;}
#header .pc_nav a {transition: ease .2s;}
#header .pc_nav ul li .gnb_lists2 a::before{content:''; display:block; width:0px; height:2px; background:var(--main-color); transition:ease .3s;}
#header .pc_nav ul li .gnb_lists2 a:hover{color:var(--main-color); font-weight:500;}
#header .pc_nav ul li .gnb_lists2 a:hover::before{width:10px; margin-right:3px;}
#header .pc_nav .side_copy{position:absolute; width:100%; padding:0 10%;  bottom:80px; left:0; display: flex ; flex-direction: row; justify-content: space-between;}
#header .pc_nav .side_copy p{color:#555; font-size:15px; font-weight:500;}


#header .pc_nav.active > div.side_menu h1{opacity:1;}
#header .pc_nav.active > div.side_menu > ul > li{opacity:1; bottom:0;}



html.hidden_html{overflow:hidden;}
html.hidden_html .header_center{opacity:0;}
html.hidden_html #header .header_wrap{background:none;}
html.hidden_html #header .header_wrap .header_logo a{background:none;}
html.hidden_html #header .header_wrap .header_logo img{opacity:1;}
html.hidden_html #header .header_wrap .header_center .gnb li .header_fix{color:#fff;}
html.hidden_html #header .header_wrap .header_right .language{color:#fff;}
html.hidden_html #header .header_wrap .header_right .btn_menu rect{fill:#fff;}
html.hidden_html #header .header_wrap .header_right .btn_menu rect:nth-child(1){transform:rotate(45deg); x: 23; y: 0;}
html.hidden_html #header .header_wrap .header_right .btn_menu rect:nth-child(2){display:none;}
html.hidden_html #header .header_wrap .header_right .btn_menu rect:nth-child(3){transform:rotate(-45deg); x: -11; y: 32;}






/* 퀵메뉴 */
#quickMenu{position: fixed; z-index: 9999; height:400px; bottom: 280px; right:-90px; transition: all 0.8s ease-in-out;}
#quickMenu.fixed{right:-50px;}
.brochure-quick{position: absolute; top: 0; left:-90px; display: flex; align-items: flex-start; justify-content: center;
    width: 50px; height: 200px; padding: 40px 10px 20px; background-color: var(--main-color); box-sizing: border-box; border-radius: 10px 0 0 0;
    transition: all 0.4s ease-in-out;}
.brochure-quick span{top:15px; position: relative; font-size:16px;  letter-spacing: -1px; color: #fff; font-weight: 500;  white-space: nowrap;
    transform: rotate(90deg) translateY(5px); transition: all 0.8s ease-in-out; will-change: transform;}
.brochure-quick i{position: absolute; bottom:20px; left: 50%; margin-left:-7px; font-size: 20px; color: #fff; transform: translateX(-8px);
      transition: all 0.8s ease-in-out; will-change: transform;}
.contact-quick{position: absolute; top: 200px; left:-90px; display: flex; align-items: flex-start; justify-content: center;
    width: 50px; height: 200px; padding: 40px 10px 20px; background-color: #000; box-sizing: border-box; border-radius:  0 0 0 10px;
    transition: all 0.4s ease-in-out;}
.contact-quick span{top:15px; position: relative; font-size:16px;  letter-spacing: -1px; color: #fff; font-weight: 500;  white-space: nowrap;
    transform: rotate(90deg) translateY(5px); transition: all 0.8s ease-in-out; will-change: transform;}
.contact-quick i{position: absolute; bottom:20px; left: 50%; margin-left:-7px; font-size: 15px; color: #fff; transform: translateX(-8px);
    transition: all 0.8s ease-in-out; will-change: transform;}
.brochure-quick:hover{left:-110px; width:60px;}
.contact-quick:hover{left:-110px; width:60px;}

/* 푸터 */
#footer {background: #181818 ; padding:90px 0 10px;}
#footer .footer_wrap {width: 80%; height:100%; display: flex; align-items: flex-start; justify-content: center; flex-direction: column ; margin: 0 auto;}
#footer .footer_wrap .ft_logo{margin-bottom:40px;}
#footer .footer_wrap .ft_top{margin-bottom:30px; display:flex; width:100%; justify-content: space-between; flex-direction: row;}
#footer .footer_wrap .ft_top > a{color:var(--main-color); font-size: 16px; font-style: normal; font-weight: 500; line-height: normal;}
#footer #top_btn {position: fixed; display:none; bottom: 20px; right: 20px; width: 56px; height: 56px; border: 0; border-radius:15px; background-color: var(--main-color);}
#footer #top_btn i {color: #fff; font-size: 20px;}
#footer .footer_wrap.m_only {display: none;}

#footer .footer_wrap .footer_inner {display:flex; justify-content: space-between; width:100%;}
#footer .footer_wrap .footer_info {color:#fff; display:flex;}
#footer .footer_wrap .footer_info dl{font-size:14px; display:flex; line-height:1.75; margin-bottom:5px;}
#footer .footer_wrap .footer_info dl dt{margin-right:10px;}
#footer .footer_wrap .footer_info2 dl{align-items: center;}
#footer .footer_wrap .footer_info2 dl:after{content:''; margin:0 15px; display:block; width:1px; height:9px; background:#777}
#footer .footer_wrap .footer_info2 dl:last-child::after{display:none;}
#footer .footer_wrap .footer_info2 dd{color:#666;}
#footer .footer_wrap .footer_info3 dt{display: flex; align-items: center; color:#ccc;}
#footer .footer_wrap .footer_info3 dt:after{content:''; margin:0 10px 0 55px; display:block; width:0.5px; height:9px; background:#777}
#footer .footer_wrap .footer_info3 dd{color:#666;}

#footer .footer_wrap .footer_copy{border-top:1px solid #444; width: 100%; display: flex; justify-content: space-between; line-height:80px; margin-top:30px;}
#footer .footer_wrap .footer_copy p {color: #444; font-size: 16px; font-style: normal; font-weight: 400;}
#footer .footer_wrap .footer_copy .logoline {display: flex; align-items: center; gap: 15px;}
#footer .footer_wrap .footer_copy .logoline li{color:#444}
#footer .footer_wrap .footer_copy .logoline li a {color: #666; font-size: 14px; font-style: normal; font-weight: 500; line-height: normal;}
#footer .footer_wrap .footer_copy .logoline li a strong {color: var(--main-color);}


/* 레이아웃 */

#wrapper {padding-top: 0px;}
.tbl_wrap table {border-top: 2px solid #151515;}
.tbl_head01 thead th {color: #151515; text-align: center; height:80px; text-overflow: ellipsis; white-space: nowrap; font-size: 20px; font-style: normal; font-weight: 600; line-height: 20px; /* 100% */}
.tbl_head01 td {overflow: hidden; height:100px; color: #151515; text-overflow: ellipsis; white-space: nowrap; font-size: 20px; font-style: normal; font-weight: 500; line-height: 20px; /* 100% */
    letter-spacing: -0.5px;}
.tbl_head01 .list_num {width: 12%;}
.tbl_head01 .list_date {width: 12%;}
.bo_tit {color: #151515; font-weight: 500; display: flex; align-items: center; width: 100%; height: 100%;}
.bo_tit a { display: flex; align-items: center; width: 100%; height: 100%;}
#bo_list .td_datetime {overflow: hidden; color: #999; text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: 20px; font-style: normal; font-weight: 400; line-height: 20px; /* 100% */ letter-spacing: -0.5px;}
.tbl_head01 tbody tr td{transition: ease .3s;}
.tbl_head01 a:hover {text-decoration: none; font-weight: 600;}
.tbl_head01 a {transition: ease .3s;}
b {color: var(--main-color); font-weight: bold;}
bb {font-weight: bold;}

/* 버튼 */
.more_btn {width:360px; height:58px; border-radius:10px; background-color: var(--main-color); margin: 80px auto 0; transition: ease .3s;}
.more_btn a{color:#fff; font-size: 18px; font-weight: 500; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; transition: ease .3s;}
.more_btn:hover {box-shadow: 0 0 15px rgba(0, 0, 0, 0.20); }
.more_btn:hover a {font-weight: 600;}

#container>div {padding: 150px 0;}

/* 메인 섹션 동영상 */

#container .section_main {width: 100%; height: 100vh; padding-top:0; padding-bottom:0; box-sizing:border-box; display: flex; align-items: center; justify-content: center;
    flex-direction: column; overflow: hidden;}
#container .section_main .main_bg_video {z-index: -10; width: 100%; height: 100%;}
#container .section_main .main_bg_video video {width: 100%; height: 100%; object-fit: cover;}
#container .section_main .main_bg_video::before {content: ''; width: 100%; height: 100%; display: block; background: linear-gradient(180deg, rgba(0, 0, 0, 0.20) 50%, rgba(0, 0, 0, 0.00) 100%); background-blend-mode: darken; position: absolute; top: 0; left: 0;}
#container .section_main .main_title_text {position: absolute; width: 100%; display: flex;}
#container .section_main .main_title{color:#fff;}
#container .section_main .main_title .swiper-slide {padding:0 10%;}
#container .section_main .main_title h1{font-size:65px; line-height:1.2; color:#fff; letter-spacing:-2px; margin-bottom:20px; font-weight:400; position:relative;}
#container .section_main .main_title h1 b{color:#fff; font-weight:600;}
#container .section_main .main_title h3{font-size:22px; color:#fff; margin-bottom:40px; font-weight:100; line-height:1.6; ; position:relative;}
#container .section_main .main_title h3 b{color:#fff; font-weight:300;}
#container .section_main .main_title p{font-size:18px;  color:#aaa; font-weight:200; position:relative;}
#container .section_main .main_title h1,
#container .section_main .main_title h3,
#container .section_main .main_title p{
  opacity:0;
  transform: translateY(20px);
  transition: none;             /* ← 비활성일 땐 애니메이션 끔 */
}
/* 활성 슬라이드일 때만 순차 등장 + 딜레이 부여 */
#container .section_main .main_title .swiper-slide-active h1{
    opacity:1; transform: translateY(0);
    transition: opacity .45s ease, transform .45s ease;
    transition-delay:.15s;
  }
  #container .section_main .main_title .swiper-slide-active h3{
    opacity:1; transform: translateY(0);
    transition: opacity .45s ease, transform .45s ease;
    transition-delay:.30s;
  }
  #container .section_main .main_title .swiper-slide-active p{
    opacity:1; transform: translateY(0);
    transition: opacity .45s ease, transform .45s ease;
    transition-delay:.45s;
  }
#container .section_main .more{position:absolute; transition:ease .4s; right:10%; bottom:15%; font-size:20px; background:var(--main-color) url(/img/main_more.png) no-repeat 80% 80%; color:#fff; padding:30px 80px 100px 30px; border-radius: 20px;}
#container .section_main .more:hover{background:#fff url(/img/main_more_on.png) no-repeat 80% 80%; color:var(--main-color)}
#container .section_main .Main-swiper-pagination{bottom:0; top:inherit; height:9px;}
#container .section_main .Main-swiper-pagination .swiper-pagination-progressbar-fill{ background:var(--main-color); transition: transform linear;  transform-origin: left center;}

/* 4칸 바 스타일 */
.Main-progress-4 {position: absolute; bottom: 0;display: grid;grid-template-columns: repeat(4, 1fr);gap: 0px;width: 100%;height:5px;}
.Main-progress-4 .seg {position: relative; overflow: hidden;}
.Main-progress-4 .seg .fill {position: absolute; left: 0; top: 0; bottom: 0; width: 0%; background: var(--main-color);}



/* 메인 섹션 타이틀 */

#container .section_title {width: 80%; margin: 0 auto 0px; transition: ease .4s;}
#container .section_title .sec_sub {color:var(--main-color); font-size: 18px; width: 100%; font-weight:700; line-height: normal; margin-bottom: 30px;}
#container .section_title .sec_tit {color: #151515; font-size: 50px; font-style: normal; font-weight: 600; line-height:1.3; /* 123.636% */ letter-spacing: -2px;}
#container .section_title .sec_tit b {color: #777; font-weight: 600;}
#container .section_contents {width: 80%; margin: 50px auto 0;}
#container .section_title .btn_more {display: flex; align-items: flex-end; padding-bottom: 9px; margin-left: 20px;}
#container .section_title .btn_more a {width: 50px; height: 50px; border: 1px solid #e8e8e8; display: flex; align-items: center; justify-content: center; transition: ease .3s; transform-origin:center center;}
#container .section_title .btn_more a:hover {border: 1px solid #151515;}
#container .section_title .btn_more a i {font-size: 24px;}

 
/* 메인 섹션 2 */

#container .section_2{overflow: hidden; display:flex;}
#container .section_2 .section_title {width:45%; padding-left:10%; background:#fff; position:relative; z-index: 2; margin:0; display: flex; flex-direction: column; justify-content: center;}
#container .section_2 .section_title h5{font-size:20px; color:#181818; font-weight:400; margin-top:20px; line-height:1.5;}
#container .section_2 .section_title .swiper_button_area {display: flex; margin-top:65px;}
#container .section_2 .section_title .swiper_button_area div{width:72px; height:72px; border-radius:50px; border:1px solid #ccc; cursor: pointer;}
#container .section_2 .section_title .swiper_button_area .ProductSwiper-button-prev{background:url(/img/product_arrow.png) no-repeat center; transform:rotate(180deg); margin-right:15px;}
#container .section_2 .section_title .swiper_button_area .ProductSwiper-button-next{background:url(/img/product_arrow.png) no-repeat center;}
#container .section_2 .section_title .swiper_button_area div:hover{border:1px solid var(--main-color);}
#container .section_2 .section_title .swiper_button_area .ProductSwiper-button-prev:hover{background:var(--main-color) url(/img/product_arrow_on.png) no-repeat center;}
#container .section_2 .section_title .swiper_button_area .ProductSwiper-button-next:hover{background:var(--main-color) url(/img/product_arrow_on.png) no-repeat center;}
#container .section_2 .section_contents{width:55%; margin:0;}


#container .section_2 product_lt{position:relative; overflow:visible;}

#container .section_2 .product_lt ul:after {display:block;visibility:hidden;clear:both;content:""}
#container .section_2 .product_lt li{transition:ease .4s; position:relative;}
#container .section_2 .product_lt li:after{content:''; position:absolute; background:url(/img/Rectangle.png) no-repeat center; z-index: -1; top:0; left:50px; display:block; width:100%; height:100%; background-size:80%;}
#container .section_2 .product_lt li.swiper-slide-next,
#container .section_2 .product_lt li.swiper-slide-prev{transform: scale(0.6);}
#container .section_2 .product_lt li a{display:flex; align-items: flex-end;}
#container .section_2 .product_lt li a div{width:67%;}
#container .section_2 .product_lt li a div img{width:100%; height:520px; object-fit: contain;}
#container .section_2 .product_lt li a p{width:30%; margin-left:3%; font-weight:600; margin-bottom:50px; letter-spacing: -1px; font-size:42px; word-break: keep-all;}



/* 메인 섹션 3 */
#container .section_3{background:url(/img/section3_bg.png) no-repeat center; position:relative; padding:0; height:800px; overflow: hidden;}
#container .section_3 .section_inner{z-index: 3; position:absolute; width: 100%; height: 100%; display: flex; align-items: center; flex-direction: column; justify-content: center;}
#container .section_3 .section_title .sec_tit {color:#fff;}
#container .section_3 .section_contents ul{display:grid;  grid-template-columns: 1fr 1fr 1fr 1fr; gap: 25px;}
#container .section_3 .section_contents ul li{border:1px solid #fff; text-align: center; border-radius:50%; aspect-ratio: 1 / 1;   /* 정사각형 비율 고정 */
    display: flex; flex-direction: column; justify-content: center; align-items: center;}
#container .section_3 .section_contents ul li:nth-child(2){transition-delay: .3s;}
#container .section_3 .section_contents ul li:nth-child(3){transition-delay: .6s;}
#container .section_3 .section_contents ul li:nth-child(4){transition-delay: .9s;}
#container .section_3 .section_contents ul li h1{color:#fff; font-size:55px; font-weight:600;}
#container .section_3 .section_contents ul li h4{color:#fff; font-size:22px; margin-bottom:20px;}
#container .section_3 .section_contents ul li h5{color:#fff; font-size:17px; color:#aaa; font-weight:400;}
#container .section_3 .bg_video {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 0; pointer-events: none; overflow: hidden;}
#container .section_3 .bg_video  .video-inner {width: 100vw; height: 80vw; /* 기본값: 가로 기준 16:9 */}
#container .section_3 .bg_video  video {width: 100%;height: 100%;object-fit: cover;border: none;pointer-events: none;}
#container .section_3::before{content:''; position:absolute; width:100%; height:100%; background:rgba(0,0,0,0.4); top:0; left:0; z-index: 2;}


/* 메인 섹션 4 */
#container .section_4{}
#container .section_4 .section_title{display:flex; flex-direction: row; justify-content: space-between; align-items: flex-end;}
#container .section_4 .section_title .btn_area{display:flex; flex-direction: row;}
#container .section_4 .section_title .btn_area div{width:60px; height:60px; border-radius:50px; border:1px solid #ccc; cursor: pointer;}
#container .section_4 .section_title .btn_area .board-button-prev{background:url(/img/product_arrow.png) no-repeat center; background-size:14px; transform:rotate(180deg); margin-right:10px;}
#container .section_4 .section_title .btn_area .board-button-next{background:url(/img/product_arrow.png) no-repeat center; background-size:14px;}
#container .section_4 .board_swiper{overflow: visible;}
#container .section_4 .board_swiper .swiper-wrapper .swiper-slide a{display:block;}
#container .section_4 .board_swiper .swiper-wrapper .swiper-slide .img{border:1px solid #eee; margin-bottom:10px; overflow: hidden; box-sizing: border-box; border-radius:15px; ;}
#container .section_4 .board_swiper .swiper-wrapper .swiper-slide img{width:100%; }
#container .section_4 .board_swiper .swiper-wrapper .swiper-slide .board{color: var(--main-color); font-size:15px; margin-bottom:3px; font-weight:500; line-height:2;}
#container .section_4 .board_swiper .swiper-wrapper .swiper-slide .subject{font-size:19px; font-weight:600; word-break: keep-all; margin-bottom:8px; line-height:1.4; display: -webkit-box;
    -webkit-box-orient: vertical; -webkit-line-clamp: 2;  overflow: hidden;}
#container .section_4 .board_swiper .swiper-wrapper .swiper-slide time{font-size:14px; color:#777;}



/* 메인 섹션 5 */
#container .section_5 { background:#f7f7f7;}
#container .section_5 .section_contents{width:100%; }
#container .section_5 .animated-title{position: relative; width: 100%; max-width: 100%; height: auto; overflow-x: hidden; overflow-y: hidden;}
#container .section_5 .animated-title .track {white-space: nowrap; will-change: transform; animation: marquee 30s linear infinite;}
#container .section_5 .animated-title .track .content{display:flex; gap:30px; align-items: center;}
#container .section_5 .animated-title .track .content span{background:#fff; height: 80px; border-radius:15px; padding:20px 30px; display: flex; align-items: center;}
#container .section_5 .animated-title2 .track{animation: marquee2 30s linear infinite; position:relative; left:-230%; margin-top:20px;}


@keyframes marquee {
    from {transform: translateX(0);}
    to {transform: translateX(-50%);}
}

@keyframes marquee2 {
    from {transform: translateX(0);}
    to {transform: translateX(50%);}
  }



/* 메인 섹션 6 */
#container .section_6 {}
#container .section_6 .section_contents{display:grid; gap:30px; grid-template-columns: repeat(2, 1fr);}
#container .section_6 .section_contents a{background:#F8F8F8; transition:ease .4s; border-radius:15px; padding: 60px 80px;}
#container .section_6 .section_contents a.faq{background-image: url(/img/faq.png); background-repeat: no-repeat; background-position:95% center ;}
#container .section_6 .section_contents a.contact{background-image: url(/img/contact.png); background-repeat: no-repeat; background-position: 95% center ;}
#container .section_6 .section_contents a h1{font-size:32px; margin-bottom:16px; transition:ease .4s;} 
#container .section_6 .section_contents a p{font-size:18px; color:#555; line-height:1.4; transition:ease .4s;}
#container .section_6 .section_contents a:hover{background:var(--main-color);}
#container .section_6 .section_contents a.faq:hover{background-image: url(/img/faq.png); background-repeat: no-repeat; background-position:  95% center;}
#container .section_6 .section_contents a.contact:hover{background-image: url(/img/contact.png); background-repeat: no-repeat; background-position: 95% center ;}
#container .section_6 .section_contents a:hover h1{color:#fff;} 
#container .section_6 .section_contents a:hover p{color:#fff; opacity: .6;}



/* 서브페이지 메뉴 */
.sub_nav {padding: 0 !important; height: 400px;}
.sub_nav.story {background: url(/img/story_nav.png) no-repeat center; background-size: cover;}
.sub_nav.viscosity {background: url(/img/viscosity_nav.jpg) no-repeat center; background-size: cover;}
.sub_nav.product{background: url(/img/viscosity_nav.jpg) no-repeat center; background-size: cover;}
.sub_nav.news {background: url(/img/news_nav.png) no-repeat center; background-size: cover;}
.sub_nav.cs {background: url(/img/prd_contact_area.jpg) no-repeat center; background-size: cover;}



.sub_nav .nav_wrap {padding: 0 10%; height: 100%; position: relative;}
.sub_nav .nav_wrap .cate_title {position: absolute; top: 165px;}
.sub_nav .nav_wrap .cate_title h1 {color: #FFF; font-size: 42px; font-style: normal; font-weight: 700; margin-bottom:10px; line-height: 140%; /* 81.2px */ letter-spacing: -1.2px;}
.sub_nav .nav_wrap .cate_title p { font-size: 20px; font-style: normal; font-weight: 300; color:#fff; opacity:0.95; line-height: 140%; /* 28px */ letter-spacing: -0.5px;}
.sub_nav .nav_wrap .nav_select {display: flex; height: 80px; width: 100%; align-items: center; position: absolute; bottom: 0;}
.sub_nav .nav_wrap .nav_select a {height: 80px; display: flex; align-items: center; font-size: 16px; color: #fff; font-weight: 500;}
.sub_nav .nav_wrap .nav_select .home a {padding-right: 30px;}
.sub_nav .nav_wrap .nav_select .home::after {margin-left: 0;}
.sub_nav .nav_wrap .nav_select div {margin-right: 30px; display: flex; align-items: center;}
.sub_nav .nav_wrap .nav_select div::after {content: ''; width: 1px; height: 12px; display: inline-block; background: rgba(255, 255, 255, 0.30); margin-left: 30px;}
.sub_nav .nav_wrap .nav_select .nav3 {position: relative; width: 160px; transition: linear .2s;}
.sub_nav .nav_wrap .nav_select .nav3::after {display: none;}
.sub_nav .nav_wrap .nav_select .nav3 > a {display: flex; justify-content: space-between; align-items: center; width: 100%; white-space: nowrap;}
.sub_nav .nav_wrap .nav_select .nav3.list {position:absolute; top:65px; display: flex; flex-direction: column; background: #fff; border-radius: 10px; opacity: 0;
    border: 1px solid #e8e8e8; width: fit-content; padding: 10px 20px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); z-index: 80;}
.sub_nav .nav_wrap .nav_select .nav3 i { transition: linear .3s; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 20px;}
.sub_nav .nav_wrap .nav_select .nav3.menu_on .nav3.list {display: flex; opacity: 1;}
.sub_nav .nav_wrap .nav_select .nav3.menu_on i {transform: rotate(-180deg);}
.sub_nav .nav_wrap .nav_select .nav3.list li a {line-height: 32px; color: #777; font-size: 15px; font-weight: 500; width: 100%; white-space:nowrap; display: block; height: fit-content; transition: ease .3s;}
.sub_nav .nav_wrap .nav_select .nav3.list li a:hover {color: var(--main-color);}
.m_only{display: none;}


.sub_nav .nav_wrap .nav_select .nav3.list li a.active{font-weight:bold; color:var(--main-color)}


/* CEO인사 */
.ceo_sec1 {padding: 150px 10% 85px!important; margin: 0 auto; display: flex; justify-content: space-between;}
.ceo_sec1.m_only {display: none;}
.ceo_sec1 .ceo_comment {width: 50%;}
.ceo_sec1 .ceo_comment .greetings {margin-bottom:15px; font-size: 45px; font-style: normal; font-weight: 600; line-height: 140%; /* 51.8px */ letter-spacing: -1px; }
.ceo_sec1 .ceo_comment .greetings_m{margin-bottom:20px; font-size:24px; word-break: keep-all;}
.ceo_sec1 .ceo_comment .greetings_info {word-break:keep-all; font-size: 20px; font-style: normal; font-weight: 400; line-height: 160%; /* 32px */ letter-spacing: -0.5px; margin-bottom: 76px;}
.ceo_sec1 .ceo_comment .sign {font-size: 18px; font-style: normal; font-weight: 600; line-height: 160%; /* 28.8px */ letter-spacing: -0.5px; text-align: right;}
.ceo_sec1 .ceo_img {width: 40%; height:100%; max-width:700px; border-radius: 15px; overflow: hidden; background-color: #f9f9f9;}

/* 연혁 */
.history {padding: 150px 10% !important; position: relative;}
.history .drawline {width: 1px; height: 0; background-color: var(--main-color); display: block; position:absolute; top: 0; left: 50%; opacity: 0.5;}
.history .year_sec {display: flex; align-items: flex-start; margin-bottom: 100px; position: relative;}
.history .year_sec:last-of-type {margin-bottom: 0;}
.history .year_sec:nth-child(2n+1) {flex-direction: row-reverse;}
.history .year_sec::after {content: ''; width: 17px; height: 17px; border-radius: 100%; position: absolute; top: 10px; left: calc(50% - 8px); background-color: var(--main-color);}
.history .year_sec .year {width: 50%; text-align: right; padding-right: 60px;}
.history .year_sec:nth-child(2n+1) .year {text-align: left; padding-left: 60px; padding-right: 0;}
.history .year_sec .year h1 {color: var(--main-color); font-size: 62px; font-weight: 700; letter-spacing: -1px; line-height: 62px; margin-bottom: 10px;}
.history .year_sec .year p {font-size: 20px; font-weight: 500; line-height: 140%;}
.history .year_sec .year .year_img {width: 100%; border-radius: 15px; background-color: #f9f9f9; margin-top: 30px; aspect-ratio: 9 / 4; overflow: hidden;}
.history .year_sec .year .year_img img {width: 100%; height: 100%; object-fit: cover;}
.history .year_sec .history_cont {width: 50%; padding-left: 60px;}
.history .year_sec:nth-child(2n+1) .history_cont {padding-left: 0; padding-right: 60px;}
.history .year_sec:nth-child(2n+1) .history_cont .year_info {flex-direction: row-reverse; text-align: right;}
.history .year_sec:nth-child(2n+1) .history_cont .year_info .year_g {margin-left: 20px; margin-right: 0;}
.history .year_sec .history_cont .year_info {margin-bottom: 50px; display: flex;}
.history .year_sec .history_cont .year_info .year_g {color: var(--main-color); font-size: 22px; font-weight: 700; margin-right: 20px; word-break: keep-all;}
.history .year_sec .history_cont .year_info li {margin-bottom:10px; font-size: 18px; line-height: 150%; word-break: keep-all; display:flex; justify-content: flex-end; color:#555; flex-direction: row-reverse;}
.history .year_sec .history_cont .year_info li span{margin-right:10px; font-weight:500; color:#000;}
.history .year_sec:nth-child(2n+1) .history_cont .year_info li{flex-direction: row;}
.history .year_sec:nth-child(2n+1) .history_cont .year_info li span{margin-left:10px; }



/* 오시는 길 */
.location {padding: 150px 10% !important;}
.location h1 {font-size: 48px; font-style: normal; font-weight: 600; line-height: 140%; /* 67.2px */ letter-spacing: -1px; }
.location .map {width: 100%; height: 470px; border-radius: 15px; overflow: hidden; box-sizing: border-box; border: 1px solid #e8e8e8; background-color: #f9f9f9; margin: 50px 0;}
.location .location_info {display: flex; justify-content: space-between;}
.location .location_info .adress h2 {font-size: 36px; font-style: normal; font-weight: 700; line-height: 140%; /* 50.4px */ letter-spacing: -0.5px; margin-bottom: 30px;}
.location .location_info .adress .adress_p {display: block; margin-bottom: 10px;}
.location .location_info .adress .adress_p p{padding-left:115px; text-indent:-115px; word-break: keep-all; font-size: 18px; font-style: normal; font-weight: 400; line-height: 20px; /* 120% */ letter-spacing: -0.5px; margin-right:60px; margin-bottom:10px; display: inline-block;}
.location .location_info .adress .adress_p b{margin-right: 20px;}
.location .location_info .link {display: flex; gap: 10px;}
.location .location_info .link .href {width: 233px; height: 138px; border-radius: 15px; box-sizing: border-box; display:flex; justify-content: space-between; transition: ease .3s;}
.location .location_info .link .href a {font-size: 20px; width: 100%; height: 100%; display: flex; padding: 25px; justify-content: space-between; position:relative; font-weight: 600;}
.location .location_info .link .href svg {height: 40px; position: absolute; right: 25px; bottom: 25px;}
.location .location_info .link .href.naver {background-color: #4AB518;}
.location .location_info .link .href.naver a {color: #fff;}
.location .location_info .link .href.kakao {background-color: #FAE100;}
.location .location_info .link .href:hover {background-color: #fff; border:1px solid #e8e8e8;}
.location .location_info .link .href:hover a{color: #151515;}
.location .location_info .link .href.naver:hover svg g path{fill: #4AB518;}





/* 혈액점도 */
.title_area .engtitle {color: var(--main-color); margin-bottom:30px; font-size: 20px; font-style: normal; font-weight: 600; line-height: 140%; /* 28px */ letter-spacing: -0.5px;}
.title_area .line1 {color: #151515; font-size: 48px; font-style: normal; font-weight: 600; line-height: 140%; /* 67.2px */ letter-spacing: -1px;}
.text_area{color: #151515; font-size: 19px; font-style: normal; font-weight: 400; line-height: 160%; /* 35.2px */ margin-bottom:30px; letter-spacing: -0.3px; margin-top: 20px;}
.text_area p{margin:5px 0; font-size:19px; line-height:1.5;}
.text_area p.sub{color:#999; margin: 0; font-size:16px;}

#container .viscosity_content{ width:80%; margin:0 auto; padding: 80px 0;}
#container .viscosity_content .section{ padding: 80px 0;}

#container .viscosity_content .viscosity_sec1 {} 
#container .viscosity_content .viscosity_sec1 .sec1_con {position:relative; border-radius: 15px; overflow: hidden; width:100%;  height: 500px; margin: 120px auto 0; background:url(/img/viscosity_sec1_con.jpg) no-repeat center; background-size:cover;}

#container .viscosity_content .viscosity_sec1 .sec1_con .video {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 0; pointer-events: none; overflow: hidden;}
#container .viscosity_content .viscosity_sec1 .sec1_con .video  .video-inner {width: 100vw; height: 80vw; /* 기본값: 가로 기준 16:9 */}
#container .viscosity_content .viscosity_sec1 .sec1_con .video  video {width: 100%;height: 100%;object-fit: cover;border: none;pointer-events: none;}



#container .viscosity_content .viscosity_sec2 .sec2_con {margin: 60px auto 0; position: relative; padding-bottom: 80px; display:flex;}
#container .viscosity_content .viscosity_sec2 .sec2_con .table{line-height:60px; text-align:center; width: 30%; margin-right: 5%;}
#container .viscosity_content .viscosity_sec2 .sec2_con .table li{font-size:18px; border:1px solid #E8E8E8; background:#f7f7f7; border-radius:15px;}
#container .viscosity_content .viscosity_sec2 .sec2_con .table li.xi-arrow-down{margin:20px 0; border:0; background:none; color:#aaa; display:flex; justify-content: center; align-items: center;}
#container .viscosity_content .viscosity_sec2 .sec2_con img.img{width:100%;}

#container .viscosity_content .conditions_sec1{padding-bottom:0;}
#container .viscosity_content .conditions_sec1 .sec1_con{position:relative; display:flex; justify-content: center; padding:140px 0;}
#container .viscosity_content .conditions_sec1 .sec1_con .circle{align-items: center; justify-content: center; display: flex; width:100px; height:100px; margin-left:-50px; margin-top:-50px; border-radius:50%;  position:absolute; left: 50%; top: 50%;}
#container .viscosity_content .conditions_sec1 .sec1_con .circle span{color:#fff; font-size:18px; text-align:center;}
#container .viscosity_content .conditions_sec1 .sec1_con.en .circle span{font-size:16px;}
.circle01 { transform: rotate(20deg)   translateY(-330px)!important; background:#ef6c6c; transition-delay: 0.3s;}
.circle02 { transform: rotate(60deg)  translateY(-330px)!important; background:#eb4d4d; transition-delay: 0.4s;}
.circle03 { transform: rotate(100deg)  translateY(-330px)!important; background:#e65135; transition-delay: 0.5s;}
.circle04 { transform: rotate(140deg) translateY(-330px)!important; background:#e63535; transition-delay: 0.6s;}
.circle05 { transform: rotate(180deg) translateY(-330px)!important; background:#d83232; transition-delay: 0.7s;}
.circle06 { transform: rotate(220deg) translateY(-330px)!important; background:#c82e2e; transition-delay: 0.8s;}
.circle07 { transform: rotate(260deg) translateY(-330px)!important; background:#b82343; transition-delay: 0.9s;}
.circle08 { transform: rotate(300deg) translateY(-330px)!important; background:#e63559; transition-delay: 1.0s;}
.circle09 { transform: rotate(340deg) translateY(-330px)!important; background:#d63650; transition-delay: 1.1s;}
.circle01 span{ transform: rotate(-20deg)}
.circle02 span{ transform: rotate(-60deg)}
.circle03 span{ transform: rotate(-100deg)}
.circle04 span{ transform: rotate(-140deg)}
.circle05 span{ transform: rotate(-180deg)} 
.circle06 span{ transform: rotate(-220deg)}
.circle07 span{ transform: rotate(-260deg)}
.circle08 span{ transform: rotate(-300deg)}
.circle09 span{ transform: rotate(-340deg)}
#container .viscosity_content .conditions_sec2 table{width:100%; margin-top:30px; border-top:2px solid #666; border-bottom:1px solid #666; line-height:1.3; font-size:18px; border-collapse: collapse;}
#container .viscosity_content .conditions_sec2 table tr{border-bottom:1px solid #ddd;}
#container .viscosity_content .conditions_sec2 table th{background:#F9F9F9; font-weight:500; width:25%; border-right:1px solid #ddd;}
#container .viscosity_content .conditions_sec2 table td{padding:20px}
#container .viscosity_content .conditions_sec2 table thead{font-size:20px;}
#container .viscosity_content .conditions_sec2 table thead tr{border-bottom:1px solid #aaa;}
#container .viscosity_content .conditions_sec2 table thead td{background:#F9F9F9; text-align:center; text-indent:inherit; font-weight:500;}
#container .viscosity_content .conditions_sec2 table tfoot tr:last-child{border:0;}
#container .viscosity_content .conditions_sec2 table tbody th{color:#533C89;}
#container .viscosity_content .conditions_sec2 table tfoot th{color:#8B5B39;}
#container .viscosity_content .conditions_sec2 table tfoot .fst th{color:#C84848;}
#container .viscosity_content .conditions_sec2 table tfoot .last th{color:#A74141;}

#container .viscosity_content .conditions_sec1 .sec3_con{display: flex; padding:70px 0; align-items: center; gap:90px;}
#container .viscosity_content .conditions_sec1 .sec3_con_r{ justify-content: space-between;}
#container .viscosity_content .conditions_sec1 .sec3_con img{border-radius:15px;}
#container .viscosity_content .conditions_sec1 .sec3_con h1{font-size:42px;}
#container .viscosity_content .conditions_sec1 .sec3_con p{font-size:18px; margin-top:10px; margin-bottom:25px;}
#container .viscosity_content .conditions_sec1 .sec3_con ul{font-size:16px; color:#555; line-height:160%; padding-left:20px;}
#container .viscosity_content .conditions_sec1 .sec3_con ul li{list-style:disc;}





/*faq*/
#container .viscosity_content.faq{padding:140px 0;}
#container .viscosity_content.faq h1{font-size:55px; margin-bottom:40px;}
#container .viscosity_content.faq .content_area{ font-size: 0; column-count: 1; row-gap: 20px; column-gap: 20px; border-top:2px solid #000;}
#container .viscosity_content.faq .content_area .box {break-inside: avoid; border-bottom:1px solid #eee; background: #fff;  padding: 35px 60px; cursor: pointer; box-sizing: border-box; transition: 0.4s ease ; position: relative; overflow: visible;}
#container .viscosity_content.faq .content_area .box > div { height: auto; overflow: hidden; }
#container .viscosity_content.faq .content_area .box h2 {font-weight: 500; line-height: 35px; font-size: 20px; display: flex; justify-content: space-between; align-items: center;}
#container .viscosity_content.faq .content_area .box h2 i{margin-right:5px; margin-right: 10px; font-style: normal; color:var(--main-color); font-weight: 600;;}
#container .viscosity_content.faq .content_area .box h2 em{font-style: normal;}
#container .viscosity_content.faq .content_area .box h2 span {width: 18px; height: 2px; background: #000; position: relative;}
#container .viscosity_content.faq .content_area .box h2 span:after {content: ''; display: block; width: 2px; height: 18px; position: absolute; left: 8px; top: -8px; background: #000;  transition:0.4s ease ;}
#container .viscosity_content.faq .content_area .box p {text-align: left; color:rgba(0,0,0,0.7); font-size: 16px; max-height: 0; overflow: hidden; transition:max-height 0.4s ease ; opacity: 0; line-height:1.6;}
#container .viscosity_content.faq .content_area .box.active{background:#f7f7f7;}
#container .viscosity_content.faq .content_area .box.active h2 {}
#container .viscosity_content.faq .content_area .box.active h2 span {}
#container .viscosity_content.faq .content_area .box.active h2 span:after {transform:rotate(90deg); background: #fff;}
#container .viscosity_content.faq .content_area .box.active p {max-height: 300px; opacity: 1; margin-top: 20px; transition: max-height 0.4s ease, opacity 0.4s ease;}














.bo_sch .bo_sch_cls {display: none;}



html.hidden_html {overflow: hidden;}








@media (max-width: 1260px) {
    #header .header_wrap{padding:0 7%;}
    #header .header_wrap .header_center .gnb li{width:85px;}
    #header.on .header_wrap .header_center .gnb li{width:90px}
    #header .header_wrap.depth2 .gnb_sub li .gnb_lists li a{font-size:15px;}
    #header.on .header_wrap.depth2.pc_only .gnb_sub > li{width:160px;}

    #container .section_title{width:86%;}
    #container .section_contents{width:86%;}
    #container > div{padding:100px 0;}
    #container .section_main .main_title h1{font-size:55px;}
    #container .section_main .main_title .swiper-slide {padding:0 7%;}
    #container .section_main .more{right:7%; bottom:10%;}
    #container .section_title .sec_tit{font-size:45px;}
    #container .section_2 .section_title{width:45%; padding-left:7%;}
    #container .section_2 .section_contents{width:55%;}
    #container .section_2 .section_title .swiper_button_area div{width:45px; height:45px; }
    #container .section_2 .section_title .swiper_button_area .ProductSwiper-button-prev{background-size:15px; margin-right:8px}
    #container .section_2 .section_title .swiper_button_area .ProductSwiper-button-next{background-size:15px;}
    #container .section_3 .section_contents ul{gap:15px;}
    #container .section_3 .section_contents ul li h1{font-size:45px;}
    #container .section_3 .section_contents ul li h4{font-size:19px; margin-bottom:15px;}
    #container .section_3 .section_contents ul li h5{font-size:15px;}
    #container .section_4 .section_title .btn_area div{width:45px; height:45px;}
    #container .section_5 .animated-title .track .content{gap:15px;}
    #container .section_5 .animated-title2 .track{margin-top:14px;}
    #container .section_5 .animated-title .track .content span{height:60px;}
    #container .section_5 .animated-title .track .content span img{height:30px;}
    #container .section_6 .section_contents{gap:15px;}
    #container .section_6 .section_contents a{padding:60px;}
    #container .section_6 .section_contents a h1{font-size:27px;}
    #container .section_6 .section_contents a p{font-size:16px;}

    #footer .footer_wrap{width:86%;}
    #footer .footer_wrap .footer_inner{flex-direction: column;}

    .sub_nav .nav_wrap{padding:0 7%;}

    .ceo_sec1{padding:100px 7% 85px!important}
    .history{padding:100px 7%!important;}
    .location{padding:100px 7%!important;}

    .ceo_sec1 .ceo_comment .greetings_m{font-size:20px; word-break: keep-all;}
    .ceo_sec1 .ceo_comment .greetings_info{font-size:18px;}



    #container .viscosity_content .viscosity_sec1 .sec1_con{margin-top:70px;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .img{width:60%;}
    #container .viscosity_content .viscosity_sec2 .sec2_con img{width:100%;}


    .text_area{word-break: keep-all; font-size:19px;}
    .text_area br{display:none;}

    #container .viscosity_content{padding:40px 0; width:86%;}
    #container .viscosity_content .viscosity_sec2{padding-bottom:0;}
    #container .viscosity_content .viscosity_sec2 .sec2_con{
        flex-direction: column-reverse;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .table{margin:0; margin-top:50px; display:flex; width:100%;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .table li{width:22%;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .table li.xi-arrow-down{width: 6%;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .table li.xi-arrow-down::before{transform:rotate(-90deg)}
    #container .viscosity_content .viscosity_sec2 .sec2_con .img{width:80%; margin:0 auto;}

    #container .viscosity_content .conditions_sec2 table{font-size:16px;}

    #container .viscosity_content .conditions_sec1 .sec3_con{gap:60px; padding:40px 0;}
    #container .viscosity_content .conditions_sec1 .sec3_con img{width:50%;}
    #container .viscosity_content .conditions_sec1 .sec3_con h1{font-size:35px;}
    #container .viscosity_content .conditions_sec1 .sec3_con p{font-size:17px;}
    #container .viscosity_content .conditions_sec1 .sec3_con ul{font-size:15px;}


    .location .location_info .adress h2{font-size:32px;}
    .location .location_info .link .href{width:175px; height:110px;}
    .location .location_info .link .href a{font-size:19px}
    .location .location_info .link .href svg{width:32px;}
}




/* 태블릿 */
@media (max-width: 1024px) {

    .pc_only {display: none;}
    /* 헤더 */
    #header {height: 80px;}
    #header .header_wrap {padding: 0 5%; height: 60px;}    
    #header .header_wrap .header_logo {width: fit-content;}
    #header .header_wrap .header_logo a{background-size: auto 23px;}
    #header .header_wrap .header_logo img {height: 23px;}
    #header .header_wrap .header_center {display: none;}
    #header .header_wrap .header_center .gnb li .header_fix {height: 80px;}
    #header .header_wrap .header_right .language {display: none;}
    #header .header_wrap .header_right .btn_menu {margin-right: -10px;}   


    
    #header .header_wrap.mobile_menu {display: none; flex-direction:column; background-color:rgba(0,0,0,0.8); width: 100%; height: 100vh; padding:80px 0;  backdrop-filter: blur(10px);
        z-index:999; position: absolute; top: -100vh; left: 0; align-items: flex-start; justify-content: flex-start; visibility: visible; 
         transition:esae .8s; overflow: hidden;}
   
    html.hidden_html #header .header_wrap.mobile_menu{background-color:rgba(0,0,0,0.8); }
    
    #header .header_wrap.mobile_menu.m_on{top:0vh;}
    
    #header .header_wrap.mobile_menu.m_on #depth2_top {display: flex; align-items: center; justify-content: space-between; height: 79px; width: 100%; 
        box-sizing: border-box; border-bottom: 1px solid #e8e8e8; padding: 0 5%;}
    #header .header_wrap.mobile_menu #depth2_top .btn_menu {margin-right: -10px;}
    #header .header_wrap.mobile_menu .gnb_sub {flex-direction: column; width: 100%; border-top:1px solid rgba(255,255,255,0.15)}
    
    #header .header_wrap.mobile_menu .gnb_sub > li {border-right: 0;  display:block; width: 100%; position:relative; border-bottom:1px solid rgba(255,255,255,0.10); opacity:0; transform: translateY(10px); transition: opacity 0.5s ease, transform 0.5s ease;}
    #header .header_wrap.mobile_menu .gnb_sub > li:has(.gnb_lists.m_on) a i {transform: rotate(180deg); transform-origin: center; color: var(--main-color);}

    #header .header_wrap.mobile_menu .engver {display:block; height:42px; border-radius: 8px; background:var(--main-color); color: #fff; position: absolute; bottom: 80px; width: 90%; left: 5%;}
    #header .header_wrap.mobile_menu .engver > a {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #fff; cursor: pointer; font-size: 16px; font-weight: 400;}

    #header .header_wrap.mobile_menu .gnb_sub > li a {cursor:pointer; font-size: 19px; font-weight: 400; color:#fff; display: flex; align-items: center; justify-content: space-between; width: 100%; 
        line-height: 60px; position: relative; padding: 0 5% ;}
    #header .header_wrap.mobile_menu .gnb_sub > li a i {font-size: 15px; transition: linear .3s;}
    #header .header_wrap .gnb_lists {display: none; flex-direction: column; margin: 0 5%; }
    #header .header_wrap.mobile_menu .gnb_sub > li:hover {background-color: inherit;}
    #header .header_wrap.mobile_menu .gnb_sub li .gnb_lists li a {padding: 0; padding-left:10px; font-weight:300; font-size:15px; color:rgba(255,255,255,0.8); text-align: left; width: 100%; display: flex; line-height: 35px; align-items: center; justify-content: flex-start;}
     #header .header_wrap.mobile_menu .gnb_sub li .gnb_lists li:last-child{margin-bottom:20px;}









    
    /* 푸터 */
    #footer .footer_wrap .footer_info {width: 100%;}
    #footer { padding:40px 0;}
    #footer .footer_wrap{width:90%;}
    #footer .footer_wrap .ft_logo{margin-bottom:20px}
    #footer .footer_wrap .ft_logo img{height:20px}
    #footer .footer_wrap .footer_info dl{font-size:13px; margin-bottom:0;}
    #footer #top_btn {right: 20px; bottom: 20px;}
    #footer .footer_wrap .footer_copy{line-height:1.5; margin-top:15px;  padding-top:10px;}
    #footer .footer_wrap .footer_copy p{font-size:12px;}
    #footer .footer_wrap .footer_copy .logoline{}
    #footer .footer_wrap .footer_copy .logoline li a{font-size:12px;}


    /* 메인 */
    
    #container .section_main .main_title h1{font-size:55px;}
    #container .section_main .main_title h3{font-size:19px;}
    #container .section_main .main_title p{font-size:16px;}
    #container .section_main .main_title .swiper-slide {padding:0 7%;}
    #container .section_main .more{right:7%; bottom:10%; padding:20px 60px 90px 20px; font-size:16px; background-size:30px;}


    #container .section_main .main_title_text .main_title.pc_only img {width: 80%;}
    #container .section_main .main_title_text .main_title.m_only {display: none;}
    #container .section_title {width: 90%; margin: 0 auto 30px;}
    #container .section_contents {width: 90%; margin-top:30px;}
    #container .section_main .main_sub {font-size: 24px;}
    #container .section_title .sec_tit {font-size: 36px; line-height: 130%;}
    #container .section_title .sec_sub {font-size: 15px; margin-bottom:15px;}


    #container .section_2{flex-direction: column;}
    #container .section_2 .section_title{width:100%; padding:0 7%;}
    #container .section_2 .section_title .swiper_button_area{margin:40px 0;}
    #container .section_2 .section_contents {width: 100%;}
    #container .section_contents .ProductSwiper{padding:0 7%;}
    #container .section_2 .section_title h5{font-size:17px; margin-top:10px;}

    #container .section_3{height:80vh;}
    #container .section_3 .bg_video .video-inner{height:100vh;}
    #container .section_3 .section_contents ul li h1{font-size:30px;}
    #container .section_3 .section_contents ul li h4{font-size:17px; margin-bottom:10px;}
    #container .section_3 .section_contents ul li h5{font-size:13px;}

    #container .section_6 .section_contents a{padding:40px;}
    #container .section_6 .section_contents a.contact{background-size:100px; background-position:90% 10%;}
    #container .section_6 .section_contents a.faq{padding:40px; background-size:100px; background-position:90% 10%;}
    
    
    /* 서브페이지 */
    .sub_nav {height: 220px;}
    .sub_nav .nav_wrap {padding: 0 5%; display: flex; align-items: center;}
    .sub_nav .nav_wrap .cate_title {top: inherit;}
    .sub_nav .nav_wrap .cate_title h1 {font-size: 22px; letter-spacing: -0.5px; margin-bottom:5px;}
    .sub_nav .nav_wrap .cate_title p{font-size:15px;}
    .sub_nav .nav_wrap .nav_select{height:60px;}
    .sub_nav .nav_wrap .nav_select a{height:60px; font-size:14px;}
        
        
    .title_area .line1 {font-size: 38px;}
    .title_area .line2 {font-size: 48px;}
    .text_area {font-size: 16px;}
    .text_area p{font-size:16px;}

    .sub_nav .nav_wrap .nav_select .nav3.menu_on:before{content:''; display:none; z-index: 1; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.2);}
    .sub_nav .nav_wrap .nav_select .nav3.menu_on:before{display:block; }
    .sub_nav .nav_wrap .nav_select .nav3.list{top: inherit;position: fixed;bottom: 0;width: 100%;left: 0;border-bottom-right-radius: 0;border-bottom-left-radius: 0;padding: 20px; }
    .sub_nav .nav_wrap .nav_select .nav3.list li a{line-height:45px;}
    .sub_nav .nav_wrap .nav_select .nav3.list li{border-bottom:1px solid #eee;}
    .sub_nav .nav_wrap .nav_select .nav3.list li:last-child{border-bottom:0;}

    .ceo_sec1{padding:70px 5%!important}
    .ceo_sec1 .ceo_comment{width:70%;}
    .ceo_sec1 .ceo_img{width:27%;}
    .ceo_sec1 .ceo_comment .sign{text-align:left;}


    .history .year_sec .year .year_img{width:50%;}









    .vision_sec3 .card_sec {gap: 12px;}
    .vision_sec3 .card_sec .card {width: 100%; padding: 30px;}
    .vision_sec3 .card_sec .card .card_txt .eng {font-size: 20px;}
    .vision_sec3 .card_sec .card .card_txt .eng_sub {font-size: 16px;}
    .vision_sec3 .card_sec .card .card_txt .eng_sub br {display: none;}
    .vision_sec1 {padding: 100px 0 0!important;}
    .vision_sec1 img {width: 100%;}
    .vision_sec2 {height: 1200px;}
    .vision_sec2 .sec2_con {display: flex; flex-direction: column; align-items: center; margin-top: 60px; transform: inherit;}
    .vision_sec2 .sec2_con .sec2_logo {width: 300px; height: 300px; order: 2; margin: 70px 0; box-shadow: 0px 0px 36px rgba(129, 193, 52, 1.5);}
    .vision_sec2 .sec2_con .sec2_logo::after {width: 380px; height: 380px;}
    .vision_sec2 .sec2_con .sec2_sub {margin-right: 0; text-align: center; order: 1; position: relative; right: inherit; top: inherit; z-index: 5;}
    .vision_sec2 .sec2_con .sec2_sub .sec2_sub_t {font-size: 24px; text-align: center;}
    .vision_sec2 .sec2_con .sec2_sub .sec2_sub_p {font-size: 18px; text-align: center;}
    .vision_sec2 .sec2_con .sec2_sub::before {right: inherit; top: inherit; width: 11px; height: 11px; bottom: -43px; left: calc(50% - 5px); z-index: 10;}
    .vision_sec2 .sec2_con .sec2_sub::after {right: inherit; top: inherit; width: 21px; height: 21px; bottom: -53px; left: calc(50% - 10px);}
    .vision_sec2 .sec2_con .sec2_sub2 {margin-left: 0; text-align: center; order: 3; position: relative; left: inherit; top: inherit; z-index: 5; bottom: inherit;}
    .vision_sec2 .sec2_con .sec2_sub2 .sec2_sub_t {font-size: 24px; text-align: center;}
    .vision_sec2 .sec2_con .sec2_sub2 .sec2_sub_p {font-size: 18px; text-align: center;}
    .vision_sec2 .sec2_con .sec2_sub2::before {right: inherit; bottom: inherit; width: 11px; height: 11px; top: -32px; left: calc(50% - 5px); z-index: 10;}
    .vision_sec2 .sec2_con .sec2_sub2::after {right: inherit; bottom: inherit; width: 21px; height: 21px; top: -32px; left: calc(50% - 10px);}
    .viscosity_sec1 {padding: 100px 5% 85px !important;}
    .vision_sec1 .title_area {margin-top: 0;}
    .vision_sec2 .title_area {margin-top: 80px;}
    .viscosity_sec1 .sec1_con {width: 100%; margin: 80px auto 0; height: 400px;}
    .viscosity_sec2 .sec2_con .sec2_storyline .sec2_left {width: 100%; padding: 0 50px;}
    .viscosity_sec2 .sec2_con .sec2_storyline .sec2_right {padding: 0 50px; width: 100%;}
    .viscosity_sec2 .sec2_con .sec2_storyline2 .sec2_right {width: 100%; padding: 0 50px;}
    .viscosity_sec2 .sec2_con .sec2_storyline2 .sec2_left {width: 100%; padding: 0 50px;}
    .viscosity_sec2 .sec2_con .line1_title {font-size: 32px;}
    .viscosity_sec2 .sec2_con .line1_sub {font-size: 18px;}
    .viscosity_sec2 .sec2_con .line1_info p {font-size: 18px;}
    .viscosity_sec2 .sec2_con .line1_info p br {display: none;}
    .viscosity_sec2 .sec2_con .sec2_storyline .sec2_left img {width: 100%;}
    .viscosity_sec2 .sec2_con .sec2_storyline2 .sec2_left img {width: 100%;}


    .ceo_sec1 .ceo_comment .greetings_info {font-size: 18px; margin-top: 50px;}

    /* 연혁 */
    .history {padding: 100px 5% !important;}
    .history .drawline {left: 5%}
    .history .year_sec {flex-direction: column; padding-left:50px; margin-bottom: 70px;}
    .history .year_sec:last-of-type {margin-bottom: 0;}
    .history .year_sec .year {width: 100%; padding-right: 0; text-align: left;}
    .history .year_sec .history_cont {width: 100%; padding-left: 0; margin-top: 40px;}
    .history .year_sec .year h1 {font-size: 42px;line-height: normal; margin-bottom: 5px;}
    .history .year_sec .year p{font-size: 20px; }
    .history .year_sec::after {width: 9px; height: 9px; left: -4px; top: 20px;}
    .history .year_sec .year .year_img {margin-top: 15px; border-radius: 15px;}
    .history .year_sec .history_cont .year_info .year_g {word-break: keep-all; font-size: 20px; margin-right: 20px;}
    .history .year_sec .history_cont .year_info p {font-size: 18px;}
    .history .year_sec .history_cont .year_info {margin-bottom: 20px;}
    .history .year_sec:nth-child(2n+1) .year {padding-left: 0;}
    .history .year_sec:nth-child(2n+1) {flex-direction: column;}
    .history .year_sec:nth-child(2n+1) .history_cont {padding-right: 0;}
    .history .year_sec:nth-child(2n+1) .history_cont .year_info {flex-direction: row; text-align: left;}
    .history .year_sec:nth-child(2n+1) .history_cont .year_info .year_g {word-break: keep-all; font-size: 16px; margin-right: 20px; margin-left: 0;}
    .history .year_sec:nth-child(2n+1) .history_cont .year_info li{flex-direction:row-reverse}

    .location{padding: 100px 5% !important;}
    
    .location h1{font-size:38px;}
    .location .map {margin-top: 30px;}

    .location .location_info {flex-direction: column;}
    .location .location_info .adress h2 {margin-bottom: 20px;}
    .location .location_info .adress .adress_p p {font-size: 18px;}
    .location .location_info .link {margin-top: 30px;}
    .location .location_info .link .href {width: 100%; height: 80px;}
    .location .location_info .link .href a{display: flex; align-items: center; font-size: 18px;}
    .location .location_info .link .href svg {position: static; right: inherit; bottom: inherit;}


    #container .viscosity_content{width:90%;}
    #container .viscosity_content .viscosity_sec1{padding:40px 0!important;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .table li{width:32%; font-size:14px;}
    #container .viscosity_content .conditions_sec1{padding:40px 0}
    #container .viscosity_content .conditions_sec1 .sec3_con h1{font-size:28px;}
    #container .viscosity_content .conditions_sec1 .sec3_con p{margin-bottom:15px;}


    .more_btn{width:280px; height:54px; margin:50px auto 100px}
    .more_btn a{font-size:15px;}
    .tbl_head01 thead th{font-size:15px; height:45px;}
    .tbl_head01 td{font-size:18px; height:70px;}
    #bo_list .td_datetime{font-size:18px;}
    
}


/* 모바일 */
@media (max-width: 768px) {

    .m_only{display:block;}

    @keyframes fadeInRight {
        0% {
          opacity: 0;
          left: 20%;
        }
        100% {
          opacity: 1;
          left: 0;
        }
      }

      #header .header_wrap .header_logo img{height:20px;}
      #header .header_wrap .header_logo a{background-size:auto 20px;}

    #header .header_wrap.mobile_menu.m_on{padding-top:60px;}
   
    #container .section_main .main_title .swiper-slide{padding:0 20% 0 5%;}
    #container .section_main .main_title h1{font-size:35px; margin-bottom:8px;}
    #container .section_main .main_title h3{font-size:16px; margin-bottom:10px; line-height:1.4; word-break:keep-all;}
    #container .section_main .main_title p{font-size:14px; word-break:keep-all;}
    #container .section_main .more{right:4%; bottom:4%; padding:18px 40px 60px 18px; background-size:23px; background-position:85% 85%;;}

    #container > div{padding:80px 0}
    #container .section_title .sec_sub{font-size:12px; margin-bottom:10px;}
    #container .section_title .sec_tit{font-size:29px;}


    #container .section_2 .section_title h5{font-size:14px; margin-top:5px; color:#555;}
    #container .section_2 .section_title .swiper_button_area{display:none;}
    #container .section_2 .splide.m_only{margin-top:20px;}
    #container .section_2 .splide.m_only .splide__list li a{padding:30px; background:#f7f7f7; display:block;}
    #container .section_2 .splide.m_only .splide__list li a h1{font-size:20px; margin-bottom:5px;}
    #container .section_2 .splide.m_only .splide__list li a p{font-size:12px; color:#555; word-break: keep-all; line-height:1.3; height:32px;}
    #container .section_2 .splide.m_only .splide__list li img{width:95%; margin-top:10px; position:relative; right:-8%; }



    

    #container .section_3 {height:100vh;}
    #container .section_3 .section_contents{margin:0;}
    #container .section_3 .section_contents ul{grid-template-columns: 1fr 1fr;}

    #container .section_4{padding:80px 0;}
    #container .section_4 .section_title .btn_area{display:none;}
    #container .section_4 .board_swiper .swiper-wrapper .swiper-slide .board{font-size:13px;}
    #container .section_4 .board_swiper .swiper-wrapper .swiper-slide .subject{font-size:16px;}
    #container .section_4 .board_swiper .swiper-wrapper .swiper-slide time{font-size:12px;}

    #container .section_5 .animated-title .track .content{gap:8px;}
    #container .section_5 .animated-title .track .content span{height:50px; padding:10px 15px; border-radius:10px;}
    #container .section_5 .animated-title .track .content span img{height:20px;}
    #container .section_5 .animated-title2 .track{margin-top:8px;}
    #container .section_5 .animated-title3 .track{margin-top:8px;}

    #container .section_6 .section_contents{grid-template-columns: 1fr;}
    #container .section_6 .section_contents a.faq{padding:25px; background-position:90% center;}
    #container .section_6 .section_contents a.contact{padding:25px; background-position:90% center;}
    #container .section_6 .section_contents a h1{font-size:18px; margin-bottom:8px;}
    #container .section_6 .section_contents a p{font-size:14px;}

    #footer{padding:40px 0 80px;}
    #footer .footer_wrap .footer_info{flex-direction: column;}
    #footer .footer_wrap .footer_info dl{font-size:11px; align-items: flex-start;}
    #footer .footer_wrap .footer_info dl dt{width:25%; margin:0;}
    #footer .footer_wrap .footer_info dl:after,
    #footer .footer_wrap .footer_info dl dt:after{display:none;}
    #footer .footer_wrap .footer_info dl dd{word-break: keep-all; width:75%;}
    #footer .footer_wrap .footer_copy{flex-direction: column;}
    #footer .footer_wrap .footer_copy .logoline{margin-top:20px;}
    #footer .footer_wrap .footer_copy .logoline li a{font-size:10px;}

    #footer #top_btn{z-index: 3; bottom:60px; right:15px; width:50px; height:50px;}
    #quickMenu{bottom:-45px; width:100%; height:43px; right:inherit; display: flex; flex-direction: row;}
    #quickMenu.fixed{bottom:0;  right:inherit;}
    .brochure-quick, .contact-quick{border-radius:0; position:relative; width:50%; height:100%; top:inherit; left:inherit; padding:0; 
        flex-direction: row; align-items: center; justify-content: center;}
    .brochure-quick span, .contact-quick span{transform:inherit; top:inherit; font-size:13px;}
    .brochure-quick i, .contact-quick i{position:relative; margin:0; font-size:13px; transform: inherit; margin-left:5px; bottom:inherit; left: inherit; top: inherit;}


    .sub_nav .nav_wrap .nav_select div{margin-right:10px;}

    .sub_nav .nav_wrap .nav_select{height:40px;}
    .sub_nav .nav_wrap .nav_select a{height:40px;}


    #container .ceo_sec1{padding:50px 5%!important;}
    #container .ceo_sec1 .ceo_comment .greetings{font-size:25px;}
    #container .ceo_sec1 .ceo_comment .greetings_m{font-size:16px;}
    #container .ceo_sec1 .ceo_comment .greetings_info{font-size:14px; margin-top:10px; margin-bottom: 30px;}
    #container .ceo_sec1 .ceo_comment .sign{font-size:13px;}

    #container .history{padding:50px 5%!important; margin:40px 0;}
    #container .history .year_sec{padding-left:25px; margin-bottom:30px;}
    #container .history .year_sec .year h1{font-size:25px;}
    #container .history .year_sec .year .year_img{width:100%;}
    #container .history .year_sec .history_cont{margin-top:20px;}
    #container .history .year_sec .history_cont .year_info .year_g{font-size:17px;}
    #container .history .year_sec .history_cont .year_info li{font-size:14px; margin-bottom:4px;}


    #container .location{padding:50px 5%!important;}
    #container .location h1{font-size:25px;}
    #container .location .map{margin:15px 0; border-radius: 5px; height:320px;}
    #container .location .location_info .adress h2{font-size:18px; margin-bottom:10px;}
    #container .location .location_info .adress .adress_p{margin-bottom:0;}
    #container .location .location_info .adress .adress_p p{font-size:13px; padding-left: 85px; text-indent: -85px;}
    #container .location .location_info .link .href a{font-size:14px;}
    #container .location .location_info .link .href svg{width:15px;}

    .title_area .engtitle{font-size: 12px; margin-bottom: 10px;}
    .title_area .line1{font-size:25px;}
    .text_area{font-size:14px; margin:10px 0;}
    .text_area p{font-size:13px;}

    #container .viscosity_content{padding:50px 0;}
    #container .viscosity_content .viscosity_sec1{padding:0!important;}
    #container .viscosity_content .viscosity_sec1 .sec1_con{margin:30px 0;}
    #container .viscosity_content .viscosity_sec2{padding:0 0;}
    #container .viscosity_content .viscosity_sec2 .sec2_con{margin-top:20px;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .table{margin-top:20px;}
    #container .viscosity_content .viscosity_sec2 .sec2_con .table li{font-size:12px; word-break: keep-all; padding:0 5px; line-height:1.3; 
        display: flex; justify-content: center; align-items: center;}
    #container .viscosity_content .viscosity_sec2 .sec2_con{padding-bottom:0;}
    #container .viscosity_content .viscosity_sec1 .sec1_con{height:240px;}


    #container .viscosity_content .conditions_sec1{padding:0;}
    #container .viscosity_content .conditions_sec1 .sec1_con{padding:80px 0;}
    #container .viscosity_content .conditions_sec1 .sec1_con > img{width:60%; max-width:200px;}
    #container .viscosity_content .conditions_sec1 .sec1_con .circle{width:60px; height:60px; margin-left:-30px; margin-top:-30px;}
    #container .viscosity_content .conditions_sec1 .sec1_con .circle span{font-size:13px;}

    .circle01 { transform: rotate(20deg)   translateY(-140px)!important; background:#ef6c6c; transition-delay: 0.3s;}
    .circle02 { transform: rotate(60deg)  translateY(-140px)!important; background:#eb4d4d; transition-delay: 0.4s;}
    .circle03 { transform: rotate(100deg)  translateY(-140px)!important; background:#e65135; transition-delay: 0.5s;}
    .circle04 { transform: rotate(140deg) translateY(-140px)!important; background:#e63535; transition-delay: 0.6s;}
    .circle05 { transform: rotate(180deg) translateY(-140px)!important; background:#d83232; transition-delay: 0.7s;}
    .circle06 { transform: rotate(220deg) translateY(-140px)!important; background:#c82e2e; transition-delay: 0.8s;}
    .circle07 { transform: rotate(260deg) translateY(-140px)!important; background:#b82343; transition-delay: 0.9s;}
    .circle08 { transform: rotate(300deg) translateY(-140px)!important; background:#e63559; transition-delay: 1.0s;}
    .circle09 { transform: rotate(340deg) translateY(-140px)!important; background:#d63650; transition-delay: 1.1s;}

    #container .viscosity_content .conditions_sec2{padding:40px 0;}
    #container .viscosity_content .conditions_sec2 table{margin-top:10px;}
    #container .viscosity_content .conditions_sec2 table th{font-size:13px;}
    #container .viscosity_content .conditions_sec2 table td{font-size:13px;}
    #container .viscosity_content .conditions_sec2 table td{padding:13px;}

    #container .viscosity_content .conditions_sec1 .sec3_con{ flex-direction: column; align-items: flex-start; gap:15px; padding:20px 0;}
    #container .viscosity_content .conditions_sec1 .sec3_con img{width:100%; border-radius:5px;}
    #container .viscosity_content .conditions_sec1 .sec3_con h1{font-size:20px;}
    #container .viscosity_content .conditions_sec1 .sec3_con p{font-size:13px; margin-top:5px; margin-bottom:10px;}
    #container .viscosity_content .conditions_sec1 .sec3_con ul{font-size:12px; line-height:150%; padding-left:15px;}
    #container .viscosity_content .conditions_sec1 .sec3_con_r {flex-direction: column-reverse;}

    .more_btn{width: 170px; height: 40px; border-radius:5px;}
    .more_btn a{font-size:13px; }
}