/* GNB start */

.gnb{
    background-color:white;
    top: -1px;
}
.gnb-mobile{
    background-color:var(--itw-secndary-color-4);
}
.gnb-mobile .btn, .gnb-mobile .btn:focus{
    color:white;
}
.gnb-mobile .btn.active{
    color:black;
    background-color:var(--itw-gray-color-5);
    transform: rotate(180deg);
    border-color:var(--itw-gray-color-5);
    border-top: 16px solid var(--itw-gray-color-5) !important;
    margin-bottom:-14px;
}
.gnb-mobile .gnb-menu{
    height:100%;
    overflow-x: auto;
    height:3.4rem;
}
.gnb-mobile .gnb-menu > div{
    height:100%;
}
.gnb-mobile .gnb-menu a,.gnb-mobile .gnb-menu a:visited{
    color:var(--itw-font-color-6);
    line-height:3.4rem;
}
.gnb-mobile .gnb-menu > div.active a{
    border-bottom:3px solid white;
}
.carousel-mobile-topic .owl-dots{
    margin-top:1em !important;
}
.carousel-mobile-topic .owl-dots .owl-dot.active span{
    background-color:black !important;
}
.gnb-mobile .gnb-menu a{
    display:block;
    height:100%;
}
.gnb-menu{
    flex-flow: row nowrap;
    overflow:hidden;
}
.gnb-mask{
    height: 3.4rem !important;
    right:3rem;
    width:4em;
    background: rgb(252,72,0);
    background: linear-gradient(-90deg, rgba(252,72,0,1) 0%, rgba(252,72,0,0) 100%);
}
.gnb-menu > div:hover,.gnb-menu > div.active{
    background-color:var(--itw-secndary-color-4);
    color:white;
    font-weight:bold;
}
.gnb-menu > div.numbers:hover, .gnb-menu > div.numbers.active {
    background-color: #00B8FC;
    color: white;
    font-weight: bold;
}
.gnb-menu > div.numbers:hover img{
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
}
.gnb-menu > div.numbers img{
    filter: none;
    -webkit-filter: none;
}
.gnb-menu > div a,.gnb-menu > div a:visited{

}
.gnb-menu > div:hover a,.gnb-menu > div.active a{
    color:white;
    font-weight:bold;
}
.gnb-menu > div{
    height:3.1rem;
    line-height:3rem;
    white-space: nowrap;
}
.gnb a{
    display:block;
    width:100%;
    height:100%;
}
.gnb a:hover{
    color:#ffffff;
}
.gnb a:visited{

}
.gnb .input-search{
    background-image: url(/_images/icons/search.svg);
    background-position: 1em center;
    background-repeat: no-repeat;
    padding-left: 2.5em;
    font-family: lato;
    padding-left:2.5em;
    padding-top:0.8em;
    padding-bottom:0.8em;
    border-width: 0;
}
.gnb .input-search::placeholder{
    color:var(--itw-font-color-7);
    padding-left:0.5em;
    border-left:2px solid var(--itw-gray-color-3);
}
.gnb .search-icon{
    position:absolute;
    margin: 1.2em 0 1.2em 1em;
    padding-right:0.8em;
}
/* GNB END */
.section-top > div{
    height:3rem;
    display:flex;
    align-items: center;
}
.section-outlink{
    width:300px;
}
.section-outlink .outlink {
    width:90%;
    height: 100%;
}
.section-top .carousel-gnb-link,.section-top .carousel-gnb-link div{
    height:100%;
}
.section-top .outlink a{
    /*padding-top: 1rem;*/
}
.section-top .outlink small{
    display:block;
    line-height: 1em;
    /*margin-right: -5px;*/
    white-space: nowrap;
}

.section-top .carousel-gnb-link .owl-nav{
    margin-top:0;
}
.section-top .carousel-gnb-link .owl-stage {
    display: flex;
    align-items: center;
}
.section-top .carousel-gnb-link .owl-nav button{
    position: absolute;
    top: 0.5em;
    outline: 0;
    font-weight: bolder !important;
}
.section-top .carousel-gnb-link .owl-nav button.owl-next{
    right:-1em;
}
.section-top .carousel-gnb-link .owl-nav button.owl-prev{
    left:-1em;
}
.section-topic{
    z-index: 9999;
    background-color: white;
    max-width: 220px;
}
.nav-section-1>a{
    display: flex;
    height: 100%;
    align-items: center;
    border-bottom:3px solid white;
    border-top:3px solid white;
    justify-content: center;
}
.nav-section-1 a:hover,.nav-section-1 a.active{
    color:var(--itw-secndary-color-4);
    /*font-weight: bold;*/
    border-bottom-color:var(--itw-secndary-color-4);
}
.section-top .carousel-gnb-link .owl-item{
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
}
.section-top .carousel-gnb-link .owl-item:after{
    content: " ";
    height:0.8em;
    position:absolute;
    top:1.2em;
    right:-0.3em;
    border-right:1px solid var(--itw-gray-color-2);
}
.section-top .carousel-gnb-link .owl-item a{
    display: flex;
    height: 100%;
    align-items: center;
    border-bottom:3px solid white;
    border-top:3px solid white;
    justify-content: center;
}
.section-top .carousel-gnb-link .owl-item a:hover{
    color:var(--itw-secndary-color-4);
    /*font-weight: bold;*/
    border-bottom-color:var(--itw-secndary-color-4);
}
/* insider */
/*
.insider {
    background-color: #6eae00;
}
.insider span{
    display:block;
    -webkit-text-size-adjust: none !important;
    -webkit-transform:scale(0.6);
    letter-spacing: 1px;
}
.insider-tooltip{
    position:inherit;
}
.insider-tooltip .tooltip-inner{
    padding:0 0 0 0;
}
.insider-tooltip .tooltip-arrow::before {
    border-left-color: #6eae00;
    border-right-color: #6eae00;
}
 */
/* topic start */
.section-topic .board-topic{
    background-color: var(--itw-gray-color-5);
    height: 30em;
    overflow: auto;
}
.list-topic li{
    background-color:transparent;
}
.list-topic li a:hover{
    color:var(--itw-secndary-color-4);
    text-decoration: underline;
    font-weight:bold;
}
/* topic end */
.bottom{
    background-color: var(--itw-font-color-2);
    padding-top:4rem;
    padding-bottom:4rem;
}
.bottom a{
    color:var(--itw-gray-color-2);
    text-decoration: none;
}
.bottom a:hover{
    color:var(--itw-gray-color-6);
}
.bottom dl dt{
    font-size:1.3rem;
}
.bottom dl dd{
    font-size:0.93rem;
    margin-bottom:0.2em;
    display: flex;
    align-items: center;
}
.card .card-body .sns a{
    background-color: #ffffff;
    border:1px solid #dfdfdf;
    border-radius: 100%;
    width:1.86rem;
    height:1.86rem;
    background-position: center;
    background-repeat: no-repeat;
}
.navbar a.twitter{
    border-radius: 100%;
    display:inline-block;
    height:2rem;
    width:2rem;
    background-image:url('/_images/icons/twitter.svg');
    background-position: center;
    background-repeat:no-repeat;
    border:1px solid var(--itw-gray-color-3);
}
.navbar a.facebook{
    border-radius: 100%;
    display:inline-block;
    height:2rem;
    width:2rem;
    background-image:url('/_images/icons/facebook.svg');
    background-position: center;
    background-repeat:no-repeat;
    border:1px solid var(--itw-gray-color-3);
}
.navbar a.rss{
    border-radius: 100%;
    display:inline-block;
    height:2rem;
    width:2rem;
    background-image:url('/_images/icons/rss.svg');
    background-position: center;
    background-repeat:no-repeat;
    border:1px solid var(--itw-gray-color-3);
}
a.twitter:hover{
    background-color: #1B9BC8 !important;
    background-image: url('/_images/icons/twitter-w.svg') !important;
    transition: background 0.2s linear;
}
a.facebook:hover{
    background-color: #2D5498 !important;
    background-image: url('/_images/icons/facebook-w.svg') !important;
    transition: background 0.2s linear;
}
a.rss:hover{
    background-color: #555555 !important;
    background-image: url('/_images/icons/rss-w.svg') !important;
    transition: background 0.2s linear;
}
.bottom .join-us dd>a:first-child{
    background-color: #FFFFFF;
    border-radius: 100%;
    width:1.86rem;
    height:1.86rem;
    background-position: center;
    background-repeat: no-repeat;
}
.bottom .bottom-2 a.sns{
    background-color: #666666;
    border-radius: 100%;
    width:2.73rem;
    height:2.73rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 1rem 1rem;
}
.bottom .bottom-2 .border-top{
    border-top-color:var(--itw-gray-color-1) !important;
}
/* share button */
.btn-email{
    width:3rem;
    background-color:var(--itw-secndary-color-4);
}
.btn-kakao{
    width:3rem;
    background-color:var(--color-kakao-1);
}
.btn-facebook{
    width:3rem;
    background-color:var(--color-facebook-1);
}
.btn-twitter{
    width:3rem;
    background-color:var(--color-twitter-1);
}
.btn-print{
    width:3rem;
    color:var(--itw-font-color-6);
    background-color:var(--itw-font-color-1);
}
/* evp */
.carousel-evp .badge{
    line-height: 2em;
}
.carousel-evp button{
    color: var(--itw-font-color-6);
}
.carousel-evp button{
    background-color: var(--itw-secndary-color-2);
}
.carousel-evp button:hover{
    background-color: var(--itw-primary-color-2);
    color: var(--itw-font-color-6);
}
.request-tb-upload{
    background-color:var(--itw-secndary-color-1);
}
.signup-email{
    background-color:var(--itw-primary-color-1);
}
.request-tb-upload button,.signup-email button{
    line-height:0.9em;
}
.input-email{
    background-image:url('/_images/icons/email.svg');
    background-position: 1em center;
    background-repeat: no-repeat;
    padding:1em 0 1em 3em;
    font-size: 0.73rem;
}
.input-email::placeholder{
    font-size: 0.73rem;
    font-family: nato;
    color:var(--cio-gray-color-2);
    padding-left:0.5em;
    border-left:1px solid silver;
}
.owl-theme .owl-nav [class*=owl-]:hover {
    color: var(--itw-secndary-color-4) !important;
}
.owl-theme .owl-nav [class*=owl-]:hover{
    background-color: transparent !important;
}
.owl-theme .owl-dots .owl-dot:hover span{
    background:var(--itw-primary-color-2);
}
.carousel-email-section .owl-nav button{
    position: absolute;
    top: 2rem;
    outline: 0;
    font-weight: bolder !important;
    font-size: 2rem !important;
}
.carousel-email-section .owl-nav{
    margin-top:0 !important;
}
.carousel-email-section .owl-nav button.owl-prev{
    left:0.5rem;
}
.carousel-email-section .owl-nav button.owl-next{
    right:0.5rem;
}
.text-topic{
    color:var(--itw-secndary-color-4);
}
.bg-tag{
    background-color:var(--itw-gray-color-4);
}
.thumb a{
    background-size:cover;
    background-repeat:no-repeat;
    background-position: center;
}
/* pagination */
.pagination .page-item a.page-link:hover{
    color:var(--itw-font-color-1);
}
.pagination .page-item .page-link{
    background-color:transparent;
    color:var(--itw-font-color-4);
}
.pagination .page-item.active .page-link{
    color:var(--itw-font-color-1);
    text-decoration: underline;
    font-weight: bold;
}
.bullet-rect {
    display: inline-block;
    width: 0.3em;
    height: 1em;
}
/* Small devices (landscape phones, 576px and up) XS */
@media (max-width: 575px) {
    .bottom .logo-cio {
        width: auto;
    }
    .bottom{
        font-size:0.9em;
    }
    .bottom dl dd {
        font-size:0.9em;
    }
    .bottom dl dt {
        font-size:1em;
    }
}
@media (min-width: 576px) {
    .bottom .logo-cio {
        width: auto;
    }
    .bottom{
        font-size:0.9em;
    }
    .bottom dl dd {
        font-size:0.9em;
    }
    .bottom dl dt {
        font-size:1em;
    }
    .node-list .card-body > .card-title{
        line-height:1.4;
    }
}

/* google search */
.gsc-refinementsArea {
    padding: 0.7em;
}
.gsc-selected-option-container{
    width:5rem;
}

/* Medium devices (tablets, 768px and up) MD */
@media (min-width: 768px) {
    .bottom .logo-cio{
        width:165px;
    }
    .bottom dl dd {
        font-size: 1em;
    }
    .bottom dl dt {
        font-size: 1.2em;
    }
    .node-list .card-body > .card-title{
        line-height:1.4;
    }
}

/* Large devices (desktops, 992px and up) LG */
@media (min-width: 992px) {
    .bottom .logo-cio{
        width:165px;
    }
    .bottom dl dd {
        font-size: 1em;
    }
    .bottom dl dt {
        font-size: 1.2em;
    }
    .section-right{
        width:calc(300px + ( var(--bs-gutter-x) * 0.5)) ;
        max-width: calc(300px + ( var(--bs-gutter-x) * 0.5)) ;
    }
    .section-content{
        width:calc(100% - 300px - (var(--bs-gutter-x) * 0.5));
    }
}

/* Extra large devices (large desktops, 1200px and up) XL*/
@media (min-width: 1200px) {
    .gnb .div-search{
        width:300px;
    }
    .bottom .logo-cio{
        width:165px;
    }
    .bottom dl dd {
        font-size: 1em;
    }
    .bottom dl dt {
        font-size: 1.2em;
    }
}

/* banner */
#MPU_top img,#MPU_middle img,#MPU_bottom img,
#MPU_top ins,#MPU_middle ins,#MPU_bottom ins{
    /*margin-bottom:0.5rem;*/
}
#MPU_top ins,#MPU_middle ins,#MPU_bottom ins{
    display:block;
    margin-bottom:0.5rem;
}
#MPU_top iframe,#MPU_middle iframe,#MPU_bottom iframe{
    margin-bottom:0.5rem;
}
.idg-banner img{
    max-width:100%;
    height:auto !important;
}
.idg-banner .btn-banner-close{
    background-color:var(--itw-gray-color-2);
    border-radius: 50%;
    width:1.4em;
    height:1.4em;
    display:block;
    text-align: center;
}
.top-leaderboard .banner-inner img{
    max-width:100%;
    height:auto !important;
}
.top-leaderboard .btn-banner-close{
    top:calc(50% - 0.7em);
    right:1em;
}
.list_group_tech_survey{
    background-color: var(--itw-blue-dark);
}
/* search */
.btn-search{
    border-color:var(--itw-gray-color-2);
}
.btn-check:checked + .btn-search{
    color: white;
    background-color: var(--itw-primary-color-1);
    border-color: var(--itw-primary-color-1);
}

/* navi */
.nav-1 > div{
    height:2.3rem;
    display:flex;
    align-items: center;
}
.nav-1 a:hover, .nav-1 a.active {
    color: var(--itw-secndary-color-4);
    /* font-weight: bold; */
    border-bottom-color: var(--itw-secndary-color-4);
}
.nav-1>a {
    display: flex;
    height: 100%;
    align-items: center;
    border-bottom: 3px solid white;
    border-top: 3px solid white;
    justify-content: center;
}
/* numbers */
.list-group-numbers h5{
    line-height:1.2;
    font-size:1.25rem;
}
.list-group-numbers .sub-info{
    font-size:0.95rem !important;
}
.numbers-thumb {
    height: 9em;
    background-size: cover;
    background-position: center;
}
.numbers-thumb-info {
    bottom: 0rem;
    left: 0;
    color: white;
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0) 100%);
}
.small.numbers {
    line-height:1.4;
}
.numbers-thumb-info .inner .number {
    line-height: 0.8;
    letter-spacing: -0.4rem;
    margin-bottom: auto;
}
.member-ui .popover-body{
    padding: 0.5em;
}
/* wall */
.wall {
    max-width: 900px;
    margin: 0 auto;
    border:1px solid var(--itw-gray-color-3);;
    position: relative;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 10%), 0 8px 16px rgb(0 0 0 / 10%);
    box-sizing: border-box;
}

/* welcome banner */
#welcome_banner{
    position: fixed;
    width:100%;
    height:100%;
    z-index: 9999;
    top:0;
}
#welcome_banner_inner ins{
    display:block !important;
    margin: 30px auto 0 !important;
    max-width:100%;
}
#welcome_banner_bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;

    /* display: none; */
    background-color: #111111;
    opacity: 0.5;
}
#welcome_banner_inner{
    position: absolute;
    top: 0px;
    /*
    margin-left: 50%;
    padding-left: -300px;
    */
    width:100%;
    z-index: 999999;
}
#welcome_banner_close_btn{
    width:600px;
    background-color:black;
    margin:0 auto;
}

/* mobile welcome banner */
#mobile_welcome_banner_bg{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index:999998;
    background-color: #000000;
    opacity: 0;
}
#mobile_welcome_banner_inner{
    position: fixed;
    top: 10%;
    /*
    margin-left: 50%;
    padding-left: -300px;
    */
    width:100%;
    z-index: 999999;
    display:none;
    height:100%;
}
#mobile_welcome_banner_close_btn{
    margin-top:5px;
}