/* COMMON */
.contents { padding:120px 0px; }
.sub-visual-container{
    overflow: hidden; padding: 30px 0 60px; height: 340px; background-repeat: no-repeat; background-position: center;
    -webkit-animation: visualFadeIn .4s ease-in-out .1s forwards; animation: visualFadeIn .4s ease-in-out .1s forwards; opacity: 0;
}
.sub-visual-wrapper{
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
    height: 100%; flex-direction: column;
}
.sub-visual-container .title { z-index: 2; position: relative; line-height: 1; text-align: center; font-size: 45px; font-weight: 700; color: #ffffff; letter-spacing: -0.04em; }
.sub-visual-container .sub-title {font-weight:300; color:rgba(255,255,255,.7); font-size: 24px; margin-bottom:10px;}
.sub-visual-container .title small { display: block; margin-bottom: 15px; font-size: 14px; color: #bcc5df; font-weight: 300; letter-spacing: 0.2em; }
.sv, .sv0, .sv1 { background: url('/child/img/sub/sv1.png') no-repeat center / cover; }
.sv2 { background: url('/child/img/sub/sv2.png') no-repeat center / cover; }
.sv3 { background: url('/child/img/sub/sv3.png') no-repeat center / cover; }
.sv4 { background: url('/child/img/sub/sv4.png') no-repeat center / cover; }
.sv5 { background: url('/child/img/sub/sv5.png') no-repeat center / cover; }
@-webkit-keyframes visualFadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes visualFadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@media (max-width: 1024px){
    .sub-visual-container { padding: 0 0 45px; height: 350px; }
    .sub-visual-container .title { font-size: 34px; }
    .sub-visual-container .title small { font-size: 13px; }
}
@media (max-width: 768px){
    .contents { padding: 60px 0px; }
    .sub-visual-container { padding: 0; height: 180px; }
    .sub-visual-container .title { font-size: 24px; }
    .sub-visual-container .title small { margin-bottom: 10px; font-size: 11px; }
}



/* Sub Tab List */
.sub-tab-container { z-index: 2; position: relative; margin-top: -60px; }
.sub-tab-lists { display: flex; flex-wrap: wrap; margin: auto; max-width: 1200px; width: 100%;}
.sub-tab-lists li { flex: 1 1; border-right:1px solid rgba(204,204,204,.2);}
.sub-tab-lists li:last-child {border-right:0px;}
.sub-tab-lists .link{
    display: flex; align-items: center; justify-content: center; position: relative; padding: 4px; height: 60px;
    line-height: 1.4; text-align: center; font-size: 18px; color: #fff; font-weight: 400;
    background-color: transparent; background-color:rgba(0,0,0,.5);
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
}
/* .sub-tab-lists .link::before{
    content: ''; position: absolute; bottom: 0; left: 0;
    width: 100%; height: 100%; background: #ffffff;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
    -webkit-transform-origin: bottom; transform-origin: bottom;
    -webkit-transform: scaleY(0); transform: scaleY(0);
} */
.sub-tab-lists .link span { display: block; z-index: 2; position: relative; }
.sub-tab-lists .link--on { color: #1154ec; font-weight: 400; background-color:#fff;}
.sub-tab-lists .link--on::before{
    -webkit-transform: scaleY(1); transform: scaleY(1);
}
@media(min-width:1201px){
	/* .sub-tab-lists .link:not(.link--on):hover::before{
        -webkit-transform: scaleY(0.1); transform: scaleY(0.1);
    } */
}
@media (max-width:1200px){
    .sub-tab-container { margin-top: -49px; }
    .sub-tab-lists .link { height: 50px; font-size: 16px; }
}
@media (max-width:768px){
    .sub-tab-container { margin-top: 0; }
    .sub-tab-lists { background: rgba(0,0,0,.9); }
    .sub-tab-lists .link { padding: 12px 10px; height: 100%; line-height: 1.3; font-size: 14px; }
}


@media (max-width:1024px){

}
@media (max-width:768px){

}


/*sub common*/
.container .title-dot { position: relative; display: block; margin: 50px auto; width: 5px; height: 5px; background: #1154ec; border-radius: 30px; }
.container .title-dot:before { content: ''; position: absolute; display: block; left: -12px;  width: 5px; height: 5px; background: #1154ec; border-radius: 30px; }
.container .title-dot:after { content: ''; position: absolute; display: block; left: 12px; width: 5px; height: 5px; background: #1154ec; border-radius: 30px; }


@media (max-width:1024px){

}
@media (max-width:768px){

    .container .title-dot {margin:40px auto;}

}

@media (max-width:480px){

    .container .title-dot {margin:20px auto;}

}



/*회사소개*/
.location { margin-bottom: 40px; }
.location i { padding: 0 10px 0 0; }
.location i img {display: block;}
.location i,.location span { display: inline-block; vertical-align: middle;}
.location span { padding: 0; }

.add-list { margin-bottom: 30px; }
.add-list li { border-right: 1px dotted #999999; line-height: 30px; }
.add-list li strong { display: block; }
.add-list li:last-child { border-right: none; }

.map { box-shadow: 0px 0px 20px 0px rgba(0,0,0,.15); }

.add-p{margin-top: 40px;}

@media (max-width:480px) {

    .location i {padding:0px 0px 10px 0px}
    .add-list li {border-right:0px;}

}

/*연혁*/


/* 연혁 */

.history {  }
.history .list-year { border-top: 3px solid #1154ec; display: flex;}
.history .list-year .year {padding: 30px; width: 20%; text-align: center; }
.history .list-year .text {vertical-align: top; width: 80%; }
.history .list-year .text dl { padding: 30px 0; border-bottom: 1px solid #dddddd; }
.history .list-year .text dl dt { float: left; width: 25%; text-align: center; font-size: 18px; font-weight: 600; }
.history .list-year .text dl dd { float: left; width: 75%; font-size: 16px; font-weight: 300; }
.history .list-year .text dl dd ul { width: 100%; }
.history .list-year .text dl dd li { line-height: 32px; color: #777777;}
.history .list-year .text dl:after { content: ''; display: block; clear: both; }

@media (max-width:768px) {
    .history .list-year {flex-wrap: wrap;}
    .history .list-year .year {width:100%; border-bottom:1px solid #dddd; padding: 20px;}
    .history .list-year .text {width:100%;}
    .history .list-year .text dl {padding: 20px 0;}
    .history .list-year .text dl dt {font-size: 16px;}
    .history .list-year .text dl dd {font-size: 14px;}
    .history .list-year .text dl dd li {line-height: 26px;}

}

/*특허 및 수상 common*/
.tab-list.tab-list--style2 { border-bottom:1px solid #ccc; display: flex;}
.tab-list.tab-list--style2 > li {margin-bottom:-2px;}
.tab-list.tab-list--style2 > li .button {position: relative; padding:0px 20px !important;}
.tab-list.tab-list--style2 > li .button::after {content:''; display: block; width:1px; height:20px; background-color: #cccccc; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tab-list.tab-list--style2 > li:last-child .button::after {display:none;}
.tab-list.tab-list--style2 > li span {position: relative; height:100%; display:block; padding:15px 0px;}
.tab-list.tab-list--style2 > li span::after {content:''; position: absolute; bottom:0px; width:0%; height:3px; background-color:#1154ec; left:50%; right:0; transition:all 0.3s ease;}
.tab-list.tab-list--style2.tab-list--block > li.on span::after {content:''; position: absolute; bottom:0px; width:100%; height:3px; background-color:#1154ec; left:0; right:0; width:100%;}

/*특허*/
.certificate { border-top: 3px solid #1154ec; }
.certificate .cert-row { display: flex; width: 100%; }
.cert-title { vertical-align: top; padding: 30px; width: 25%; background: #f9f9f9; border-bottom: 1px solid #ddd; }
.cert-bg2 { background: #f3f6fe; }
.cert-list { vertical-align: top; width: 75%; border-bottom: 1px solid #ddd; }
.cert-list ul { display: inline-block; width: 100%;}
.cert-list ul:not(.cert-list ul:nth-child(1)) { border-top: 1px solid #ddd; }
.cert-list ul li { font-size: 16px; color: #777777; display: flex; align-items: center;}
.cert-list li .text { display: inline-block; width: 80%; border-right: 1px solid #ddd; }
.cert-list li .text:not(.text-padding) {padding: 15px 30px;}
.text-padding{padding: 25px 30px;}
.cert-list li .state { display: inline-block; float: right; width: 20%; text-align: center;  padding-left: 5px; padding-right: 5px;}
.cert-list li .state:not(.state-padding) {padding: 15px 5px;}

/* .cert-list li:first-child .text,
.cert-list li:first-child .state { padding-top: 30px; }
.cert-list li:last-child .text,
.cert-list li:last-child .state { padding-bottom: 30px; } */

@media (max-width:768px) {

    .certificate .cert-row {flex-wrap: wrap;}
    .cert-title {flex:1 100%; padding:15px 20px;}
    .cert-title br {display: none;}
    .cert-list {flex:1 100%;}
    .cert-list ul li {font-size:14px;}
    .cert-list li .text {padding:10px 20px !important;}
    .text-padding{min-height: 70px;}
    .cert-list li .state:not(.state-padding) {padding:10px 3px;}
    /* .cert-list li:first-child .text,
    .cert-list li:first-child .state { padding-top: 15px; }
    .cert-list li:last-child .text,
    .cert-list li:last-child .state { padding-bottom: 15px; } */

}

/*수상*/
.certificate-list {position: relative;}
.certificate-list::before {
    content: '';position: absolute;width: 1px;
    height: calc(100% - 270px);left: 50%;transform: translateX(-50%);
    background-color: #d7d7d7;margin: 10px 0px;
}
.certificate-list li {position: relative;}
.certificate-list li::before {
    content: '';width: 15px;height: 15px;border-radius: 50%;
    background-color:#fff; border:3px solid #3e6bee; display: block;position: absolute; z-index: 2;
}
.certificate-list li .box { display: inline-block; }
.certificate-list li .box::before { content:''; position: absolute; top: 7px; width: 204px; height: 1px; background: #3e6bee; }
.certificate-list li .box::after { content: ''; position: absolute; top: 4px; width: 7px; height: 7px; border-radius: 50%; background: #3e6bee; }
.certificate-list li p {margin-top:10px; max-width:160px;}
.certificate-list li.right {width: 50%;margin-left: 50%;padding-left: 20px;}
.certificate-list li.right::before { left: -7px; }
.certificate-list li.right .box { padding-left: 235px; }
.certificate-list li.right .box::before { left: 0; }
.certificate-list li.right .box::after { left: 204px; }
.certificate-list li.left {width: 50%;margin-right: 50%;padding-right: 20px;text-align: right;}
.certificate-list li.left::before { right: -7px; }
.certificate-list li.left .box { padding-right: 235px; }
.certificate-list li.left .box::before { right: 0; }
.certificate-list li.left .box::after { right: 204px; }
.certificate-list li:nth-child(4n - 1).right .box{
    padding-left:105px;
}


.certificate-list li:nth-child(4n - 1).right .box::before{
    width:100px;
}

.certificate-list li:nth-child(4n - 1).right .box::after{

    left:94px;

}

.certificate-list li:nth-child(4n - 2).left .box{

    padding-right:105px;

}

.certificate-list li:nth-child(4n - 2).left .box::before{

    width:100px;

}

.certificate-list li:nth-child(4n - 2).left .box::after{

    right:94px;

}


@media (max-width:960px) {

    .certificate-list li .box::before {width:100px;}
    .certificate-list li.right .box::after {left:94px;}
    .certificate-list li.right .box {padding-left:105px;}
    .certificate-list li.left .box::after {right:94px;}
    .certificate-list li.left .box {padding-right:105px;}

}

@media (max-width:520px){

    .certificate-list::before {left:20px; transform: translateX(0);}
    .certificate-list li {margin-bottom:40px;}
    .certificate-list li .box::before {width:100px; width:50px;}
    .certificate-list li.right .box::after {left:45px;}
    .certificate-list li.right {width: inherit; margin-left:20px;}
    .certificate-list li.left {width:inherit; margin-right:0px; margin-left:20px; padding-right:0px; padding-left:20px; text-align: left;}
    .certificate-list li.left::before {right:0px; left:-7px;}
    .certificate-list li.left .box {padding-right:0px; padding-left:60px;}
    .certificate-list li.left .box::before {right:auto; left:0px;}
    .certificate-list li.left .box::after {left:45px;}

    .certificate-list li.right .box {padding-left:60px;}
    .certificate-list li:nth-child(4n - 2).left .box{ padding-right:0px; padding-left:60px;}
    .certificate-list li:nth-child(4n - 2).left .box::before{width:50px;}
    .certificate-list li:nth-child(4n - 1).right .box{padding-left:60px;}
    .certificate-list li:nth-child(4n - 1).right .box::before{width:50px;}
    .certificate-list li:nth-child(4n - 1).right .box::after{left:45px;}
}

/* 해외지사 */
.global-map img { margin: 0 auto; }
.global-table { margin-top: 100px; width: 100%; border-top: 3px solid #1154ec; }
.global-table td { padding: 20px 30px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; }
.global-table td:last-child { border-right: none; }
.global-table td div { display: inline-block; vertical-align: top; }
.global-table td div:first-child { margin-right: 20px; }
.global-table td strong { display: block; line-height: 24px; }
.global-table td span { font-size: 16px; color: #777; }
.global-table td strong em { font-style: normal; font-size: 15px; color: #999; font-weight: 300; }
.global-table td strong em:before { content: ''; display: inline-block; margin: 0 10px;  width: 1px; height: 12px; background: #bbb; }

/* 고객사 */
.partner-list { margin-top: 30px; }
.partner-list li { display: inline-block; margin-bottom: 50px; text-align: center; color: #777777; }
.partner-list li .img { margin-bottom: 15px; }
.partner-2 { margin-top: 50px; }

/* 구입하기 */

/* 제품소개서 */
.introduction img {display: block;}
.introduction .button,.voucher-form .button {margin:50px auto 0px; display: block; background-color:#1154ec; color:#fff; padding:15px 40px; max-width:300px; width:100%;}
.button-blue {background-color: #1154ec;}

/* 수출바우처 참여기업 */
.form-img {position:relative; width:100%; overflow: hidden; height:350px; display:flex; align-items: center; justify-content: center; flex-direction: column; padding:80px 20px;}
.form-img.voucher  {background:url('/child/img/sub/inquiry/voucher.png') no-repeat center;}
.form-img .voucher-img {width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);}

/*dot기술소개*/
.form-img.technology {background:url('/child/img/sub/technology/technology-bg.png') no-repeat center; margin-top:50px;}
.technology-section {padding:80px 0px; border-bottom:1px solid #ddd;}
.technology-section.technology5 {border-bottom:0px;}

/* .technology-contents::before {content:''; display: block;} */
.technology-section ul {display: flex; flex-wrap: wrap; margin-left:-15px; margin-right:-15px; margin-bottom:-30px; }
.technology-section li { flex:0 50%; padding:0px 15px 30px;}

.tab-menu__list.fixed {position: fixed; left:0; width:100%; z-index:10; background-color:#fff;}
.tab-menu__list {display: flex;}
.tab-menu__list li {flex:1 1; padding:15px 5px; border:1px solid #ddd; margin-left:-1px;}
.tab-menu__list li.on {background-color:#1154ec; color:#fff; border-color:#1154ec;}
.tab-menu__list a {display: block; width: 100%; height: 100%;}


@media (max-width:1200px) {


}

@media (max-width:1024px) {


}

@media (max-width:768px) {

    .form-img.technology {margin-top:30px;}
    .technology-section {padding:40px 0px;}

    .introduction .button,.voucher-form .button {margin:30px auto 0px;}

}

@media (max-width:480px) {

    .technology-section li {flex:1 100%;}


}

/*사운드커머스*/
.contents.no-padding-contents {padding:120px 0px 0px;}
.contents.padding-contents {padding:120px 0px 40px;}
.items-center {align-items: center;}
.sub-items.list-box > li {text-indent:-10px; margin-left:10px;}
.product-form__top {display: flex; justify-content: space-between;}
.product-form__top img {display: block;}
.product-form__bottom {margin-top:60px;}

.product-main {margin-top:-80px;}
.product-main > div:last-child {border-bottom:0px;}
.product-sub {position:relative; padding:80px 0px 120px;}
.product-sub::after{content:''; width:100vw; position: absolute; top:0; left:50%; right:0; transform:translateX(-50%); background-color:#f9f9f9; height:100%; z-index:-1;}
.product-link {display: flex; margin-left: -3px; margin-right:-3px; margin-top:20%;}
.product-link li {padding:0px 3px;}
.product-link img {display: block;}

.product-form {border-bottom:1px solid #ddd; padding:80px 0px;}
.product-form .button {max-width:160px; width:100%; background-color:#116ff0; padding:10px 15px; margin-top:20%;}
.product-form__top .product-left {width:39%; padding-right:30px;}
.product-form__top .product-right {width:61%;}
.product-form__top .product-full {width:100%;}

.product-form__bottom .text-list {display: flex; margin-left:-10px; margin-right:-10px; flex-wrap: wrap;}
.product-form__bottom .text-list li {flex:1 1; padding:0px 10px;}
.product-form__bottom .text-grid {background-color:#f9f9f9; border:1px solid #dddddd; padding:55px 15px; height:100%;}
.product-form__bottom .grid-tit::after {content:''; display: block; width:20px; height:1px; background-color:#555; margin:20px 0px;}
.product-form__bottom .product-list {display: flex; flex-wrap: wrap; margin-left:-10px; margin-right:-10px; margin-bottom:-40px;}
.product-form__bottom .list-li {flex:0 33.3333%; padding:0px 10px 40px;}
.product-form__bottom .list-li-style2 {flex:1 50%; padding:00px 10px 40px;}
.product-form__bottom img {display:block;}


.product-right .icon-form {margin-top:-30px; margin-bottom:-30px;}
.product-right .icon-top-img {margin-bottom:30px;}
.product-right .icon-items {display: flex; align-items: center; border-bottom:1px solid #ddd; padding:30px 0px;}
.product-right .icon-items.border-none {border-bottom:0px;}
.product-right .icon-items img {display: block; min-width:100px;}
.product-right .icon-text {padding:0px 18px 0px 30px;}


/*정품인증*/
.ai-icon {background-position:center; background-repeat: no-repeat; width:40px; height:40px; margin:0 auto 20px;}
.activate-ai1 {background-image: url('/child/img/sub/product/activate/activate-ai1.svg');}
.activate-ai2 {background-image: url('/child/img/sub/product/activate/activate-ai2.svg');}
.activate-ai3 {background-image: url('/child/img/sub/product/activate/activate-ai3.svg');}
.activate-ai4 {background-image: url('/child/img/sub/product/activate/activate-ai4.svg');}
.activate-ai5 {background-image: url('/child/img/sub/product/activate/activate-ai5.svg');}
.activate-ai6 {background-image: url('/child/img/sub/product/activate/activate-ai6.svg');}
.activate-ai7 {background-image: url('/child/img/sub/product/activate/activate-ai7.svg');}
.activate-ai8 {background-image: url('/child/img/sub/product/activate/activate-ai8.svg');}
.activate-ai9 {background-image: url('/child/img/sub/product/activate/activate-ai9.svg');}
.activate-ai10 {background-image: url('/child/img/sub/product/activate/activate-ai10.svg');}


/*video*/
.product-video-link {width:100%; height:0; position: relative; padding-bottom:calc(400 / 1100*100%);}
.product-video-link iframe {width:100%; height:100%; position: absolute; left:0; top:0;}
.product-video .video-flex {display: flex; justify-content: center; flex-wrap: wrap; margin-left:-10px; margin-right:-10px; margin-top:-30px;}
.product-video .video-flex li {flex:1 50%; padding:30px 10px 0px;}
.product-video .video-flex li img,
.product-video .video-flex li iframe  {display: block; margin:0 auto;}
.product-video .video-flex li iframe{width: 100%; height: 300px;}


/*제품소개 중단점*/
@media (max-width:1200px) {

    .tab-menu__list li {font-size:16px;}

}

@media (max-width:1024px) {


}

@media (max-width:768px) {

    .contents.no-padding-contents {padding:60px 0px 0px;}
    .contents.padding-contents {padding:60px 0px 20px;}
    .product-sub {padding:40px 0px 60px;}


    .product-form__top .product-left {width:40%;}
    .product-form__top .product-right {width:60%;}
    .product-form__bottom .text-grid {padding:30px 15px;}
    .product-main {margin-top:-40px;}
    .product-form {padding:40px 0px;}
    .product-right .icon-text {padding:0px 15px 0px 20px;}

    .tab-menu__list li {font-size:14px; padding:10px 3px;}

    .product-video .video-flex li iframe{height: 242px;}

}

@media (max-width:480px){

    .product-link {margin-top:20px;}
    .product-form .button {margin-top:20px;}

    .product-form__top {flex-wrap: wrap;}
    .product-form__top > div {flex:1 100%;}
    .product-form__top .product-left {padding-right:0px; margin-bottom:50px;}
    .product-form__top .product-full {}

    .product-form__bottom {margin-top:30px;}
    .product-form__bottom .text-list li {flex:1 100%; margin-bottom:5px;}
    .product-form__bottom .text-list li:last-child {margin-bottom:0px;}

    .product-form__bottom .product-list {margin-left:-5px; margin-right:-5px; margin-bottom:-20px;}
    .product-form__bottom .list-li {flex:0 50%; padding:0px 5px 20px;}
    .product-form__bottom .list-li-style2 {flex:1 100%; padding:0px 5px 20px;}


    .product-right .icon-form {margin-top:-20px; margin-bottom:-20px;}
    .product-right .icon-items {padding:20px 0px;}

    .product-video .video-flex {margin-top:-20px;}
    .product-video .video-flex li {flex:1 100%; padding:20px 10px 0px;}

    .form-img {height:280px;}

}

.font-family-sets{font-family: 'Noto Sans KR', sans-serif !important;}
