@charset "utf-8";

/* #0057ab */

@font-face {
    font-family: 'GmarketSans';
    font-weight: 300;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.eot?#iefix') format('embedded-opentype'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'GmarketSans';
    font-weight: 500;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.eot?#iefix') format('embedded-opentype'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'GmarketSans';
    font-weight: 700;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.eot?#iefix') format('embedded-opentype'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.ttf') format("truetype");
    font-display: swap;
} 


* {
    font-family: 'Noto Sans KR', sans-serif;
}
/*

html{
    scroll-behavior: smooth;
}
*/

.all_wrap{
    width: 1300px;
    height: auto;
    margin: 0 auto;
    padding-top: 80px;
    padding-bottom :90px;
}

.header {
    position: fixed;
    top: 0%;
    left: 50%;
    transform: translate(-50%);
    z-index: 99999;
    width: 100%;
    transition: all .3s ease;
}

.header.on{
    background-color: #ffffff;
    border-bottom: 1px solid #d1d1d1;
}

.navi_wrap {
    width: 1300px;
    height: 80px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    line-height: 80px;
    background-color: transparent;
}

.navi_wrap > .logo > a > img {
    display: block;
    width: 205px;
    line-height: 80px;
    margin-top: 16px;
}

.navi_wrap > .logo > a > img:last-child{
    display: none;
}

.header.on .navi_wrap > .logo > a > img:first-child{
    display: none;
}

.header.on .navi_wrap > .logo > a > img:last-child{
    display: block;
}

.navi {
    display: flex;
}

.navi > li {
    width: 130px;
    height: 80px;
    text-align: center;
}

.navi > li > a {
    color: #fff;
    font-family: 'GmarketSans';
    font-size: 17px;
}

.navi > li > a:hover{
    color: #62b246;
}

.header.on .navi > li > a{
    color: #000;
}

.header.on .navi > li > a:hover{
    color: #62b246;
}

.mob_nav_btn{
    display: none;
    position: absolute;
    right: 25px;
    top: 22.5px;
}

.mob_nav_btn a{
    position: relative;
    display: block;
    width: 45px;
    height: 35px;
}

.mob_nav_btn a span:first-child{
    position: absolute;
    left: 50%;
    top: 6px;
    transform: translateX(-50%);
    width: 35px;
    height: 3px;
    background-color: #ffffff;
    transition: all .2s ease;
}

.mob_nav_btn a span:nth-child(2){
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 35px;
    height: 3px;
    background-color: #ffffff;
    transition: all .2s ease;
}

.mob_nav_btn a span:last-child{
    position: absolute;
    left: 50%;
    bottom: 6px;
    transform: translateX(-50%);
    width: 35px;
    height: 3px;
    background-color: #ffffff;
    transition: all .2s ease;
}

.header.on .mob_nav_btn a span{
    background-color: #000;
}

.mob_nav_btn.on a span:first-child{
    transform: translate(-50%, -50%) rotate(45deg);
    top: 18px;
}

.mob_nav_btn.on a span:nth-child(2){
    opacity: 0;
    left: 20%;
}

.mob_nav_btn.on a span:last-child{
    transform: translate(-50%, -50%) rotate(-45deg);
    bottom: 14px;
}

.mob_nav{
    display: none;
    position: fixed;
    width: 100%;
    border-top: 1px solid #ddd;
}

.mob_nav.on{
    display: block;
}

.mob_nav ul li{
    width: 100%;
    background-color: #fff;
    border-bottom: 1px solid #ddd;
}

.mob_nav ul li a{
    display: block;
    text-align: center;
    font-family: 'GmarketSans';
    font-size: 18px;
    font-weight: 500;
    color: #555;
    padding: 15px 0;
}

.main_vs {
    position: relative;
    background-image: url('https://portfolio-bk.shop/semicraft/main/img/mainbg.png');
    background-size: cover;
    width: 100%;
    height: 94vh;
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
}


.main_vs > .main_text_wrap {
    width: 1300px;
    position: relative;
    margin: 0 auto;
    padding-top: 16%;
    color: #fff;
}

.main_vs > .main_text_wrap > h2 {
    position: relative;
    font-size: 80px;
    color: #fff;
}

.main_vs > .main_text_wrap > h2 span{
    display: inline-block;
    font-family: 'GmarketSans';
    font-weight: 700;
    line-height: 1.1;
    margin-right: -1%;
}

.main_vs > .main_text_wrap > h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: -0px;
    width: 130px;
    height: 10px;
    background-color: #fff;
    display: block;
}

.main_vs > .main_text_wrap .textControl h3 {
    font-size: 40px;
    color: #fff;
    font-family: 'GmarketSans';
    font-weight: 500;
    letter-spacing: -1px;
    margin-top: 10px;
}

.main_vs > .main_text_wrap .textControl p {
    font-size: 20px;
    color: #fff;
    font-family: 'GmarketSans';
    font-weight: 500;
}

.main_vs > .main_text_wrap > .main_contact {
    display: inline-block;
    font-size: 30px;
    color: #fff;
    font-family: 'GmarketSans';
    font-weight: 500;
    margin-top: 120px;
    line-height: 0.8;
}


.intro {
    width: 100%;
    height: 220px;
    position: relative;
}

.intro > ul {
    width: 100%;
    position: relative;
    margin: 0 auto;
    height: 220px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.intro > ul > li {
    height: 220px;
    width: 50%;
}

.intro > ul > li:first-child {
    padding-top: 50px;
    padding-right: 200px;
    text-align: right;
}

.intro > ul > li:first-child img{
    display: inline-block;
}

.intro > ul > li:last-child {
    background-color: #0057ab;
    color: #fff;
    padding-top: 50px;
    padding-left: 30px;
    font-size: 17px;
    line-height: 1.4em;
    font-weight: 100;
}

.portfolio {
    width: 100%;
    height: auto;
    background-image: url('https://portfolio-bk.shop/semicraft/main/img/section_01bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/*

.portfolio > .portfolio_wrap {
    width: 1300px;
    height: auto;
    margin: 0 auto;
    padding-top: 80px;
    padding-bottom :90px;
    
}
*/

.portfolio .portfolio_box > p{
    font-size:25px; 
}
.portfolio .portfolio_box > h2{
    font-size:55px;
}


.portfolio .portfolio_box > p {
    text-align: center;
    font-family: 'GmarketSans';
    
}
.portfolio .portfolio_box > h2 {
    text-align: center;    margin-bottom: 60px;
    font-family: 'GmarketSans';
}

.portfolio .portfolio_box > .port_tabmn {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    
}

.portfolio .portfolio_box > .port_tabmn > li {
    width: 19.5%;
    height: 50px;
    text-align: center;
    line-height: 50px;
    background-color: #fff;
    font-family: 'GmarketSans';
    font-weight: 500;
    font-size:20px;
    color: #555;
    cursor: pointer;
}

.portfolio .portfolio_box > .port_tabmn > li.check {
    background-color: #0057ab;
    color: #fff;
    box-shadow: 0 16px 26px -10px rgba(0, 0, 0, 0.3)
}


.port_con_box{
    width: 100%;
    height: auto;
}


.portfolio .portfolio_box .port_con_box .port_con {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;
}

.portfolio .portfolio_box .port_con_box .port_con > li {
    width: 24.65%;
    background-color: #ffffff;
    box-shadow: 0 16px 26px -10px rgba(0, 0, 0, 0.2);
        margin-bottom:45px;
}

.portfolio .portfolio_box .port_con_box .port_con > li img{
    width: 100%;
}

.portfolio .portfolio_box .port_con_box .port_con > li .port_con_text{
    background-color: #ffffff;
    box-sizing: border-box;
    padding: 20px;
}

.portfolio .portfolio_box .port_con_box .port_con > li .port_con_text>p>span{
    font-size:17px;  
    color:#666;
    font-weight: 500;
    display: block;
    margin-bottom: 10px;
    
}
.portfolio .portfolio_box .port_con_box .port_con > li .port_con_text>p{
    font-size:22px; 
    line-height: 1.2;
    font-family: 'GmarketSans';
    font-weight: 700;
}

.artwork {
    width: 100%;
    background-image: url('https://portfolio-bk.shop/semicraft/main/img/section_02bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.artwork > .artwork_wrap {
    width: 1300px;
    height: auto;
    margin: 0 auto;
    padding-top: 80px;
    padding-bottom :90px;
    
}

.artwork .all_wrap > p {
    text-align: center;
    font-family: 'GmarketSans';
    color:#fff;
    font-size:25px;
}
.artwork .all_wrap > h2 {
    text-align: center;    margin-bottom: 60px;
    font-family: 'GmarketSans';
    color:#fff;
        font-size:55px;
}

.artwork .all_wrap > .art_con{display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}
.artwork .all_wrap > .art_con>li{
    position: relative;
    width:33%;
    margin-bottom: 5px; 
    border:1px solid #fff;
    box-sizing: border-box;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}


.artwork .all_wrap > .art_con>li.box::before, .artwork .all_wrap > .art_con>li.box::after{
   content: "";
  position: absolute;
  z-index: 3;
  display: block;
  margin: auto;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid #a4f6ff;
  transition: all 0.3s linear;
    
    
    
    
}


.artwork .all_wrap > .art_con>li.box::before{
    
    width: 0;
  height: 100%;
  border-left: 0;
  border-right: 0;
    
    
    
}


.artwork .all_wrap > .art_con>li.box::after{
    
    width: 100%;
  height: 0;
  border-top: 0;
  border-bottom: 0;
    box-shadow: #a4f6ff 1px 0 10px;
    
    
    
    
}


.artwork .all_wrap > .art_con>li.box:hover::before {
  width: calc(100% + 2px);
}
.artwork .all_wrap > .art_con>li.box:hover::after {
  height: 100%;
}











/*.artwork .all_wrap > .art_con>li:hover{
    background-color: rgba(255, 255, 255, 0.9);
}*/

.artwork .all_wrap > .art_con>li strong{
    position: absolute;
    left: 15px;
    top: 20px;
    font-family: 'GmarketSans';
    font-weight: 700;
    font-size: 20px;
    color: #ffffff;
    cursor: default;
}

.artwork .all_wrap > .art_con>li:hover strong{
    
    text-shadow: #a4f6ff 1px 0 10px;
    transform: scale(1.05);
    transition-duration: 0.2s;
}

.artwork .all_wrap > .art_con>li p{
    font-family: 'GmarketSans';
    font-weight: 500;
    color: #ffffff;
    font-size: 17px;
    word-break: keep-all;
    margin: 0 auto;
    cursor: default;
    display: block;
    max-width: 70%;
}

.artwork .all_wrap > .art_con>li:hover p{
    
    text-shadow: #a4f6ff 1px 0 10px;
    transform: scale(1.05);
    transition-duration: 0.2s;
}

/*pcb*/

section.pcb{
    background-image: url('../../img/pcb_background.png');
    background-position: center bottom;
    background-size: contain;
    background-repeat: no-repeat;
}

.pcb_top{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.pcb_top h2{
    display: inline-block;
    font-family: 'GmarketSans';
    font-weight: 700;
    font-size: 90px;
}

.pcb_top h2 span{
    display: block;
    font-family: 'GmarketSans';
    font-size: 25px;
    font-weight: 500;
    margin-bottom: -10px;
}

/*
.pcb_tab_btn ul{
    font-size: 0px;
}

.pcb_tab_btn ul li{
    display: inline-block;
    margin-right: 10px;
    width: 255px;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
    background-color: #ffffff;
}

.pcb_tab_btn ul li.on{
    background-color: #0057ab;
}

.pcb_tab_btn ul li a{
    font-size: 17px;
    color: #222222;
    text-align: center;
    display: block;
    height: 50px;
    line-height: 50px;
    font-family: 'GmarketSans';
}

.pcb_tab_btn ul li.on a{
    font-size: 20px;
    color: #ffffff;
}
*/


.swiper-pagination1{
    width: auto;
}

.swiper-pagination1 span{
    display: inline-block;
    margin-right: 10px;
    width: 255px;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
    background-color: #ffffff;
    border-radius: 0;
    font-size: 17px;
    color: #222222;
    text-align: center;
    height: 50px;
    line-height: 50px;
    font-family: 'GmarketSans';
    opacity: 1;
}

.swiper-pagination1 span.swiper-pagination-bullet-active{
    background-color: #0057ab;
    color: #fff;
    font-size: 20px;
}

.swiper1{
    overflow: hidden;
}

.pcb_table_box{
    width: 100%;
}

.pcb_table_box:before,
.pcb_table_box:after{
    display: block;
    content: "";
    clear: both;
}

.pcb_table_box h3{
    margin-bottom: 20px;
    font-size: 25px;
    font-weight: 500;
    padding-left: 20px;
    border-left: 4px solid #0057ab;
    font-family: 'GmarketSans';
}

.pcb_table{
    width: calc(50% - 15px);
    margin-right: 30px;
    float: left;
}

.pcb_table:last-of-type{
    margin-right: 0px;
}

.pcb_table table{
    width: 100%;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
    min-height: 761px;
}

.pcb_table table tr th{
    font-size: 21px;
    color: #ffffff;
    background-color: #0057ab;
    font-weight: 500;
    letter-spacing: 1px;
}

.pcb_table table tr th:first-child{
    box-sizing: border-box;
    border-right: 1px solid #ffffff;
    width: 43%;
}

.pcb_table table tr th,
.pcb_table table tr td{
    text-align: center;
    padding: 20px;
}

.pcb_table table tr td{
    font-size: 17px;
    font-weight: 500;
    background-color: #ffffff;
}

.pcb_table table tr td:first-child{
    background-color: #d1d1d1;
    border-bottom: 1px solid #fff;
}

.pcb_table table tr td:last-child{
    border-bottom: 1px solid #d1d1d1;
}

.pcb_table table tr:last-child td{
    border-bottom: 0px;
}

.pcb_table table tr:last-child td:last-child{
    border-bottom: 0px;
}

/*smt*/

section.smt{
    background-color: #f5f5f5;
}

.smt_top{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.smt_top h2{
    display: inline-block;
    font-family: 'GmarketSans';
    font-weight: 700;
    font-size: 90px;
}

.smt_top h2 span{
    display: block;
    font-family: 'GmarketSans';
    font-size: 25px;
    font-weight: 500;
    margin-bottom: -10px;
}

/*
.smt_tab_btn ul{
    font-size: 0px;
}

.smt_tab_btn ul li{
    display: inline-block;
    margin-right: 10px;
    width: 255px;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
    background-color: #ffffff;
}

.smt_tab_btn ul li.on{
    background-color: #0057ab;
}

.smt_tab_btn ul li a{
    font-size: 17px;
    color: #222222;
    text-align: center;
    display: block;
    height: 50px;
    line-height: 50px;
    font-family: 'GmarketSans';
}

.smt_tab_btn ul li.on a{
    font-size: 20px;
    color: #ffffff;
}
*/

.swiper-pagination2 span{
    display: inline-block;
    margin-right: 10px;
    width: 255px;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
    background-color: #ffffff;
    border-radius: 0;
    font-size: 17px;
    color: #222222;
    text-align: center;
    height: 50px;
    line-height: 50px;
    font-family: 'GmarketSans';
    opacity: 1;
}

.swiper-pagination2 span.swiper-pagination-bullet-active{
    background-color: #0057ab;
    color: #fff;
    font-size: 20px;
}

.swiper2{
    overflow: hidden;
}

.smt_table_box{
    width: 100%;
}

.smt_table{
    width: 100%;
}

.smt_table.one{
    margin-bottom: 60px;
}

.smt_table h3{
    margin-bottom: 20px;
    font-size: 25px;
    font-weight: 500;
    padding-left: 20px;
    border-left: 4px solid #0057ab;
    font-family: 'GmarketSans';
}

.smt_table table{
    width: 100%;
    border-bottom: 1px solid #0057ab;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
}

.smt_table table tr th,
.smt_table table tr td{
    text-align: center;
}

.smt_table table tr th{
    background-color: #0057ab;
    color: #ffffff;
    font-size: 21px;
    font-weight: 400;
    padding: 20px 15px;
    box-sizing: border-box;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
}

.smt_table table tr td{
    color: #222222;
    padding: 30px 20px;
    border-right: 1px solid #d1d1d1;
    border-bottom: 1px solid #d1d1d1;
    background-color: #ffffff;
}

.smt_table table tbody tr:first-child td:last-child{
    border-right: 0px;
}

.smt_table table tbody tr:last-child td{
    padding: 15px 0;
    border: 0px;
}

/*contact*/

.contact_wrap{
    width: 100%;
    box-sizing: border-box;
    padding-right: calc((100vw - 1300px) / 2);
    display: flex;
}

.contact_right{
    width: 35%;
    padding: 80px 0px 120px 80px;
}

.contact_right h2{
    font-family: 'GmarketSans';
    font-weight: 500;
    font-size: 55px;
    margin-bottom: 60px;
}

.contact_right h2 span{
    font-family: 'GmarketSans';
    display: block;
    font-weight: 500;
    font-size: 25px;
    margin-bottom: -5px;
}

.contact_left{
    width: 65%;
}

.contact_form{
    width: 100%;
}

.contact_form ul li{
    width: 100%;
}

.contact_form>ul li:first-child{
    background-image: url('../../img/ico1.png');
    background-position: left 10px center;
    background-repeat: no-repeat;
    background-size: 28px;
}

.contact_form>ul li:nth-child(2){
    background-image: url('../../img/ico2.png');
    background-position: left 10px center;
    background-repeat: no-repeat;
    background-size: 28px;
}

.contact_form ul li.inp_txt{
    border-bottom: 1px solid #d1d1d1;
    margin-bottom: 45px;
    box-sizing: border-box;
    padding-left: 50px;
}

.contact_form ul li.t_area{
    margin-bottom: 20px;
}

.contact_form input[type="text"]{
    width: 100%;
    height: 50px;
    border: none;
    box-sizing: border-box;
    font-size: 17px;
    padding-left: 8px;
}

.contact_form input[type="text"]::placeholder{
    color: #666666;
    font-weight: 500;
    letter-spacing: -1px;
}

.contact_form input:focus::placeholder{
    color: transparent;
}

.inp_on{
    background-color: #E3F2FD;
    color: #0a2457;
}

.contact_form textarea{
    width: 100%;
    border: 1px solid #d1d1d1;
    box-sizing: border-box;
    resize: none;
    font-size: 17px;
    box-sizing: border-box;
    padding: 20px 35px;
}

.contact_form textarea::placeholder{
    color: #666666;
    font-weight: 500;
    letter-spacing: -1px;
}

.contact_form textarea:focus::placeholder{
    color: transparent;
}

.ps_info_agree{
    margin-bottom: 70px;
}

.ps_info_agree ul{
    overflow: hidden;
}

.ps_info_agree ul li{
    float: left;
    width: auto;
    margin-right: 18px;
    font-size: 15px;
}

.ps_info_agree ul li a{
    font-size: 15px;
}

.c_submit_btn{
    width: 210px;
    line-height: 55px;
    background-color: #0057ab;
    border: 0;
    border-radius: 0px;
    font-size: 22px;
    color: #ffffff;
}

.contact_left .map{
    width: 100%;
    height: 74%;
}

.contact_left .map iframe{
    width: 100%;
    height: 100%;
}

.contact_left .ct_info{
    width: 100%;
    height: 26%;
    background-color: #0057ab;
    box-sizing: border-box;
    padding: 45px 60px;
}

.ct_info h3{
    font-family: 'GmarketSans';
    font-weight: 700;
    font-size: 28px;
    color: #fff;
}

.ct_info address{
    font-size: 17px;
    color: #ffffff;
    font-family: 'GmarketSans';
    font-weight: 500;
    box-sizing: border-box;
    padding: 20px 0 20px 55px;
    background-image: url('../../img/ico3.png');
    background-position: left 0 center;
    background-size: 25px;
    background-repeat: no-repeat;
}

.ct_info ul{
    font-size: 0px;
    box-sizing: border-box;
    padding-left: 55px;
}

.ct_info ul li{
    display: inline-block;
    font-size: 17px;
    font-family: 'GmarketSans';
    font-weight: 300;
    color: #ffffff;
    margin-right: 30px;
}

.ct_info ul li:last-child{
    margin-right: 0px;
}

.ct_info ul li span{
    font-family: 'GmarketSans';
    font-weight: 500;
}

/*footer*/

footer .all_wrap{
    padding: 0px;
}

.footer_top{
    background-color: #f5f5f5;
}

.footer_top ul{
    font-size: 0px;
}

.footer_top ul li{
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    padding: 20px;
}

.footer_top ul li:after{
    display: block;
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 16px;
    background-color: #000000;
    opacity: 0.1;
}

.footer_top ul li:last-child:after{
    display: none;
}

.footer_top ul li a{
    font-size: 14px;
    color: #9da4a8;
}

.footer_bot{
    background-color: #333333;
}

.fb_box{
    width: 100%;
    box-sizing: border-box;
    padding: 80px 0px 50px 650px;
    background-image: url('../../img/footer_logo.png');
    background-size: 350px;
    background-position: left 0 top 70px;
    background-repeat: no-repeat;
}

.fb_box address p{
    font-size: 14px;
    color: #ffffff;
    line-height: 2.2;
    font-weight: 500;
    font-family: 'GmarketSans';
}


#contact-sec{position:relative; height: 200px;}

.line{width: 100px; height: 10px; background-color: #fff; margin-left: 15px; margin-bottom: 35px; animation:textAni 1s linear; transition: all 0.5s;}
@keyframes textAni {	0%    {width: 0;}   100%   {width: 100px;}}
.contact-section .txt-box{ position: absolute;  top: 0; left: 0;  transform: none;  width: 100%;  height: 100%;}

.contact-section .txt-box > a{white-space:nowrap;}
.contact-section .txt-box > a span{font-size: 9.713vw;line-height: 1; color:#fff; letter-spacing: normal; font-weight: 600; display:flex; transform: rotateX(-90deg) rotateY(0deg); overflow:hidden; position:relative; transition-property: transform; transition-duration: 2s; transition-timing-function: cubic-bezier(.26,1,.48,1); transform-origin: center top; perspective: 20vw;   font-family: 'Orbitron', sans-serif; font-weight: 700; z-index:20;   align-items: baseline;}
.contact-section .txt-box > a span:after{content:''; display:block; width:0%; height:4px;   background-color: #fff; position:absolute; bottom:0; left:0; -webkit-transition: width 600ms cubic-bezier(0.25, 0, 0.115, 0.995); -moz-transition: width 600ms cubic-bezier(0.25, 0, 0.115, 0.995);-o-transition: width 600ms cubic-bezier(0.25, 0, 0.115, 0.995); transition: width 600ms cubic-bezier(0.25, 0, 0.115, 0.995);}
.contact-section .txt-box > a span i{display:block; font-size:inherit; font-family: inherit; font-weight: inherit; font-style: normal; color:inherit; line-height:1; transition-property: transform;  transition-duration: 1.2s; transition-timing-function: cubic-bezier(.26,1,.48,1); transform: translateY(100%);  transform-origin: center bottom;}

.contact-section .txt-box > a img:last-child{display:none;}
.contact-section .txt-box > a span i:nth-child(1){transition-delay: 0s;}
.contact-section .txt-box > a span i:nth-child(2){transition-delay: 0.05s;}
.contact-section .txt-box > a span i:nth-child(3){transition-delay: 0.1s;}
.contact-section .txt-box > a span i:nth-child(4){transition-delay: 0.15s;}
.contact-section .txt-box > a span i:nth-child(5){transition-delay: 0.2s;}
.contact-section .txt-box > a span i:nth-child(6){transition-delay: 0.25s;}
.contact-section .txt-box > a span i:nth-child(7){transition-delay: 0.3s;}
.contact-section .txt-box > a span i:nth-child(8){transition-delay: 0.35s;}
.contact-section .txt-box > a span i:nth-child(9){transition-delay: 0.4s;}
.contact-section .txt-box > a span i:nth-child(10){transition-delay: 0.45s;}
.contact-section .txt-box > a span i:nth-child(11){transition-delay: 0.5s;}
.contact-section .txt-box > a span i:nth-child(12){transition-delay: 0.55s;}
.contact-section .txt-box > a span i:nth-child(13){transition-delay: 0.6s;}
.contact-section .txt-box > a span i:nth-child(14){transition-delay: 0.65s;}
.contact-section .txt-box > a span i:nth-child(15){transition-delay: 0.7s;}
.contact-section .txt-box > a span i:nth-child(16){transition-delay: 0.75s;}
.contact-section .txt-box > a span i:nth-child(17){transition-delay: 0.8s;}

.contact-section.on .txt-box > a span{ transform: rotateX(0);}
.contact-section.on .txt-box > a span i{    transform: translate(0);}

.contact-section.on .txt-box:hover > a span:after{width:100%;}
.contact-section.on .txt-box:hover > a .fot-line:nth-of-type(2) span:after{transition-delay:0.2s;}

svg {

    width: 65vw;
   overflow: unset;
}

svg > * {
    fill: #ffffff!important;
    stroke: #fff;
    stroke-width: 0.85px;
}