@charset "UTF-8";



/* ===================================
    01. Typography
====================================== */

/* heading */
h1, h2, h3, h4, h5, h6 {margin:0 0 25px; padding:0; letter-spacing: 0; font-weight: 400;}
h3 {line-height:54px}


/* text size */
.text-extra-small {font-size:11px; line-height:14px}
.text-small {font-size:12px; line-height:20px}
.text-medium {font-size:16px; line-height:23px}
.text-large {font-size:18px; line-height:26px}
.text-extra-large {font-size: 20px; line-height:26px}
.title-large {font-size: 100px; line-height:95px}
.title-extra-large {font-size: 130px; line-height:120px}

/* font weight */
.font-weight-100 {font-weight:100}
.font-weight-200 {font-weight:200 !important}
.font-weight-300 {font-weight:300}
.font-weight-400 {font-weight:400}
.font-weight-500 {font-weight:500}
.font-weight-600 {font-weight:600}
.font-weight-700 {font-weight:700}
.font-weight-800 {font-weight:800}
.font-weight-900 {font-weight:900}

/* line height */





/* common */
.fs-13 {font-size:13px; line-height:20px}
.fs-14 {font-size:14px !important; line-height:21px}
.fs-15 {font-size:15px !important; line-height:22px}
.fs-17 {font-size:17px !important;}
.fs-28 {font-size:28px !important; line-height: 42px;}
.fs-40 {font-size:40px !important;}
.fs-45 {font-size:45px !important;}
.fs-50 {font-size:50px !important;}





/*==============================
    02. Margin
================================*/

.no-margin {margin:0 !important}
.no-margin-lr {margin-left: 0 !important; margin-right: 0 !important}
.no-margin-tb {margin-top: 0 !important; margin-bottom: 0 !important}
.no-margin-top {margin-top:0 !important}
.no-margin-bottom {margin-bottom:0 !important}
.no-margin-left {margin-left:0 !important}
.no-margin-right {margin-right:0 !important}
.margin-lr-auto {margin-left:auto !important; margin-right:auto !important}
.margin-auto {margin: 0 auto !important;}

.margin-5px-top {margin-top:5px}
.margin-10px-top {margin-top:10px}
.margin-15px-top {margin-top:15px}
.margin-20px-top {margin-top:20px}
.margin-25px-top {margin-top:25px}
.margin-30px-top {margin-top:30px}
.margin-35px-top {margin-top:35px}
.margin-40px-top {margin-top:40px}
.margin-45px-top {margin-top:45px}
.margin-50px-top {margin-top:50px}
.margin-55px-top {margin-top:55px}
.margin-60px-top {margin-top:60px}

.margin-5px-bottom {margin-bottom:5px}
.margin-10px-bottom {margin-bottom:10px}
.margin-15px-bottom {margin-bottom:15px}
.margin-20px-bottom {margin-bottom:20px}
.margin-25px-bottom {margin-bottom:25px}
.margin-30px-bottom {margin-bottom:30px}
.margin-35px-bottom {margin-bottom:35px}
.margin-40px-bottom {margin-bottom:40px}
.margin-45px-bottom {margin-bottom:45px}
.margin-50px-bottom {margin-bottom:50px}
.margin-55px-bottom {margin-bottom:55px}
.margin-60px-bottom {margin-bottom:60px}

.margin-5px-right {margin-right:5px}
.margin-10px-right {margin-right:10px}
.margin-15px-right {margin-right:15px}
.margin-20px-right {margin-right:20px}
.margin-25px-right {margin-right:25px}
.margin-30px-right {margin-right:30px}
.margin-35px-right {margin-right:35px}
.margin-40px-right {margin-right:40px}
.margin-45px-right {margin-right:45px}
.margin-50px-right {margin-right:50px}
.margin-55px-right {margin-right:55px}
.margin-60px-right {margin-right:60px}

.margin-5px-left {margin-left:5px}
.margin-10px-left {margin-left:10px}
.margin-15px-left {margin-left:15px}
.margin-20px-left {margin-left:20px}
.margin-25px-left {margin-left:25px}
.margin-30px-left {margin-left:30px}
.margin-35px-left {margin-left:35px}
.margin-40px-left {margin-left:40px}
.margin-45px-left {margin-left:45px}
.margin-50px-left {margin-left:50px}
.margin-55px-left {margin-left:55px}
.margin-60px-left {margin-left:60px}


/*==============================
    03. Padding
================================*/
.px-0 {padding-left: 0 !important; padding-right: 0 !important;}

.padding-5px-top {padding-top:5px;}
.padding-10px-top {padding-top:10px;}
.padding-15px-top {padding-top:15px;}
.padding-20px-top {padding-top:20px;}
.padding-25px-top {padding-top:25px;}
.padding-30px-top {padding-top:30px;}
.padding-35px-top {padding-top:35px;}
.padding-40px-top {padding-top:40px;}
.padding-45px-top {padding-top:45px;}
.padding-50px-top {padding-top:50px;}
.padding-55px-top {padding-top:55px;}
.padding-60px-top {padding-top:60px;}

.padding-5px-bottom {padding-bottom:5px;}
.padding-10px-bottom {padding-bottom:10px;}
.padding-15px-bottom {padding-bottom:15px;}
.padding-20px-bottom {padding-bottom:20px;}
.padding-25px-bottom {padding-bottom:25px;}
.padding-30px-bottom {padding-bottom:30px;}
.padding-35px-bottom {padding-bottom:35px;}
.padding-40px-bottom {padding-bottom:40px;}
.padding-45px-bottom {padding-bottom:45px;}
.padding-50px-bottom {padding-bottom:50px;}
.padding-55px-bottom {padding-bottom:55px;}
.padding-60px-bottom {padding-bottom:60px;}

.padding-5px-right {padding-right:5px;}
.padding-10px-right {padding-right:10px;}
.padding-15px-right {padding-right:15px;}
.padding-20px-right {padding-right:20px;}
.padding-25px-right {padding-right:25px;}
.padding-30px-right {padding-right:30px;}
.padding-35px-right {padding-right:35px;}
.padding-40px-right {padding-right:40px;}
.padding-45px-right {padding-right:45px;}
.padding-50px-right {padding-right:50px;}
.padding-55px-right {padding-right:55px;}
.padding-60px-right {padding-right:60px;}

.padding-5px-left {padding-left:5px;}
.padding-10px-left {padding-left:10px;}
.padding-15px-left {padding-left:15px;}
.padding-20px-left {padding-left:20px;}
.padding-25px-left {padding-left:25px;}
.padding-30px-left {padding-left:30px;}
.padding-35px-left {padding-left:35px;}
.padding-40px-left {padding-left:40px;}
.padding-45px-left {padding-left:45px;}
.padding-50px-left {padding-left:50px;}
.padding-55px-left {padding-left:55px;}
.padding-60px-left {padding-left:60px;}

.pl-3 {padding-left: 3px !important;}




/*==============================
    04. common
================================*/
body {overflow-x: hidden;}

#ms.container-fluid {padding-bottom: 20px;}

footer.gray {
    background-color: #515458
}
footer .container .row {padding-bottom: 35px; text-align: center; }
footer .container .row p {color: #ffffff; padding-top: 2rem; font-weight: 300;}

.ms-gnb-wrap {margin-bottom: 50px; background-color: #ffffff; border-bottom: 1px solid #ddd;}
.ms-gnb-wrap .container {position: relative;}
.navbar-default.ms-gnb {background: transparent; height: auto;}
.navbar-default .navbar-brand {padding-top: 6px; font-size: 28px; color: #000; font-weight: 500;}
.navbar>.container-fluid{
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;}


    /* .navbar-nav.ms-nav {padding-right: 200px;} */
    .navbar-nav.ms-nav.nav {padding-left: 50px;}
    .navbar-nav.ms-nav.nav > li a:hover {background-color: #555555; color: #fff;}
    .navbar-nav.ms-nav.nav > li.active {background-color: #212529;}
    .navbar-nav.ms-nav.nav > li.active a {color: #fff;}
    .navbar-nav.ms-nav.nav > li > a {display:inline-block;background-color: transparent; padding: 30px 30px;font-size: 1.1rem;}

    .ms-gnb form {position: absolute; top: 22px; right: 40px; display:flex;}

    .ms-gnb form .form-control {height: 40px;
    padding: 8px 15px;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    border-radius: 0;}

    .ms-gnb form input[type=submit]  {border-radius: 0; color: #ffffff; background-color: #212529; padding: 8px 16px; border: 1px solid #212529; font-size: 0.83rem;}

    i {padding-left: 3px;}

    .ms-company-name {overflow: hidden; width: 300px;}

a {color: #232323;}



/*==============================
    05. default
================================*/

.news-head {padding-right: 30px;}
.news-head a {display: block;text-align: center;}
.news-head a img {display: inline-block; }
.news-head .n_title a {display: block ;padding-top: 13px; padding-bottom: 8px; font-size: 28px; font-weight: 700; color: #000; line-height: 1.3;text-align: left;}
.news-head .n_summary {padding-bottom: 45px;}
.news-head .n_summary a {font-size: 16px; line-height: 1.5; text-align: left; color: #111;}
.news .thumb a img {width: 180px;}

.news-more {text-align:right; font-size: 14px; padding-bottom: 5px;margin-right: 40px; margin-top: 7px;}

#ms .news-list {margin:20px 40px 0 0; padding-bottom: 20px; border-bottom: 1px solid #eee; }
#ms .news-list .n_title a {font-weight: 700; font-size: 18px; line-height: 1.4; color: #111;}
#ms .news-list .date {padding-top: 0; margin-bottom: 0; color: #666666; font-weight: 400; font-size: 14px;}
#ms .news-list .date span {margin-left: 30px; color: #3786c3;}
#ms .news-list p {padding-top: 6px; font-size: 15px; margin-bottom: 7px;}
#ms .news-list p a {color: #333; line-height: 1.5;}

.main-video-thumb {position: relative; padding-right: 15px;}
.main-video-thumb img {width: 295px; height: 166px;object-fit: cover;}
.col-md-6 .main-video-thumb .icon-play {position: absolute; right: 13%; top: 53%;}
.main-video-thumb .icon-play img {width: 38px; height: 38px;}
.main-video-thumb .n_title a {color: #000000; font-weight: 500; padding-top: 15px; font-size: 16px; min-height: 60.69px;}

.main-webinar-wrap {position: relative; padding: 0 0 0 15px;}
.main-webinar-wrap h3 {font-size: 27px; color: #1265a8; font-weight: 700; border-bottom: 1px solid #eeeeee; margin-bottom: 0;}
.main-webinar-wrap .webinar {padding-bottom: 25px;}
.main-webinar-wrap .webinar .w_title a {display: block; color: #000000; font-weight: 500; padding-top: 15px; font-size: 16px;}
.main-webinar-wrap .webinar .w_thumb img {height: 166px;}
.main-webinar-wrap .webinar .w_date {font-size: 14px;}
.main-webinar-wrap .webinar .w_date .diff {color: #ff0000;}
.main-webinar-wrap .webinar-more {position: absolute; bottom:10px; right:0; font-size: 14px;}


.best-qna-wrap {position: relative; background-color: #f6f6f6; margin-top: 20px; padding: 0 30px 15px 30px;}
.best-qna-wrap h3 {padding-top: 10px; margin-bottom: 4px; font-size: 27px; font-weight: 700; color: #1265a8; }
.best-qna-wrap .best-qna a {display: block; padding-top: 3px;}
.best-qna-wrap .last-wbn-title {position: relative; padding-bottom: 10px; padding-right: 94px; line-height: 1.2;  color: #333333; font-weight: 600; font-size: 19px; }
.best-qna-wrap .last-wbn-title span {position: absolute; right: 0; top: 3px; font-size: 14px; color: #777777; font-weight: normal; letter-spacing: -0.5px;}
.best-qa-item .best-q {background-color: #fff; padding:5px 10px; margin-bottom: 10px; font-size: 14px; border-radius: 6px;}
.best-qa-item .best-q .q-name {color:#888888;}
.best-qa-item .best-a { padding: 5px 10px;  margin-bottom: 10px; font-size: 14px; background-color: #ffffff; color: #ff661f; border-radius: 6px;}
.best-qa-item .best-a .a-name {font-weight: bold;}

.tech-doc-wrap {position: relative; margin-top: 20px;}
.tech-doc-wrap h3 {padding-top: 25px; margin-bottom: 0; font-size: 22px; font-weight: 700; color: #1265a8; line-height: 47px;}
.tech-doc .table td {padding-top: 15px; padding-bottom: 11px;}
.tech-doc .table .icon-file {width: 7%;}
.tech-doc .table .td-txt h5 {padding-top: 3px; font-size: 18px; color: #000; line-height: 1.3; margin-bottom: 15px;}
.tech-doc .more {position: absolute; right: 0; top: 39px;}
.tech-doc .btn-download {padding: 3px 9px; margin-top: 2px; border: 1px solid #1265a8; border-radius: 5px; color: #1265a8; background-color: #fff; font-weight: 500; font-size: 14px;width: 90px;}
.tech-doc .btn-download:hover {background-color: #1265a8; color: #ffffff;} 
.tech-doc .no-tech-data {margin-top: 13px; padding: 45px 0; border: 1px solid #ddd; text-align: center;}

.tech-doc  .btn-outline-secondary {
    border: 1px solid;
    padding: .2rem 1rem;
}

/* scroll top */
a.top {
    position: fixed;
    bottom:20px;
    right:30px;
    width:48px;
    height:24px;
	border:1px solid #eee;
	background-color:white;
	text-align:center;
	vertical-align:middle;
}


/*==============================
    06. news_list
================================*/

#ms ul.main_news_list li.media {padding: 20px 0 10px 0;}
#ms ul.main_news_list li.media a img {width: 260px; height: 150px; margin-right: 20px;}
#ms ul.main_news_list li.media .media-body h4.media-heading {margin-bottom: 0;}
#ms ul.main_news_list li.media .media-body h4.media-heading a {padding-bottom: 15px; font-size: 26px; font-weight: 500;}

#ms .sub-bottom-related ul.main_news_list li.media {padding: 22px 0 16px 0;}
#ms .sub-bottom-related ul.main_news_list li.media .media-body h4.media-heading a {padding-top: 5px; padding-bottom: 9px; font-size: 21px;}
#ms .sub-bottom-related ul.main_news_list li.media a img {width: 220px;}

#ms .col-lg-9.col-md-9.section.view-23n {margin-top: 20px;}

#ms .rank-list {margin-top: 0;}

#ms .aside_cont.aside-23n {margin-top: 12px;}

.pagination-area a i {line-height: 34px;}

.thumbnail.news-23n h3 {
    margin: 0 0 10px 0;
    font-size: 33px;
    color: #111111;
    font-weight: 600;
}
.social-cluster ul li a {font-size: 1.5rem;}

.social-cluster-list li:first-child a { font-size: 1.3rem;}

.reporter-info .ms-auto .report {
    font-size: .96rem;
    font-weight: 400;
}

.ms-report .modal-header.dark {
    background-color: #333333;
    color: #ffffff;
    padding-left: 2rem;
}
.ms-report .modal-header.dark .btn-close {
    background-color: #fff;
    margin-right: .5rem;
}
.ms-report .modal-body {
    padding-left: 2em;
    padding-right: 2rem;
}
.ms-report .modal-body label {
    padding-top: 1rem;
    padding-bottom: .3rem;
}

.ms-report .modal-footer {
    padding-right: 2rem;
}
.ms-report .modal-footer .btn-success {
    font-size: 1rem;
}
.report_captcha {
    margin-top: 1rem;
}


/*==============================
    07. webinar_list
================================*/

.ms-webinar .row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1* var(--bs-gutter-y));
    margin-right: calc(-.5* var(--bs-gutter-x));
    margin-left: calc(-.5* var(--bs-gutter-x));
}

.ms-webinar .row>* {
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x)* .9);
    padding-left: calc(var(--bs-gutter-x)* .9);
    margin-top: var(--bs-gutter-y);
}

.ms-webinar-list {padding-bottom: 70px;}
.ms-webinar-list h3 {padding-top: 10px; min-height: 92px; margin-bottom: 0; font-size: 18px; line-height: 1.4; font-weight: 500; word-break: keep-all;}
.ms-webinar-list img {width: 100%; height: 170px;}
.ms-webinar-content p a {font-size: 14px; font-weight: 300; color: #656565;}



/*==============================
    07. search
================================*/

.ms-search .col-lg-6 {padding-right: 40px;}
.ms-search .col-lg-6 h3 {color: #000; font-size: 30px; font-weight: 600;}
#ms .ms-search ul.main_news_list li.media a img {width: 190px; height: auto; margin-top: 0;}
#ms .ms-search ul.main_news_list li.media .media-body h4.media-heading a {font-size: 19px;}
#ms .ms-search .media>.pull-left {padding-right: 0;}
.search-list {display: flex; padding-bottom: 1rem;}
.search-list.webinar {padding-left: 5px; padding-bottom: 3rem;}
.search-list .cnts {line-height: 3.3; padding-right: 60px;}
.search-list .cnts form .form-control {
    padding: 7px 15px;
}
.search-list form {vertical-align: middle;}
.search-list form .form-control {display: inline-block; padding-top: 7px; padding-bottom: 7px; height: 40px;}
.search-list form .btn-u {height: 40px; vertical-align:top; line-height: 11px; background-color: #fff; border: 1px solid #666; color: #333;}
.search-list form input[type="text"] {width: 300px;}

.search-webinar-list {padding-left: 3rem;}
.search-webinar-list .category-news-content p a {font-size: .9rem; font-weight: 400;  color: #505050;}
.search-webinar-list .category-news-content a .day-txt {display: inline; font-size: 1rem; color: #ff0000}
.search-webinar-list  .webinar-btn {text-align: right;}
.search-webinar-list  .webinar-btn .regi-btn {display: inline; background-color: #3786c3; color: #fff; padding: .3rem 1rem;}







@media (max-width: 575.98px) {

    .ms-gnb .container-fluid>.navbar-collapse {margin-right: 0; margin-left: 0;}
    .ms-gnb .navbar-collapse {margin-top: 10px; background-color: #f8f9fa;}
    .ms-gnb form {margin-left: 0; }
    .ms-gnb form .form-control {display: inline-block; width: 79%; margin-left: 3%;}
    .navbar-nav.ms-nav {padding-right: 0}
    .navbar-nav.ms-nav.nav > li > a {padding: 12px 0 12px 22px;display: block;font-size: 1rem;}

    section {padding: 60px 0;}

    .text-medium {font-size: 14px;}
    .text-large {font-size: 15px;}
    .alt-font.solution-title span {font-size:16px; }
    .alt-font.text-point {font-size: 24px; line-height: 42px;}
    .page-title-large h1 {font-size: 25px; line-height: 29px;}

    .fs-title-01 {font-size: 19px;}

    .down-section.btn-inquiry {bottom: 19px;}

    h5.alt-font.text-extra-dark-gray.font-weight-600.mb-0.line-height-50 {font-size: 17px;}
    .line-height-50 {line-height: 33px;}
    h4.line-height-60 {line-height: 41px; font-size: 21px;}

    .feature-content p {font-size: 14px;}

    .portfolio-filter-tab-1 li {width: 50%;}

    .btn_comment3 {width: 64px;}
    
    #ms .sub-bottom-related ul.main_news_list li.media a img {width: 110px; height: auto; margin-right: 10px;}

    ul.main_news_list li.media .media-body p.date {letter-spacing: -0.5;}

}




@media (max-width: 767.98px) { 

    .navbar-default .navbar-brand {height: 40px; padding-top: 0;}

    .navbar-toggle {margin-top: 18px;}

    .page-title-large h1 {font-size: 42px}
    .alt-font.solution-title span {font-size: 27px;}

    .navbar-nav.ms-nav {padding-right: 0}

    .ms-gnb form {position: static;}

    #ms .news-list {margin: 20px 0 0 0;}
    #ms .news-list .n_title a {display: block; padding-top: 15px;}

    .news-more {margin-right: 15px;}

    .main-video-thumb { margin-top: 40px; padding-right: 0;} 
    .main-video-thumb img, .main-webinar-wrap .webinar .w_thumb img, .news .thumb a img {width: 100% !important; height: auto;}
    .col-md-6 .main-video-thumb .icon-play {right: 7%;}

    .col-md-6 .main-video-thumb .icon-play {right: 7%; top: 58%;}

    .main-webinar-wrap {margin-top: 90px; margin-bottom: 70px;}
    .main-webinar-wrap .webinar {padding-bottom: 50px;}
    .main-webinar-wrap .webinar-more {right: 15px;}

    .best-qna-wrap {margin-top: 80px; padding-left: 10px; padding-right: 10px;}

    .tech-doc-wrap { margin-top:60px;} 
    .tech-doc .table .td-txt {padding-bottom: 10px !important;}
    .tech-doc .table .td-txt h5 {padding-top: 13px;}
    .tech-doc .more {right: 15px;}


    .tab-content {padding-left:5px; padding-right: 15px;}

    .ms-webinar-list img {height: auto;}

    #ms ul.main_news_list li.media .media-body h4.media-heading a {font-size: 20px; line-height: 1.3; padding-right: 0;}
    
    .social-cluster .social-cluster-list {margin-right: 5px; font-size: 1.2rem;}
    .social-cluster .social-cluster-list li a {font-size: 1.5rem;}
    .social-cluster-list li:first-child {width: auto;}
    .social-cluster-list li:first-child a { font-size: 1.3rem;}


    .search-list .cnts {padding-right: 0; padding-left: 15px;}
    .search-list form input[type="text"] {width: 200px; margin-left: 10px;display: inline-block;}
    .search-list form input[type="submit"] {width: auto;display: inline-block;}
    .search-list form .btn-u {padding-left: .6rem; padding-right: .6rem;}

    .search-list.webinar {padding-left: 0;}


    .news_area.ps-10 {padding-left: 0;}

    .col-lg-9.col-md-9.section.view-23n {margin-top: 0 !important;}

    .ms-search .col-lg-6 {padding-right: 0; padding-bottom: 100px;}


    .pagination>li>a {padding-left: 10px; padding-right: 10px;}
    

 }




@media (max-width: 991.98px) { 

    .container {padding: 0 2% 0 2%;}

    .navbar>.container-fluid {display: block;}

    .navbar-nav.ms-nav.nav {padding-left: 0;}

    .ms-gnb-wrap .container {
        padding-top: 3px;
        padding-bottom: 3px;
        background-color: #f8f9fa;
    }

    .ms-company-name {width: 250px; margin-top: 10px; padding-left: 10px;}

    .ms-gnb form {right: 0; margin-top: 20px;}

    .navbar-nav > li.dropdown > .fas {top: 16px;}

    .news-head {padding-right: 0;}

    .main-webinar-wrap .webinar {min-height: 320px;}
    .main-webinar-wrap .webinar .w_thumb img {width: 94%; height: auto; }

    .col-lg-6.padding-25px-left {padding-left: 0;}

    .main-video-thumb {margin-top: 0; min-height: 320px;}
    .main-video-thumb img {width: 100%; height: auto; object-fit: cover;}

    .margin-45px-bottom {margin-bottom: 0;}

    .search-webinar-list {padding-left: 12px; padding-right: 12px !important;}

    .tech-doc .table .icon-file {width: 13%;}
    
    a.top {bottom: 10px;}
 }
 




@media (min-width: 992px) and (max-width: 1199.98px) { 

    .navbar>.container-fluid {display: block;}

    .navbar-nav.ms-nav.nav {padding-left: 0;}

    .ms-company-name {padding-top: 30px;}

    .navbar-default {height: auto !important;}

    .main-webinar-wrap {padding-left: 0;}

    .news .thumb a img {width: 88%;}
 
    
}



// X-Large devices (large desktops, less than 1400px)
@media (max-width: 1399.98px) { 

 }