/* custom HD */
    .hd-margin {
        margin: 255px auto 16px auto !important;
    }

    .hd-margin-02 {
        margin: 0 !important;
        margin-top: 100px !important;
    }


	#fp-nav ul li a span, .fp-slidesNav ul li a span {
		height: 8px;
		width: 8px;
		background: rgba(255,255,255,0.4);
	}
	#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span {
		height: 8px;
		width: 8px;
		margin: -2px 0 0 -2px;
		background: #ff0018;
	}
    #background_video {
      position: absolute;

      top: 50%; left: 50%;
      transform: translate(-50%, -50%);

      object-fit: cover;
      height: 100%; width: 100%;
    }
    #overlay {
      position: absolute;
      top: 0; right: 0; left: 0; bottom: 0;
      background: rgba(0,0,0,0.5);
    }


    .wv_hide {
        display: none;
    }

	.center > .item {
		background-image: url(/images/sec1_Ellipse.png);
		font-size: 3.5em;
		font-weight: 600;
		margin-top: 0;
		letter-spacing: 0.02em;
	}
	.center > .item:before {
		content: '';
		display: block;
		width: 55px;
		height: 2px;
		border-top: 2px solid #FFF;
		margin: 0 auto 40px auto;
	}

	.arrow_btn {
		margin-top: 30px;
		background: #000;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		position: relative;
		cursor: pointer;
	}

	.arrow_btn > img {
		position: absolute;
		top: 55%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.arrow_btn:hover {
		background: #ff0018;
	}
	.arrow_btn:hover img {
		-webkit-animation: go-right 1s linear infinite alternate; /* Safari 4+ */
		-moz-animation:    go-right 1s linear infinite alternate; /* Fx 5+ */
		-o-animation:      go-right 1s linear infinite alternate; /* Opera 12+ */
		animation:         go-right 1s linear infinite alternate; /* IE 10+, Fx 29+ */
	}

	.owl-carousel .owl-stage-outer, .owl-carousel .owl-stage, .owl-item { height: 100%; }

	.position_absolute_center{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}

	.position_absolute_out{
		width:100%;
		position: absolute;
		top: -150%;
		left: 50%;
		transform: translate(-50%,-50%);
		z-index:-1;
	}
	.top_btn {
		position: fixed;
		width: 55px;
		height: 55px;
		bottom: 3vh;
		right: 3vh;
		border-radius:10px;
		background: #BBB;
		z-index: 99;
		cursor: pointer;
	}
	.top_btn:hover {
		background: #23262e;
	}
	.section_pattern {
		background-image: url(/images/section_pattern_bg.png);
		background-position-y: 20%;
		background-repeat: no-repeat;
	}
    :focus {
        outline: none !important;
    }




	#ItCenContainer {
		position: relative;
	}

	#section_top {
		height:52vh;
		background-image:url(/wp-content/images/imgGreet_06.jpg);
		background-size:cover;
		background-repeat:no-repeat;
		background-position:bottom;
		z-index:7;
	}
	#section_top p {
		color: #FFF;
		text-align: center;
		font-size: 1.2em;
		margin-bottom: 0.5rem;
	}
	#section_top h2 {
		width: 100%;
		font-size: 3.3em;
		font-weight:800;
		text-align: center;
		color: #FFF;
	}

    .section_navigation {
		position:absolute;
		top:300px;
		left:50px;
		z-index:999;
	}

	.section_navigation ul{
		width: 100%;
		margin: 0;
		text-align:left;
	}

	.section_navigation ul li{
		background-color: unset;
		padding: 0;
		border-radius: unset;
		margin-bottom: 2vh;
		color:#c6c6c6;
	}

	.section_navigation ul li:before{
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 12px;
		height: 12px;
		background:#dee2e6;
		border-radius:50%;
		margin-right: 20px;
	}

	.section_navigation ul li.nav_on:before{
		background:#ff0018;
	}


	.section_navigation ul li.nav_on {
		color:#ff0018;
	}
	.section_navigation ul li a {
		color:#aaa;
	}
	.section_navigation ul li.nav_on a {
		color:#ff0018;
	}


    #section_history {
		text-align: center;
		padding: 0 0 15vh 0;
		z-index:1;
	}
    #section_history h1 {
		font-size: 2.4em;
		font-weight: 400;
		color: #333;
        margin: 15vh auto;
        line-height: 1.7em;
	}
	#section_history h5, #section_intro h5, #section_misson  h5 {
		font-size: 1.5em;
		font-weight: 800;
		color: #333;
	}
	#section_history h5:before, #section_intro h5:before, #section_misson h5:before {
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 100px;
		height: 1px;
		border-top: 1px solid #333;
		margin-right: 20px;
	}
	#section_history h5:after, #section_intro h5:after, #section_misson h5:after {
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 100px;
		height: 1px;
		border-top: 1px solid #333;
		margin-left: 20px;
	}
	#section_history h2 {
		font-size: 2.2em;
		font-weight: 100;
		margin: 5vh 0 3.5vh 0;
		color: #333;
	}
    .timeline_nav {
        width: 100%;
        padding: 5vh 0;
        background: #fff;
        z-index:99;
        position: -webkit-sticky;
        position: sticky;
        top: 88px;
    }
    .time_banner span {
        background-color: #222;
        color: #efefef;
        padding: 7px 20px;
        border-radius:30px;
    }
    .time_banner h1 {
        color: #fff !important;
        font-weight:800 !important;
        margin:0.5em 0 0 0 !important;
    }
    .history_left {
        text-align: right;
        padding-right: 50px;
    }
    .history_right {
        text-align: left;
        padding-left: 50px;
    }
    .history_line {
        width: 1px;
        height: 100%;
        margin:0;
        border-left: 1px solid #aaa;
        position: absolute;
        top:0;
        left:50%;
        transform: translate(-50%,0);
    }
    .history_item {
        position: relative;
        margin: 130px auto 140px auto;
    }
    .history_item_nomal {
        margin: 0 auto 140px auto !important;
    }
    .history_right .right_first {
        margin: 255px auto 100px auto !important
    }
    .history_left .left_first {
        margin: 255px auto 100px auto !important
    }
    .dottt {
        width:10px;
        height:10px;
        background: #333;
        border-radius: 50%;
        z-index: 9;
    }
    .last_dottt {
        width:35px;
        height:35px;
        background: #fff;
        border: 1px solid #666;
        border-radius: 50%;
        z-index: 9;
        position: absolute;
        top:50%;
        left: -67.5px;
        transform: translateY(-50%);
    }
    .history_left .history_item .dottt {
        position: absolute;
        top:50%;
        right: -55px;
        transform: translateY(-50%);
    }
    .history_right .history_item .dottt {
        position: absolute;
        top:50%;
        left: -55px;
        transform: translateY(-50%);
    }
    .history_item h4 {
        color: #df0015;
        font-weight: 600;
    }
    .history_item span {
        color: #666;
        font-weight: 100;
        line-height: 1.8em;
    }
    .history_right .history_item span {
        position: absolute;
        top: 0;
        left: 100px;
    }
    .history_left .history_item span {
        position: absolute;
        top: 0;
        right: 100px;
    }
    .history_item span strong {
        font-weight: 500;
    }


    #section_award {
		text-align: center;
		padding: 0 0 15vh 0;
		z-index:1;
	}
	#section_award h5 {
		font-size: 1.5em;
		font-weight: 800;
		color: #333;
	}
	#section_award h5:before {
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 100px;
		height: 1px;
		border-top: 1px solid #333;
		margin-right: 20px;
	}
	#section_award h5:after {
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 100px;
		height: 1px;
		border-top: 1px solid #333;
		margin-left: 20px;
	}
	#section_award h2 {
		font-size: 2.2em;
		font-weight: 100;
		margin: 5vh 0 3.5vh 0;
        color: #333;
        line-height: 1.7em;
	}

    #section_patent {
		text-align: center;
		padding: 0 0 15vh 0;
		z-index:1;
	}
	#section_patent h5 {
		font-size: 1.5em;
		font-weight: 800;
		color: #333;
	}
	#section_patent h5:before {
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 100px;
		height: 1px;
		border-top: 1px solid #333;
		margin-right: 20px;
	}
	#section_patent h5:after {
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 100px;
		height: 1px;
		border-top: 1px solid #333;
		margin-left: 20px;
	}
	#section_patent h2 {
		font-size: 2.2em;
		font-weight: 100;
		margin: 5vh 0 3.5vh 0;
		color: #333;
	}
    .patent_gallery {
        width:70%;
        margin: 9vh auto 5vh auto;
        text-align: left;
    }
    .patent_gallery a {
        width:24.7%;
        display: inline-block;
        text-align: center;
        margin-bottom: 3em;
        position: relative;
		vertical-align: top;
    }
    .patent_gallery a img {
        width: auto;
        max-width:100%;
    }
    .mfp-counter {
        display: none !important;
    }
    .gall_img_hover {
        position: absolute;
        top:0;
        left: 50%;
        transform: translate(-50%,0);
        display: none;
    }
    .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
        cursor: -moz-initial !important;
        cursor: -webkit-initial !important;
        cursor: initial !important;
    }


    .footer {
        position: relative;
        z-index: 6 !important;
    }


     /* ŸÀÓ¶óÀÎ */

    #timeline_nav .timeline_img {
        background-image: url(/wp-content/images/introduce/history/Line.png);
        background-repeat: no-repeat;
        background-position: center;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 auto;
        max-width: 400px;
        margin-top: 30px;
    }
    #timeline_nav .timeline_img div {
        position: relative;
        display: flex;
    }
    #timeline_nav .timeline_img div div {
        width: 28px;
        height: 28px;
    }
    #timeline_nav .timeline_img div div img {
        max-width: 18px;
        max-height: 18px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%) rotate(180deg);
    }
    #timeline_nav .timeline_img div div img.red_on {
        max-width: 28px;
        max-height: 28px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%) rotate(180deg);
    }
    #timeline_nav .timeline_img p {
        position: absolute;
        top:-50px;
        left: 50%;
        transform: translateX(-50%);
        width: 100px;
    }
    #timeline_nav .timeline_img p.color_on {
        color: #df0015;
        font-weight: 800;
    }


	#fp-nav ul li a span, .fp-slidesNav ul li a span {
		height: 8px;
		width: 8px;
		background: rgba(255,255,255,0.4);
	}
	#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span {
		height: 8px;
		width: 8px;
		margin: -2px 0 0 -2px;
		background: #ff0018;
	}
    #background_video {
      position: absolute;

      top: 50%; left: 50%;
      transform: translate(-50%, -50%);

      object-fit: cover;
      height: 100%; width: 100%;
    }
    #overlay {
      position: absolute;
      top: 0; right: 0; left: 0; bottom: 0;
      background: rgba(0,0,0,0.5);
    }


    .wv_hide {
        display: none;
    }

	.center > .item {
		background-image: url(/images/sec1_Ellipse.png);
		font-size: 3.5em;
		font-weight: 600;
		margin-top: 0;
		letter-spacing: 0.02em;
	}
	.center > .item:before {
		content: '';
		display: block;
		width: 55px;
		height: 2px;
		border-top: 2px solid #FFF;
		margin: 0 auto 40px auto;
	}

	.arrow_btn {
		margin-top: 30px;
		background: #000;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		position: relative;
		cursor: pointer;
	}

	.arrow_btn > img {
		position: absolute;
		top: 55%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.arrow_btn:hover {
		background: #ff0018;
	}
	.arrow_btn:hover img {
		-webkit-animation: go-right 1s linear infinite alternate; /* Safari 4+ */
		-moz-animation:    go-right 1s linear infinite alternate; /* Fx 5+ */
		-o-animation:      go-right 1s linear infinite alternate; /* Opera 12+ */
		animation:         go-right 1s linear infinite alternate; /* IE 10+, Fx 29+ */
	}

	.owl-carousel .owl-stage-outer, .owl-carousel .owl-stage, .owl-item { height: 100%; }

	.position_absolute_center{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}

	.position_absolute_out{
		width:100%;
		position: absolute;
		top: -150%;
		left: 50%;
		transform: translate(-50%,-50%);
		z-index:-1;
	}
	.top_btn {
		position: fixed;
		width: 55px;
		height: 55px;
		bottom: 3vh;
		right: 3vh;
		border-radius:10px;
		background: #BBB;
		z-index: 99;
		cursor: pointer;
	}
	.top_btn:hover {
		background: #23262e;
	}
	.section_pattern {
		background-image: url(/images/section_pattern_bg.png);
		background-position-y: 20%;
		background-repeat: no-repeat;
	}
    :focus {
        outline: none !important;
    }




	#ItCenContainer {
		position: relative;
	}


	#section_intro {
		width: 100%;
		text-align: center;
	}
	#section_intro h1, #section_contact h1 {
		color: #333;
		font-weight: 400;
		margin: 10vh auto 4vh auto;
        line-height: 1.7em;
	}
	#section_intro h1:after, #section_contact h1:after {
		content: '';
		display: block;
		margin: 5.5vh auto;
		width: 1px;
		height: 50px;
		border-right: 1px solid #999;
	}
	#section_intro h2 {
		color: #000;
		font-weight: 600;
        line-height: 1.7em;
	}
	#section_intro p {
		color: #000;
		font-weight: 600;
		margin: 4vh auto 7vh auto;
		max-width: 765px;
	}
	.service_badge img {
		margin: 4vh auto;
	}
	#section_intro table {
		color: #000;
		width: 65%;
		margin: 6vh auto;
	}
	#section_intro table td {
		width: 25%;
		vertical-align: top;
		position: relative;
	}
	.right_border:after {
		content: '';
		display: block;
		width: 1px;
		height: 275px;
		position: absolute;
		top: -0px;
		right: 0;
		border-right: 1px solid #ccc;
	}
	#section_intro table p {
		margin: 3vh 0 2vh 0;
		color: #000;
		font-size: 26px;
		font-weight: 600;
	}
	#section_intro table span {
		font-size: 20px;
		font-weight: 500;
		line-height: 1em;
	}
	#section_intro table span small {
		font-size: 14px;
		font-weight: 100;
	}

	#section_detail {
		width: 100%;
		text-align: center;
		margin: 10vh auto 20vh auto;
	}
	#section_detail h2 {
		font-size: 34px;
		color: #333;
		font-weight: 800;
		margin: 10vh auto;
	}
	.detail_body {
		width: 80%;
		margin: 4vh auto;
		max-width: 1450px;
	}
	.detail_img {
		width: 50%;
		float: left;
	}
	.detail_img img {
		max-width: 100%;
	}
	.detail_txt {
		position: relative;
		width: 50%;
		height: 50vh;
		max-height: 484px;
		float: left;
		word-break: keep-all;
	}
	.detail_txt h2 {
		margin: 0 0 4vh 0 !important;
		font-weight:500 !important;
	}
	.detail_txt span {
		display: inline-block;
		color: #666;
		font-size: 20px;
		line-height: 1.7em;
	}

    .itcen_map {
        width: 70%;
        margin: 0 auto;
        text-align: center;
    }
    .root_daum_roughmap {
        width: 100% !important;
        height: 70vh !important;
        display: block;
        margin: 0 auto !important;
    }
    .wrap_map {
        width: 100% !important;
        height: 100% !important;
    }
    .adress {
        width: 70%;
        margin: 30px auto;
        text-align: left;
    }
	.adress span {
		text-align:left;
        padding-left:40px;
        margin-right: 40px;
		font-size:1.3rem;
	}
	.adress span:before {
		content:'';
		width: 2px;
		height: 100%;
		border-left: 2px solid #333;
		margin-right:10px;
	}
    .root_detail {
        width: 70%;
        margin: 0 auto 15vh auto;
        padding: 50px;
        text-align: left;
        background-color: #f5f5f5;
        border: 1px solid #ddd;
    }

	a {
        color: #fff;
    }

    a:hover {
        color: #fff;
    }

    footer {
        display: flex;
    }

    .itcen_footer {
        max-width: 1920px;
        width: 100%;
        margin: 0 auto;
    }


    .brandlogo {
        max-width: 1920px;
        background-color: #23262e;
        border-bottom: solid 1px rgba(255,255,255,0.5);
        height:100px;
    }
    .brandlogo ul {
        width: 100%;
        height: 100px;
        margin: 0;
        display: flex;
        flex-direction: row;
        justify-content: center;
    }
    .brandlogo li {
        height: 100px;
        display: flex;
        padding: 0 20px;
        justify-content: center;
        align-items: center;
    }
    .brandlogo li a {
        text-align: center;
        display: table-cell;
        vertical-align: middle;
    }
    .brandlogo li img {
        vertical-align:middle;
        max-width: 100%;
        max-height: 36px;
        min-height: 36px;
    }

    .footer_under {
        display: flex;
        margin: 65px 160px 120px 160px;
    }

    .bottom_left {
        width: 30%;
        float: left;
    }

    .bottom_left p {
        font-size: 0.8em;
        font-weight: 100;
        color: #a7abb9;
        margin-bottom: 0.5rem;
    }

    .sitemap {
        color: #FFF;
        width: 60%;
        height: 100%;
        margin-bottom: 0;
        float: left;
    }

    .sitemap_list {
        float: left;
        width: 20%;
    }

    .list_under_bar:after {
        content: "";
        display: block;
        margin-top: 15px;
        vertical-align: middle;
        width: 110px;
        height: 1px;
        border-top: 1px solid rgba(255, 255, 255, 0.3);
    }

    .sitemap_btn {
        font-size: 0.8em;
        font-weight: 100;
        width: 80%;
        color: #7c8290;
    }

    .sitemap_btn li {
        line-height: 1.6em;
        margin-bottom: 1.3em;
    }

    .sitemap_btn li a:hover {
        color: #dddddd;
        text-decoration: underline;
        text-decoration-color: #dddddd;
    }

    .sitemap_btn a {
        color: #7c8290;
        text-decoration: none;
    }

    .bottom_right {
        width: 10%;
        float: right;
    }

    .bottom_right ul {
        float: right;
        margin-bottom: 0;
        line-height: 1.5em;
    }

    .bottom_right li {
        float: right;
        font-size: 0.9em;
        font-weight: 300;
        color: #a7abb9;
        margin-top: 0.2em;
    }

    .cloit_logo > img {
        width: 100px;
    }


	// ¾Ö´Ï¸ÞÀÌ¼Ç Ã³¸®


	@media screen and (max-width:1680px) {
	    .history_banner img {
	        max-width: 80%;
	    }

	}

	@media screen and (max-width: 1440px) {
	}

	// ¾Ö´Ï¸ÞÀÌ¼Ç Ã³¸®
	@-webkit-keyframes go-right {
		0% { margin-left:0; }
		50% { margin-left:5px; }
		100% { margin-left:0; }
	}
	@-moz-keyframes go-right {
		0% { margin-left:0; }
		50% { margin-left:5px; }
		100% { margin-left:0; }
	}
	@-o-keyframes go-right {
		0% { margin-left:0; }
		50% { margin-left:5px; }
		100% { margin-left:0; }
	}
	@keyframes go-right {
		0% { margin-left:0; }
		50% { margin-left:5px; }
		100% { margin-left:0; }
	}


	@media screen and (max-width:1680px) {
		.detail_txt h2 {
			font-size: 32px !important;
		}
		.detail_txt span {
			font-size: 18px;
			line-height: 1.7em;
		}
	}

	@media screen and (max-width: 1440px) {
		.detail_txt h2 {
			font-size: 30px !important;
		}
		.detail_txt span {
			font-size: 16px;
			line-height: 1.7em;
		}
	}

    @media screen and (max-width: 1860px) {
        .brandlogo li img {
            vertical-align: middle;
            max-width: fit-content;
            width: 100%;
        }

        .brandlogo li {
            padding: 0 0 0 30px;
        }
        .brandlogo li:last-child {
            padding-right:30px;
        }
    }
    @media screen and (max-width: 1800px) {
      .brandlogo {
            padding: 0;
      }
    }
    @media screen and (max-width: 1680px) {

        .brandlogo li{
          padding: 0 0 0 30px;
        }

        .bottom_left p {
            font-size: 0.7em;
        }

        .footer_under {
            margin: 65px 100px 120px 100px;
        }
    }

    @media screen and (max-width: 1440px) {
        .brandlogo {
            padding: 0;
        }

        .footer_under {
            margin: 65px 70px 120px 70px;
        }

        .bottom_right li {
            font-size: 0.75em;
        }

        .one_btn_area {
            text-align: center;
        }

        .nav-foot .col-6 a {
            font-size: 2.4vw;
        }
    }