@charset "UTF-8";

body {
    font-family: 'Nunito Sans', 'Notokr', sans-serif;
    font-size: 18px;
    line-height:1.7em;
    color:#000;
    letter-spacing: -0.02em;
}
body.h_hidden {
    overflow: hidden;
}
/***** header *****/
header {
    padding:0 4.5%;
	position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
    transition: background-color 0.5s;
	border-bottom:1px solid rgba(255,255,255,0.05);
    width:100%;
    min-height:100px;
}
header.change {
    transition: background-color 0.5s;
	background-color:rgba(255,255,255,0.96);
	border-bottom:1px solid rgba(0,0,0,0.1);
	border-bottom:1px solid #f5f5f5;
}   
header .head_logo {
    width:277px;
    height:36px;
    background: url('../images/cosmax_logo_white.png') no-repeat 50% 50%;
    background-size: 100%;
}
body.dark_body header .head_logo {
    background-image: url('../images/cosmax_logo_white.png');
    margin-top: -11px;
}
body.dark_body header.change .head_logo {
    background-image: url('../images/cosmax_logo_black.png');
    margin-top: -11px;
}
header .menu_wrap {
    display: flex;
    align-items: center;    
}
header .menu_wrap > div {
    margin-left:15px;
    font-size:16px;
    letter-spacing: 0.06em;
}
body.dark_body header .menu_wrap > div {
    color:#fff;
}
body.dark_body header .menu_wrap > div.sns_face {
    display: none;
}
body.dark_body header.change .menu_wrap > div {
    color:#000;
}
header .menu_wrap > div.lang {
    margin-left:12px;
    padding-left:12px;
    border-left:1px solid rgba(0,0,0,0.5);
    height:12px;
    line-height: 12px;
}
body.dark_body header .menu_wrap > div.lang {
    border-left:1px solid rgba(255,255,255,0.5);
}
body.dark_body header.change .menu_wrap > div.lang {
    border-left:1px solid rgba(0,0,0,0.5);
}

body.dark_body header .menu_wrap > div.lang.kr,
header .menu_wrap > div.lang.kr,
header .menu_wrap > div.head_cosmax, 
header .menu_wrap > div.menu_open {
    margin-left:30px;
    padding-left:0;
    border-left:0;
}
header .sns_insta {
    width:16px;
    height:16px;
    background: url('../images/sns_insta_dark.svg') no-repeat 50% 50%;
    background-size: 100%;
}
body.dark_body header .sns_insta {
    background-image: url('../images/sns_insta_light.svg');
}
body.dark_body header.change .sns_insta {
    background-image: url('../images/sns_insta_dark.svg');
}

header .sns_face {
    width:9px;
    height:18px;
    background: url('../images/sns_face_dark.svg') no-repeat 50% 50%;
    background-size: 100%;
}
body.dark_body header .sns_face {
    background-image: url('../images/sns_face_light.svg');
}
body.dark_body header.change .sns_face {
    background-image: url('../images/sns_face_dark.svg');
}
header .sns_you {
    width:20px;
    height:14px;
    background: url('../images/sns_you_dark.svg') no-repeat 50% 50%;
    background-size: 100%;
}
body.dark_body header .sns_you {
    background-image: url('../images/sns_you_light.svg');
}
body.dark_body header.change .sns_you {
    background-image: url('../images/sns_you_dark.svg');
}
header .head_cosmax {
    width:102px;
    height:24px;
    background: url('../images/head_cosmax_dark.png') no-repeat 50% 50%;
    background-size: 100%;
    margin-left: 30px;
}
body.dark_body header .head_cosmax {
    background-image: url('../images/head_cosmax_light.png');
}
body.dark_body header.change .head_cosmax {
    background-image: url('../images/head_cosmax_dark.png');
}
/***** header *****/

#container {
    height: 100%;
    position: relative;
}

section.index_vod,
section.height100vh {
	height: 100vh;
    position: relative;
}
section.sub_top {
	height: 700px;
    position: relative;
}
section.second_menu {
    width:100%;
    height:62px;
    background-color: #e9e9e9;
    border-top:1px solid #ccc;
}
.first_menu {
    display: flex;
    align-items: center;
}

.btn_biz {
    position: fixed;
    bottom:34px;
    right:4.5%;
    z-index:9;
    right: 86px;
}
.btn_biz .biz {
    width:120px;
    height:120px;
    border-radius:70px;
    color:#fff;
    background-color: #e5001d;
    display: block;
    text-align: center;
    position: relative;
    margin-bottom: 10px;
}
.btn_biz .biz:last-child {
    margin-bottom: 0;
}
.btn_biz .biz.bro {
    background-color: #ff7b7b;
}
.btn_biz .biz .biz_txt {
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    font-size:16px;
    width:100%;
    text-transform:uppercase;
    font-weight:700;
    line-height: 1.2em;
}
.btn_biz .biz .biz_txt .en {
    font-size:11px;
    letter-spacing: 0.04em;
    font-weight: 600;
}

.index_a_top {
    position: fixed;
    top:0;
    left:0;
    z-index:9;
    transition: background-color 0.8s;
}
.index_a_top.change {
    background-color: #fff;
    transition: background-color 0.8s;
}
.hero_animation {
    position: absolute;
    top:50%;
    left:50%;
    margin-top: -160px;
    margin-left: -65px;
}

.main_copy_arrow {
    width:35px;
    height:7px;
    display:inline-block; 
    vertical-align:middle;
    margin-left: 6px;
}

/* 슬로건사이즈 A*/
#slide_inquiry {    
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;    
    width: 100%;
    height:220px;
    /* margin-left: -448px;
    height: 225px;    
    margin-top:-112px; */
    -webkit-transform: translate(-50%, -50%); 
    transform: translate(-50%, -50%);
}
#slide_inquiry > div {
    position: absolute;
    top:0px;
    left:0px;
    width: 100%;
    height: auto;
}
#slide_inquiry .slide_inquiry_wrap {
    color:#fff;
    text-transform:uppercase;
    text-align: center;
    font-size:43px;
    line-height: 1.12em;
    font-weight:700;
    letter-spacing: 0.04em;
}
#slide_inquiry .slide_inquiry_wrap .line {
    display: block;
    width:60px;
    height:1px;
    background-color: rgba(255,255,255,0.5);
    margin: 24px auto;
}
#slide_inquiry .slide_inquiry_wrap .txt {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.02em;
    line-height: 1.6em;
    display: block;
}
#slide_inquiry .slide_inquiry_wrap img {
    width: 100%;
    height: auto;
}

/* 슬로건사이즈 B*/
#slide_inquiry02 {    
    position: relative;
    height:124px;
    /* width:600px; */
    width:51.1691%;
}
#slide_inquiry02 > div {
    position: absolute;
    top:0px;
    left:0px;
    width: 100%;
    height: auto;
}
#slide_inquiry02 .slide_inquiry_wrap02 img {
    width: 100%;
    height: auto;
}
.slide_inquiry_wrap02 {
    font-size:64px;
    line-height:70px;
    font-family: 'Notokr', sans-serif;
    letter-spacing: -0.04em;
    font-weight:900;
}
section.index_slogan {
    position: relative;
    padding:180px 18% 220px;   
    display: flex;
    align-items: flex-end; 
    line-height: 1.5em;
}
body.index_body section.index_slogan {
    padding:180px 18% 220px; 
}
.main_copy {
    padding-bottom: 0;
    color:#555;
    margin-bottom:-13px;
    font-size: 18px;
    line-height: 1.6em;
    letter-spacing:-0.02em;
}
.btn_down {
    position: absolute;
    bottom: 15px;
    left:50%;
    z-index: 9;
    font-size: 12px;
    letter-spacing: 0.1em;
    color: #fff;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);    
    font-weight:300;
}
.down_arrow_light {
    display: block;
    width:24px;
    height:52px;
    background: url('../images/down_arrow_light.svg') no-repeat 50% 50%;
    background-size: 100%; 
    margin: 0 auto;
    animation-duration: 1.2s;
    animation-name: fadein;
    animation-direction:alternate-reverse;
    animation-iteration-count: infinite;
}
video#index_video {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    left: 50%;
    top: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    object-fit: cover;
}
video::-webkit-media-controls-panel {
    display: none !important;
    opacity: 1 !important;
}

/****/
.contents {
    padding:0 18%
}
body.index_body .contents {
    padding:0 18%
}
.contents_wrap {
    padding:80px 18%
}
.contents_sub {
    padding:120px 18% 0
}
.contents_sub.list_style {
    padding-top:80px;
}
.contents_last {
    padding-bottom:0
}
.wrap1024 {
    max-width:1024px;
    margin: 0 auto;
}
.contents.index_fir {
    padding-bottom:10.5%;
}
body.index_body .contents.index_fir {
    padding-bottom:10.5%;
}
.contents.index_last {
    padding-top:10%;
}
body.index_body .contents.index_last {
    padding-top:10%;
}
.col2 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.col2 > div {
    width:50%;
}
.col2 > div:first-child {
    padding-right: 17px;
}
.col2 > div:last-child {
    padding-left: 17px;
}
.con_box .img {
    margin-bottom:20px;
}
.con_box .img.press {
    height:0;
    padding-bottom:75%;
    background-position:50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url('../images/empty_photo.jpg');    
}
.con_box .ti {
    font-size:26px;
    font-weight:700;
    letter-spacing: 0.02em;
    margin-bottom:20px;    
    text-transform:uppercase;
}
.col_press.happy .con_box p {
    font-size: 16px;
    line-height: 1.55em;
    color:#666;
}
.col_press.happy .con_box .ti {
    font-size: 19px;
    font-weight: 600;
    line-height: 1.45em;
    margin-bottom: 5px;
    color:#000;
    letter-spacing: -0.02em;
}
.con_box.press .author {
    margin-bottom: 2px; 
    font-size: 16px;
}
.con_box.press .ti {
    font-size: 20px;
    font-weight:700;
    line-height: 1.4em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; 
    -webkit-box-orient: vertical;    
    text-transform:none;
    margin-bottom: 0;
}
.con_box.press .ti a {
    word-break: normal;
}
.contents_sub.esg .con_box.press .ti {
    font-weight: 600;
}
.con_box.press.detail {
    text-align: center;
    width: 66.66%;
    margin: 0 auto;
}
.con_box.press.detail .ti {
    font-size: 28px;
    line-height: 1.35em;
    -webkit-line-clamp: unset;
    margin: 10px 0 10px;
    letter-spacing: -0.02em;
}
.con_box.press .copy {
    font-size: 17px;
    line-height: 1.6em;
    margin-top: 10px;
}
.fomul .con_box.press .copy {
    text-indent: -8px;
    margin-left: 8px;
}
.con_box.press .date {
    letter-spacing: 0.05em;
    font-size: 15px;
    color:#666
}
section.news_list > div:first-child .notice_grid .con_box.press.notice {
    padding-top:0;  
}
section.news_list > div:last-child .notice_grid .con_box.press.notice {
    border-bottom: 0 
}
.con_box.press.notice {
    padding-top:25px;    
    padding-bottom:17px;
    border-bottom:1px solid #eee;
    width:100%;
}
/* .notice_grid:last-child .con_box.press.notice {
    border-bottom: 0;
} */
.con_box.press.notice .ti {
    margin-bottom: 0px
}
.matech .con_box .ti {
    text-transform:none;
}
.con_box .txt {
    margin-bottom:15px;    
}
.btn_more {
    width:110px;
    height:30px;
    border-radius: 20px;
    border:1px solid #cccccc;
    display: inline-block;
    font-size: 13px;
    color:#888;
    padding-left: 13px;
    letter-spacing: 0.06em;
    position: relative;
}
.btn_more::after {
    content:" ";
    position: absolute;
    width:6px;
    height:10px;
    background: url('../images/btn_arrow_dark.svg') no-repeat 50% 50%;
    background-size: 100%;
    right:12px;
    top:9px;
}
.section_gray {
    background-color: #f4f4f4;
    padding: 140px 18%;
}
body.index_body .section_gray {
    padding: 140px 18%;
}
.col3.matech {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 44px;
    row-gap: 80px;
}
.col_press {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: 44px;
    row-gap: 80px;
}
.col_press.happy {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    text-align: center;
    row-gap: 80px;    
}
.col_press.fomul {
    row-gap: 50px;
}
.col_press.pack .img {
    border:1px solid #d5d5d5;
}
.index_col3.col3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 34px;
}
.index_col3.col3 > div {
    background-color: #fff;
}
.index_col3 > div > ul {
    background-color: #fff;
    box-shadow: 0px 0px 8px 0px rgb(0 0 0 / 3%);
    min-height: 710px;
}
.index_col3.matech > div > ul {
    box-shadow: none;
    min-height: auto;
}
.index_col3 > div > ul li.ti, 
.index_col3 > div > ul li.txt,
.index_col3 > div > ul li.btn {
    padding-left:30px;
    padding-right:30px;
}

.index_col3.matech > div > ul li.ti, 
.index_col3.matech > div > ul li.txt,
.index_col3.matech > div > ul li.btn {
    padding-left:0px;
    padding-right:0px;
}
/** 서브탑 **/
section.sub_top.material_tech {
    background: url('../images/subtop_material_tech.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.cs_question {
    background: url('../images/subtop_cs_question.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.press {
    background: url('../images/subtop_press.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.notice {
    background: url('../images/subtop_notice.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.recruit {
    background: url('../images/subtop_recruit.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.ir {
    background: url('../images/subtop_ir.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.stockholders {
    background: url('../images/subtop_stockholders.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.overview {
    background: url('../images/subtop_overview.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.greetings {
    background: url('../images/subtop_greetings.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.history {
    background: url('../images/subtop_history.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.vision {
    background: url('../images/subtop_vision.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.esg_overview {
    background: url('../images/subtop_esg_overview.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.esg_policy {
    background: url('../images/subtop_esg_policy.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.biz {
    background: url('../images/subtop_biz.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.ethical {
    background: url('../images/subtop_ethical.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.governance {
    background: url('../images/subtop_governance.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.quality {
    background: url('../images/subtop_quality.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.research {
    background: url('../images/subtop_research.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.partners {
    background: url('../images/subtop_partners.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.formulation {
    background: url('../images/subtop_formulation.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.manufacturing {
    background: url('../images/subtop_manufacturing.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.supply {
    background: url('../images/subtop_supply.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.happy {
    background: url('../images/subtop_happy.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.contact {
    background: url('../images/subtop_contact.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.privacy {
    background: url('../images/subtop_privacy.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.development {
    background: url('../images/subtop_development.jpg') no-repeat 50% 50%;
    background-size: cover; 
}
section.sub_top.bizinfo {
    background: url('../images/subtop_bizinfo.jpg') no-repeat 50% 50%;
    background-size: cover; 
}


.index_col3 > div > ul li:last-child {
    padding-bottom: 70px;
}
.index_col3.matech > div > ul li:last-child {
    padding-bottom: 0px;
}
.contents.index_last {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.contents.index_last > div:first-child {
    width: 60%;
    padding-right: 50px;
    border-right: 1px solid #dcdcdc;
}
.contents.index_last > div:last-child {
    width: 40%;
    padding-left: 50px;
}
.index_news_list {
    margin-bottom: 30px;
}
.index_news_list:last-child {
    margin-bottom: 40px;
}
.index_news_list .ti {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 5px;
}
.index_news_list .date {
    font-size: 16px;
    color:#666;
}
.news_wrap {
    border-bottom: 1px solid #dcdcdc;
}
.re_wrap {
    padding-top: 40px;
}

.subtop_center {
    position: absolute;   
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    color: #fff;
    margin-top: 15px;
}
.subtop_center .cate_ti {
    font-size:18px;
    font-weight:700;
    letter-spacing: 0.06em;
    padding:8px 20px 4px 20px;
    border:3px solid rgba(255,255,255,0.8);
    display: inline-block;
    text-transform:uppercase;
    border-radius: 30px;
    margin-bottom: 40px;
}
.subtop_center .subtop_slogan {
    font-size:40px;
    font-weight:700;
    line-height: 1.3em;
    letter-spacing: -0.02em;
    margin-bottom: 10px;
}
.subtop_center .subtop_slogan,
.subtop_center ul li.cate_small  {
    /* animation: blur 2.0s ease 0s;
    -webkit-animation: blur 2.0s ease 0s;
    -moz-animation: blur 2.0s ease 0s;
    animation-direction: alternate;
    animation-iteration-count: 1;
    animation-fill-mode: forwards; */
}
.subtop_center ul li:first-child {
    /* animation: fadeInUp 1.0s ease 0.0s forwards; */
}
.subtop_center ul li {
    text-align: center;
}
.subtop_center ul li.cate_small {
    display: none;
}
.subtop_center ul li.cate_small.block {
    display: block;
    padding-top:10px;
}
.cate_small_line {
    display: inline-block;
    width:50px;
    height:1px;
    background-color: rgba(255,255,255,0.7);
    vertical-align: middle;
    margin:-3px 10px 0;
}
.page_menu {
    padding:0 18%;
    background-color: #e9e9e9;
    min-height: 62px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: 1em;
}
.page_menu > div:nth-child(2) {
    text-transform:uppercase;
}
a.active {
    font-weight:700
}
section.page_menu a.active {
    font-weight:700;
    color:#e5001d;
}
.ma_tab {
    text-align:center;
    padding-top:70px;
    padding-bottom:70px;
    font-size:20px;
}
.contents.half {
    padding-top:5%;
}
.half {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}
.half > div {
    width:50%;
    /* background-color: #f4f4f4; */
}
.half > div:last-child {
    padding: 0 0 0 40px;
}
#modalpop_wrap .half > div:last-child {
    /* padding: 30px 30px 30px 40px; */
}

/*****/
footer {
}
footer .foot_slogan {
    text-align: center;
    font-size:20px;
    letter-spacing: 0.08em;
    padding: 200px 0 60px;
    font-weight: 300;
    text-transform: uppercase;
    color:#333;
    border-bottom: 1px solid #dcdcdc;
}
footer .foot {
    padding:50px 18% 60px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;    
    font-size:16px;
    line-height: 1.6em;
    position: relative;
}
footer .foot > div {
    width:50%;
}
footer .foot .ti {
    letter-spacing: 0.04em;
    font-weight:700;
    margin-bottom: 15px;
}
.foot_logo {
    position:absolute;
    top:50px;
    left:4.5%;
    width:24px;
    height:40px;
    background: url('../images/foot_logo.svg') no-repeat 50% 50%;
    background-size: 100%;
}
.foot_right {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;    
}
.foot_right > div {
    width:33.3%;
}
.foot_right > div:nth-child(2) {
    margin-left: -40px;
}
.foot_right > div a {
    display: block;
}
.foot_right > div:first-child a {
    letter-spacing: 0.08em !important;
}
.foot_right > div:first-child a:nth-child(2) {
    display: none;
}

.wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;   
    padding-top: 80px;
    padding-bottom: 80px;
}
.wrap > div:first-child {
    width:33.33%;
    padding-right: 30px;
}
.wrap.manufacturing > div:first-child {
    padding-right: 50px;
}
.wrap > div:last-child {
    width:66.66%;
    line-height: 1.8em;
}
.wrap > div:last-child p,
.wrap_inner > div:last-child p {
    margin-bottom:30px;
}
/* 연혁 */
.wrap_inner.history {
    margin-bottom: 60px;
}
.wrap_inner.history:last-child {
    margin-bottom: 0;
}
/*.wrap_inner.history .left_en {
    padding-top:13px;    
    border-top:1px solid #e5001d;
    border-top:2px solid #000;
    font-weight: 300;
    font-size: 44px;
    letter-spacing: -0.01em;
}*/
.wrap_inner.history .year {
    width:85%;
    padding-top:24px;    
    border-top:1px solid #e5001d;
    border-top:1px solid #000;
    font-weight: 300;
    font-size: 38px;
    letter-spacing: -0.01em;
}
.wrap_inner.history > div:last-child p {
    margin-bottom:0;
    padding-top:10px; 
    padding-bottom:3px; 
    border-top:1px solid #eee;
}
.wrap_inner.history > div:last-child p:empty {
    display: none;
}
/*.wrap_inner.history > div:last-child p:first-child {
    border-color: #ccc;
}*/
.wrap_inner.history > div:last-child p:last-child {
    border-top:0;
    padding-top:15px;
}
/*.wrap_inner.history > div:last-child p:first-child {
    padding-top:13px;    
}*/
.wrap_inner.history .month {
    display: inline-block;
    padding-right:10px;
}

.wrap > div:last-child p.sti,
.wrap_inner > div:last-child p.sti {
    margin-bottom:15px;
}
.wrap.vision > div:last-child p.sti {
    margin-bottom:7px;
}
.wrap > div:last-child p:last-child,
.wrap_inner > div:last-child p:last-child {
    margin-bottom:0;
}
.sti.line {
    border-bottom: 1px solid #ccc;
    padding-bottom: 2px;
    margin-bottom: 6px !important;
    display: inline-block;
}
.wrap_inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;   
}
.wrap_inner > div:first-child {
    width:33.33%;
    padding-right: 30px;
}
.wrap_inner > div:last-child {
    width:66.66%;
    line-height: 1.8em;
}
.h_img {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;    
}
/** Tabs **/
ul.tabs-nav {
    text-align: center;
    width: 100%;
    display: inline-block;
    padding: 80px 0 90px;
}
ul.tabs-nav.rule {
    padding-bottom: 60px;
}
.tabs-nav li {
    text-align: center;
    padding-bottom: 70px;
    padding: 0 15px;
    display: inline-block;
}
.tabs-nav li:first-child a {
border-right: 0;
border-top-left-radius: 6px;
font-size: 20px;
}
.tabs-nav li a {
    font-size: 20px;
}
.tabs-nav li.tab-active a {
    font-size: 22px;
}
.tabs-nav li:last-child a {
border-top-right-radius: 6px;
font-size: 20px;
}
.tab-active a {
background: #fff;
border-bottom-color: transparent;
border-bottom: 1px solid #ea0029;
padding-bottom: 4px;
font-weight:700;
font-size: 20px;
cursor: default;
}
.tabs-stage {
border-top: 0;
clear: both;
position: relative;
}
.news_navigator {
    margin-top:65px;
    text-align: center;
}
.news_navigator a.active {
    color: #e5001d;
}
.news_navigator a {
    font-size: 18px;
    margin: 0 10px;
    font-weight: 300;
    display: inline-block;
}
.news_navigator img {
    vertical-align: middle;
    margin-top: -2px;
    width:12px;
    height:12px;
}
/** 기사성 페이지 **/
#article {
    margin: 80px auto 0;
    /* width:66.66%; */
}
#article p {
    margin-bottom: 40px;
    line-height: 1.8em;
}
#article p:last-child {
    margin-bottom: 0px;
}
#article p img {
    width: auto;
    max-width:100%;
    margin: 60px auto;
}
.list_navigator {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top:80px;
}
.notice_grid {
    display: flex;
    align-items: center;    
}
.notice_grid .num {
    font-size:40px;
    padding-right: 50px;
    padding-left: 0;
    width: 160px;
    letter-spacing: 0.05em;
    font-weight: 100;
}
.iframe_wrap {
    text-align: center;
    /* height:900px;
    overflow: auto;     */
}
iframe.ir_iframe {
    border:0;
    width: 734px;
    height:900px;
}
.area_button {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.area_button li {
    padding-left: 30px;
    font-size: 17px;
    font-weight:700;
    letter-spacing: 0.03em;
}
.area_a {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 10px;
    background-color: #ea0029;
    margin-right: 7px;
    vertical-align: text-top;
    margin-top: 2px;
}
.area_a.area_b {
    border:3px solid #ff595a;
    background-color: #fff;
}
.area_a.area_c {
    border:4px solid #ff595a;
    background-color: #ea0029;
}
.business_area_a {
    width: 100%;
    height: 0;
    padding-bottom: 47.03%;
    background: url('../images/business_area_a.svg') no-repeat 50% 50%;
    background-size: 100%;
    display: block;
    margin: 0 auto;
    transition: background 0.2s;    
}
.business_area_a.area_b {
    background: url('../images/business_area_b.svg') no-repeat 50% 50%;
    background-size: 100%;
    transition: background 0.2s;
}
.business_area_a.area_c {
    background: url('../images/business_area_c.svg') no-repeat 50% 50%;
    background-size: 100%;
    transition: background 0.2s;
}
.business_area_a.global {
    background: url('../images/business_area_global.svg') no-repeat 50% 50%;
    background-size: 100%;
    transition: background 0.4s;
    position: relative;
}
.gloabal_point_kr {
    position: absolute;
    width:24px;
    height:24px;
    left:37.83%;
    top:40.51%;
}
.gloabal_point_kr02 {
    position: absolute;
    width:17.25%;
    height:11.75%;
    left:36.83%;
    top:25.86%;
}
.gloabal_point_cn {
    position: absolute;
    width:24px;
    height:24px;
    left:30.92%;
    top:43.76%;
}
.gloabal_point_cn02 {
    position: absolute;
    width:17.25%;
    height:11.75%;
    left:16.85%;
    top:29.11%;
}
.gloabal_point_au {
    position: absolute;
    width:24px;
    height:24px;
    left:41.50%;
    top:78.12%;
}
.gloabal_point_au02 {
    position: absolute;
    width:17.25%;
    height:11.75%;
    left:40.50%;
    top:63.47%;
}
.gloabal_point_usa {
    position: absolute;
    width:24px;
    height:24px;
    left:76.17%;
    top:35.26%;
}
.gloabal_point_usa02 {
    position: absolute;
    width:17.25%;
    height:11.75%;
    left:75.08%;
    top:20.61%;
}

/** 이미지정의 **/
img.overview {
    width:880px;
    margin: 0 auto;
}
img.organization {
    width:90%   ;
    margin: 0 auto;
}
img.ceo_sign {
    width:120px;
}
.img_vision_wrap {
    border:0px solid #ccc;
    padding:60px 0 0px; 
    position: relative;
}
.img_vision_wrap.last {
    padding-bottom:0; 
}
img.vision {
    width: 100%;
    height: auto;   
    margin:0 auto;
}
img.research_graphic {
    width:960px;
    height:auto;
    margin: 0 auto;
}
img.logo_cosmaxns {
    width:210px;
    height:auto;
}
img.odm_plus {
    display: block;
    width:20px;
    height:auto;
    margin: 10px auto;
}
img.epp {
    width:38%;
    height:auto;
}
img.micro {
    width:79%;
    height:auto;
}

.ti_phil {
    position: absolute;
    top:0;
    left:0;
    letter-spacing: 0.02em;
    font-weight:700;
    font-size: 20px;
}
.values_center {
    position: absolute;
    top:50%;
    left:50%;
    letter-spacing: 0.03em;
    font-weight: 800;
    font-size: 35px;
    color:rgba(255,255,255,0.8);
    -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
    text-align:center;
    line-height: 1em;
}
.values_center p {
    margin-top: 10px;
    letter-spacing: -0.01em;
    font-size: 30px;
}
.vision_photo {
    display: flex;
    align-items: center;   
}
.vision_photo > div {
    width:50%;
    position: relative;
    border: 1px solid #ccc;
    border: top 0;
}
.vision_photo > div:first-child {
    border-right: 0;
    width:calc(50% - 1px);
}
.vision_photo > div img {
    width:100%;
    height:auto;
}
#menunavi {
    margin: 0;
    padding: 0;
    position: relative;
 }
 #menunavi li {
    margin: 0;
    display: inline-block;
    width: auto;
    height:62px;
    line-height:62px;
    position: relative;
 }
 #menunavi li.globalNav.active {
     font-weight:700;
 }
 .localNav li {
    display: inline;
    width:50px;
 }
 /* .localNav {
     display: none;   
     position: absolute;
     left: 0px;
     top: 62px;
     z-index: 9;
     width: 100%;
     white-space: nowrap;
     height:62px;
     line-height:62px;
     background-color: #e9e9e9;
     border-top: 1px solid #ccc;
 } */
 .localNav {
    display: none;   
    position: absolute;
    left: 50%;
    top: 62px;
    transform: translateX(-50%);
    z-index: 9;
    white-space: nowrap;
    height:62px;
    line-height:62px;
    border-top: 1px solid #ccc;
}
 .localNav.active {
     display:block;
     z-index: 1;
 }
 .localNav.active.no {
    display:none;
}
.policy_img_wrap,
.policy_img_wrap img {
    width:200px;
    height:200px;
    border-radius: 100px;
    display: block;
    margin-left: auto;
    margin-right: 40px;
}
.policy_img_wrap img {
    width:100%;
    height:auto;
}

.step_ti {
    font-size: 38px;
    text-transform:uppercase;
    font-weight:700;
    margin-bottom: 60px;
    letter-spacing: 0.02em;
    color:#e5001d;
}
.forehead_txt {
    font-size: 17px;
    line-height: 1.65em;
    margin-bottom: 80px;
    /* color:#666; */
}
.biz_select input[type=checkbox]+label,
.biz_select input[type=radio]+label {
  width: auto;
  padding: 0 0 0 26px;
  margin-top: 0;
  margin-bottom: 22px;
  /* margin-right: 40px; */
}
.biz_select input[type=text] {
    height:54px;
    line-height: 54px;
    border:1px solid #666;
    display: block;
    padding:0 16px;
    width: 100%;
    font-family: 'Nunito Sans', 'Notokr', sans-serif !important;
}
.biz_select input[type=text]#biz_other_nation {
    width:25%;
    display: inline-block;
    vertical-align: middle;
    margin-top: -16px;
    margin-left: 10px;
}
.biz_select input[type=text]::placeholder {
    font-size: 15px;
    color:#bbb;
    font-family: 'Nunito Sans', 'Notokr', sans-serif;
}
.biz_line {
    padding-bottom:30px;
    border-bottom: 1px solid #ccc;
    margin-bottom:50px;
}
section.biz_section {
    
}
.biz_bottom_navi {
    margin-top: 80px;
}
.biz_info .biz_select {
    margin-bottom: 20px;
}
.ag_info {
    border: 1px solid #dbdbdb;
    font-size: 14px;
    padding: 15px;
    margin-bottom: 10px;
    width: 100%;
    height: 200px;
    overflow-x: hidden;
    overflow-y: auto;
    line-height: 1.5em;
}
.txt_wrap {
    margin-bottom: 80px;
}
.txt_wrap:last-child {
    margin-bottom: 0;
}
.txt_wrap p {
    margin-bottom: 30px;
}
.txt_wrap p:last-child {
    margin-bottom: 0;
}

/** faq **/
#faq_section {position:relative; bottom:0; width:100%;}
#faq_section:last-child .cd-faq-group  li:last-child {border-bottom:1px dashed #d37096}
.cd-faq-trigger {position: relative; display: block; margin: 1.6em 0 .4em; margin: 0; padding: 20px 0; font-weight:700; font-size:21px; line-height: 1em;}
.cd-faq-trigger::after {position: absolute; right: 10px; top: 40%;}
.cd-faq-content {display: none; padding: 0px 0 40px; line-height:1.8em;}
.cd-faq-content.article {margin-top: 20px;}
.cd-faq-group li.content-visible .cd-faq-content {display: block;}
.cd-faq-group  li {border-bottom:1px solid #999; padding: 6px 0;}
.cd-faq-group  li:last-child {border-bottom:0;}
/* .cd-faq-group  li.content-visible {border-bottom:1px dashed #d37096} */
.cd-faq-group  li.content-visible:last-child {border-bottom:0;}
.cd-faq-trigger::after {
    content: '';
    width: 22px;
    height:12px;
    background: url('../images/down_arrow.png') no-repeat 50% 50%;
    background-size: 100%;
}
.content-visible .cd-faq-trigger::after {-webkit-transform: rotate(180deg); transform: rotate(180deg); }
/** faq **/
.cd-faq-content.article strong {
    font-weight:700 !important;
}

table.partners_table {
    border-top: 0;
    border-bottom: 0;
}
table.partners_table td {
    width:20%;
    border-right:1px solid #ccc;
    text-align:center;
    padding:5px;
}
table.partners_table td img {
    width:100%;
    height:auto;
    margin:0 auto;
    image-rendering: -moz-crisp-edges;
    image-rendering:   -o-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;
}
table.partners_table tr td:last-child {
    border-right:0;
}
table.partners_table tr td {
    border-bottom:1px solid #ccc;
}
table.partners_table tr:last-child td {
    border-bottom:0;
}
table.center tr td {
    text-align:center
}
.happy_circle {
    background-color: #fff;
    width:100%;
    height:0;
    padding-bottom: 100%;
    border-radius: 100px;
    box-shadow: 0px 0px 8px 0px rgb(0 0 0 / 3%);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    margin: 0 auto;
    text-align: center;
}
.happy_circle img {
    max-width: 90%;
    margin-top: 5%;
}
.contents_sub.happy ul.con_box li {
    text-align:center;
}
.odm_txt {
    display: flex;
    align-items: center;
}
.odm_txt > div {
    width: 33.33%;
    text-align: center;
    letter-spacing: 0.04em;
    font-weight: 600;    
}
.odm_color_wrap {
    display: flex;
    align-items: center;
    padding-bottom: 20px;
    justify-content: space-between;
}
.odm_color_wrap > div{
    width: 33.33%;
    text-align: center;
    color: #fff;
    letter-spacing: 0.06em;
    font-weight:700;
    font-size:25px;
    height:340px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding:0 17px;
    margin:0 15px;
    border-radius: 50%;
    width:330px;
    height:330px;
}
.odm_color_wrap > div:nth-child(1) {
    background-color: rgba(234,0,41,1.0);
    border-radius: 50%;
}
.odm_color_wrap > div:nth-child(2) {
    background: linear-gradient(to bottom right, rgba(234,0,41,1.0), rgba(255,180,171,1.0));
}
.odm_color_wrap > div:nth-child(3) {
    background: linear-gradient(to bottom right, rgba(234,0,41,1.0), rgba(255,180,171,1.0), rgba(0,0,0,1.0));
}

table.patent td {
    font-size:17px;
    line-height: 1.55em;
}

.manage_chapter {
    margin-bottom: 150px;
}
.manage_chapter:last-child {
    margin-bottom: 0;
}
.manage_chapter > div {
    margin-bottom: 50px !important;
}
.manage_chapter:last-child > div:last-child {
	margin-bottom: 0px !important;
}
.manage_chapter .sti {
    font-size: 26px;
}
.manage_chapter .sti.table {
    font-size: 22px;
}
.epp_img {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    column-gap: 40px;
}
.epp_img > div:last-child p span {
    display: block;
    text-indent: -8px;
    margin-left: 8px;
}
.epp_img.micro {
    grid-template-columns: 1fr 1fr;
}
.micro_tech {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    column-gap: 10px;
}
.micro_tech > div {
    text-align:center;
}
.micro_tech > div p {
    font-size:14px;
    line-height: 1.65em;
    word-break: keep-all;
}
.micro_tech > div strong {
    display: block;
    font-size:18px;
    margin-bottom: 5px;
}
.micro_img {
    width:90%;
    height:auto;
    background-color: #f4f4f4;
    border-radius: 50%;
    border:0px solid #d5d5d5;
    margin:0 auto 15px;
}
.global_wrap {
    padding:50px
}
.global_con {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
}
.df_con {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    column-gap: 30px;
}
.df_con div span,
.df_con p span {
    display: block;
    text-indent: -8px;
    margin-left: 8px;
}
.small_bottle_img {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 0px;
    row-gap: 0px;
}
.global_detail {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    column-gap: 30px;
    row-gap: 0px;
}
.global_detail .sti.textright {
    text-transform: uppercase;
    padding-top: 2px;
}
.in_wrap {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 20px;
}
.in_wrap > div {
    border: 1px solid #dcdcdc;
}
.step3 {
    display: flex;
    align-items: center;
    justify-content: space-between
}
.step3 > div {
    text-align: center;
    align-items: center;
}
.step3 > div {
    font-size: 25px;
    font-weight:700;
    margin-bottom: 20px;
}
.step3_won {
    width:240px;
    height:240px;
    border-radius: 120px;
    border:1px solid #ea0029;
}
#modalpop_in01 section > div:first-child {
    background: url('../images/back_mar_01.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}
#modalpop_in02 section > div:first-child {
    background: url('../images/back_mar_02.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}
#modalpop_in03 section > div:first-child {
    background: url('../images/back_mar_03.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}
#modalpop_in04 section > div:first-child {
    background: url('../images/back_mar_04.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}
#modalpop_in05 section > div:first-child {
    background: url('../images/back_mar_05.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}
#modalpop_in06 section > div:first-child {
    background: url('../images/back_mar_06.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}
#modalpop_in07 section > div:first-child {
    background: url('../images/back_mar_07.png') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}
#modalpop_in08 section > div:first-child {
    background: url('../images/back_mar_08.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}

#modalpop_in08 section > div:first-child {
    background: url('../images/back_mar_09.jpg') no-repeat 50% 50%;
    background-size: cover;
    position: relative;
}


#modalpop_in01 .ma_logo {
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:400px;
    height:167px;
    background: url('../images/ma01_logo_light.svg') no-repeat 50% 50%;
    background-size: 100%;
}
#modalpop_in02 .ma_logo {
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:400px;
    height:167px;
    background: url('../images/ma02_logo_light.svg') no-repeat 50% 50%;
    background-size: 100%;
}
#modalpop_in03 .ma_logo {
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:400px;
    height:167px;
    background: url('../images/ma03_logo_dark.svg') no-repeat 50% 50%;
    background-size: 100%;
}
.root_daum_roughmap,
.contents.map iframe {
    width:100% !important;
    height:70vh;
}
.root_daum_roughmap .wrap_map {
    height: 100% !important;
}
.contents.map .tabs-stage {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
img.patent {
    width:30px;
    height:auto;
    display: block;
    margin: 0 auto;
    border: 1px solid #ccc;
}
.in_img {
    margin-top: -80px;
}
.email_wrap {
    padding:40px;
}
#cContents {
    margin-top:80px;
    line-height: 1.8em;
}
#cContents p {
    margin-bottom: 30px;
    line-height: 1.8em;
}
.table_overflow {
    overflow-x: auto;
    position: relative;
}

.fomul .con_box.press .ti {
    word-break: break-all;
    -webkit-line-clamp: unset;
    word-break: keep-all;
}
#cContents,
#cContents div,
#cContents p,
#cContents span {
    word-break: break-all;
    font-family: 'Nunito Sans', 'Notokr', sans-serif !important;
    font-size: 18px !important;
    line-height: 1.7em !important;
    letter-spacing: -0.02em !important;
}
section#step2, section#step3, section#step4, section#step5, section#step6 {
    padding-top: 150px;
}
sup {
    display: inline-block;
    font-size: 11px;
}
/******************************************/

@keyframes fadein {
    from { opacity:0; }
    to { opacity:1; }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@keyframes blur {
    0% {
        -webkit-filter: blur(50px);
        -moz-filter: blur(50px);
        -o-filter: blur(50px);
        -ms-filter: blur(50px);
        opacity: 0;
    }
    100% {
        -webkit-filter: blur(0px);
        -moz-filter: blur(0px);
        -o-filter: blur(0px);
        -ms-filter: blur(0px);
        opacity: 1;
    }    
}    

/**
레드
#e5001d
transition: rotate 0.4s;
-webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
-webkit-transform: translateX(-50%); transform: translateX(-50%);
:after {content:" "; display:block; clear:both; *zoom:1;}
-webkit-transition:all .2s ease .1s; transition:all .2s ease .1s;
width:00px; height:00px; background: url('../images/navi_prev.svg') no-repeat 50% 50%; background-size: 100%;
**/