@font-face {
	font-family: 'aGESPM';    font-style: normal;    font-weight: 500;
	src: url('/stockunion/font/aGESPM.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
@font-face {
	font-family: 'aGESPM';    font-style: normal;    font-weight: 700;
	src: url('/stockunion/font/aGESPB.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
@font-face {
	font-family: 'Gmarket Sans';    font-style: normal;    font-weight: 700;
	src: local('Gmarket Sans Bold'), local('GmarketSans-Bold'),
	url('/stockunion/font/GmarketSansBold.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('/stockunion/font/GmarketSansBold.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


#wrap {
width:100%;
min-width:320px;
overflow: hidden;
}

.inner {
    margin: 0 auto;
    max-width: 1200px;
    width: calc(100% - 32px);
}
.clearfix::after {
display: block;
clear: both;
content: '';
}

/* common */
.only_web,
.only_web1180,
.only_web1024 {display:block;}
.only_mo,
.only_mo1180,
.only_mo1024 {display:none !important;}

.slick-slide {
outline: 0;
}
.slick-dots li button {
border: 0 !important;
}
.top_logo strong {
    font-weight:900;
}
.top_logo {
    display:inline-block;
    width:160px; height:50px; line-height:50px;
    text-align:center;
    font-size:24px; font-weight:500;
    border-radius:24.5px;
}



/* header */
#header {
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100%;
height: 80px;
background: #111111;
z-index: 100;
}
#header.on {
    background-color:#fff;
}
#header.shadow {
    -webkit-box-shadow: 12px -1px 21px 0px rgba(0, 0, 0, 0.41);  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
    -moz-box-shadow: 12px -1px 21px 0px rgba(0, 0, 0, 0.41);  /* Firefox 3.5 - 3.6 */
    box-shadow: 12px -1px 21px 0px rgba(0, 0, 0, 0.41);  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */    
}
#header .inner {
    position:relative;
    max-width:1200px;
    box-sizing: border-box;
    width:100%;
    margin:0 auto;
}
#header .logo {
    position: absolute;
    top: 50%; left:0;
    transform: translate(0, -50%);
}
#header .logo a {
display: block;
}
#header .logo a img {
display: block;
}
#header .gnb {
    text-align: center;
}
#header .gnb ul {
    display: inline-block;
}
#header .gnb li {
    float: left;
}
#header .gnb li a {
display: block;
padding: 0 45px;
line-height: 80px;
font-size: 18px;
font-weight: 500;
color:#fff;
}
#header .right_btn {
    position:absolute;
    top:50%; right:0;
    transform:translate(0,-50%);
}
#header .right_btn .inquiry_btn {
    display:inline-block; height:32px; line-height:32px;
    background:#fae100 url('../img/icon/ico_kakaotalk.png') 14px center no-repeat;
    padding:0 13px 0 45px;
    font-size:14px; font-weight:500;
    border-radius:21px;
    color:#381e1f;
    margin-right:25px;
}
#header .right_btn .call_btn {
    display:inline-block; height:23px; line-height:23px;
    background:url('../img/icon/ico_call.png') left center no-repeat;
    font-family: 'Gmarket Sans'; font-weight:700; font-size:16px;
    color:#fff;
    padding-left:30px;
    vertical-align:middle;
}
#header .ham_btn{
display: none;
}
/* //header */

/* //container */
#container {
    padding-top: 80px;
}
.genius_portfolio {
    display: block;
    /* padding: 16px 0; */
    width: 260px;
    line-height: 50px;
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    background: #b90004;
    border-radius: 24.5px;
}

/* main_visual*/
.main_visual span {
    display: block;
    width: 100%;
    height: 830px;
    background-position: center center;
    background-repeat: no-repeat;
}
/* //main_visual */

/* pro_info */
.pro_info {
    background: #ffffff;
}
.pro_info .inner {
    position: relative;
    padding: 130px 0 78px;
}
.pro_info .txt {
    padding-left: 54.166%;
}
.pro_info .txt .sub_desc {
    margin-top: 30px;
    font-size: 28px;
    font-weight: 400;
    color: #333333;
    letter-spacing: -0.06em;
    line-height: 1.3;
}
.pro_info .txt .sub_desc span {
    display: block;
    font-weight: 700;
    font-size: inherit;
    color: #d73034;
}
.pro_info .txt .name {
    display: block;
    margin-top: 24px;
    font-size: 52px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #333333;
}
.pro_info .txt .name span {
    display: inline-block;
    margin-left: 16px;
    font-size: 24px;
    font-weight: inherit;
    font-family: inherit;
    color: inherit;
}
.pro_info .txt .career {
    margin-top: 40px;
}
.pro_info .txt .career dt {
    float: left;
    width: 104px;
    font-family: 'aGESPM', sans-serif;
    font-weight: 500;
    font-size: 36px;
    color: #333333;
}
.pro_info .txt .career dd {
    float: left;
    width: calc(100% - 104px);
}
.pro_info .txt .career dd .box span {
    display: block;
    font-size: 20px;
    font-weight: 400;
    color: #333333;
    line-height: 1.5;
}
.pro_info .person {
    position: absolute;
    bottom: 0;
    left: -10.833%;
    width: 61.833%;
}
/* //pro_info */


/* slider_banner */
.slider_banner {
    position:relative;
    padding: 50px 0;
    background: #6e0002;
}
.slider_banner .slide {
    padding:0 10px;
}
.slider_banner .slide img { max-width:100%; }
.slider_banner .gradient {
    position:absolute; top:0; left:0; width:100%; height:100%;
    background: -webkit-linear-gradient(100deg, rgba(110,0,2,1) 0%, rgba(110,0,2,0) 15%, rgba(110,0,2,0) 100%);
    background: -ms-linear-gradient(100deg, rgba(110,0,2,1) 0%, rgba(110,0,2,0) 15%, rgba(110,0,2,0) 100%);
    background: linear-gradient(100deg, rgba(110,0,2,1) 0%, rgba(110,0,2,0) 15%, rgba(110,0,2,0) 100%);
}
/* //slider_banner */

/* event_sec */
.event_sec {
    padding: 100px 0 176px;
    background: url(../img/main/event_sec_bg.jpg) center center no-repeat;
    background-size: cover;
}
.event_sec .genius_portfolio {
    margin: 0 auto;
}
.event_sec .title {
    margin-top: 27px;
    margin-bottom: 32px;
    font-size: 60px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #252525;
    text-align: center;
    line-height: 1.2;
}
.event_sec .portfolio_box {
    margin-top: 80px;
}
.event_sec .portfolio_box .box {
    padding: 0 10px;
    width: 50%;
    background-position: top 85px right 10px;
    background-repeat: no-repeat;
    background-size: 27.333%;
    transform: translateY(100px);
    opacity: 0;
    box-sizing: border-box;
    transition: all .4s ease;
}
.event_sec .portfolio_box .box1 {
    float: left;
    background-image: url(../img/main/event_ico01.png);
}
.event_sec .portfolio_box .box2 {
    float: right;
    padding-left: 40px;
    background-image: url(../img/main/event_ico02.png);
}
.event_sec.on .portfolio_box .box {
    transform: translateY(0);
    opacity: 1;
    transition: all .4s ease;
}
.event_sec .portfolio_box .num {
    display: block;
    width: 60px;
    height: 60px;
    font-size: 28px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #ffffff;
    line-height: 60px;
    text-align: center;
    background: #d83034;
    border-radius: 50%;
}
.event_sec .portfolio_box h3 {
    margin-top: 24px;
    font-size: 38px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #252525;
}
.event_sec .portfolio_box .list {
    margin-top: 30px;
}
.event_sec .portfolio_box .list li {
    position: relative;
    padding-left: 20px;
    font-size: 24px;
    font-weight: 500;
    color: #454545;
    line-height: 1.5;
}
.event_sec .portfolio_box .list li::before {
    position: absolute;
    top: 6px;
    left: 0;
    width: 7px;
    height: 7px;
    background: #d83034;
    border-radius: 50%;
    content: '';
}
.event_sec .portfolio_box .list li + li {
    margin-top: 30px;
}
/* //event_sec */

/* service_sec */
.service_sec {
    padding: 100px 0 118px;
    background: #fff;
}
.service_sec .genius_portfolio {
    margin: 0 auto;
}
.service_sec .title {
    margin-top: 30px;
    font-size: 60px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #252525;
    text-align: center;
    line-height: 1.2;
}
.service_sec .slider_box {
    margin-top: 50px;
    background: url(../img/main/service_bg.png) center top 83px no-repeat;
    background-size: 77.666%;
    transform: translateY(100px);
    opacity: 0;
    transition: all .4s ease;
}
.service_sec.on .slider_box {
    transform: translateY(0);
    opacity: 1;
    transition: all .4s ease;
}
.service_sec .slider_item img {
    margin: 0 auto;
    width: 34.25%;
    max-width: 411px;
}
.service_sec .slider_item .txt {
    margin-top: 17px;
    text-align: center;
}
.service_sec .slider_item .txt h3 {
    font-size: 30px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #d83034;
}
.service_sec .slider_item .txt p {
    margin-top: 20px;
    font-size: 16px;
    font-weight: 400;
    color: #666666;
}
.service_sec .slider_box .slick-arrow {
    position: absolute;
    top: 29.321%;
    width: 42px;
    height: 80px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    text-indent: -9999em;
    z-index: 111;
}
.service_sec .slider_box .slick-prev {
    left: 50px;
    background-image: url(../img/main/prev_btn.png);
}
.service_sec .slider_box .slick-next {
    right: 50px;
    background-image: url(../img/main/next_btn.png);
}
.service_sec .slick-dots {
    margin-top: 40px;
    text-align: center;
    font-size: 0;
}
.service_sec .slick-dots li {
    display: inline-block;
}
.service_sec .slick-dots li + li {
    margin-left: 12px;
}
.service_sec .slick-dots li button {
    display: block;
    width: 18px;
    height: 18px;
    background: #e9e9e9;
    border-radius: 9px;
    transition: all .4s;
}
.service_sec .slick-dots li.slick-active button {
    width: 36px;
    background: #b90004;
    transition: all .4s;
}
/* //service_sec */


/* youtube_sec */
.youtube_sec {
    padding: 100px 0 114px;
    background: url(../img/main/youtube_sec_bg.jpg) center center no-repeat;
    background-size: cover;
}
.youtube_sec .genius_portfolio {
    margin: 0 auto;
}
.youtube_sec .title {
    margin-top: 27px;
    font-size: 60px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #fff;
    text-align: center;
}
.youtube_sec .video_area {
    position: relative;
    margin-top: 66px;
    padding-top: 56.25%;
}
.youtube_sec .video_area iframe {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.youtube_sec .video_area iframe.on {
    display: block;
}
.youtube_sec .link_row {
    margin-top: 30px;
    font-size: 0;
    text-align: center;
}
.youtube_sec .link_row button {
    display: inline-block;
    width: calc(50% - 10px);
    background: #111111;
}
.youtube_sec .link_row button.on {
    background: #b90004;
}
.youtube_sec .link_row button + button {
    margin-left: 20px;
}
.youtube_sec .link_row button span {
    display: inline-block;
    padding-right: 30px;
    line-height: 100px;
    font-size: 36px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #fff;
    text-transform: uppercase;
    background: url(../img/main/link_arrow.png) right 0 center no-repeat;
}
/* //youtube_sec */



/* event */
.event {
    padding: 100px 0 114px;
    width:100%;
    position:relative;
    background: #152944 url(../img/main/inquiry_sec_bg.jpg) center center no-repeat;
    background-size: cover;
    text-align:center;
}
.event .sub_title {
    font-size: 22px;
    font-weight: 500;
    color: #d83034;
    text-transform: uppercase;
}
.event .title {
    margin-top: 20px;
    font-size: 60px;
    font-weight: 500;
    font-family: 'aGESPM', sans-serif;
    color: #fff;
    line-height: 1.2;
}

.event .table {
    margin: 60px auto 0;
    width: 660px; 
    color: #fff;
}
.event .table .form {
    font-size:0; margin-top:60px;
}
.event .form dl {
    text-align:left;
}
.event .form dt {
    font-size:24px; font-weight:500;
    margin-bottom:20px;
}
.event .form .name {
    width:320px; display:inline-block;
    margin-right:10px;
}
.event .form input {
    border:1px solid rgba(255,255,255,.6); color:#fff;
    font-size:16px; font-weight:400;
    background:transparent; box-sizing:border-box;
    height:60px; line-height:60px;
    padding-left:20px;
}
.event .form .name input {
    width:320px;
    -webkit-appearance: none;
   -moz-appearance:none;
   appearance:none; outline: none;
   border-radius:0;
}
.event .form .partner {
    width:320px; display:inline-block;
    margin-left:10px;
}
.event .form .partner select {
    color:#fff;
    border:1px solid rgba(255,255,255,.6);
    box-sizing:border-box;
    width:320px; height:60px; line-height:60px;
    font-size:16px; font-weight:400;
    padding-left:20px;
    -webkit-appearance: none;
    -moz-appearance:none;
    appearance:none; outline: none;
    background:transparent url('../img/icon/ico_select_arrow.png') right 17px center no-repeat;
    border-radius:0;
}
.event .form .partner select option {
    color:#000;
}
.event .form .partner select::-ms-expand {
    display: none;
}
.event .form .partner select option {
    background:transparent;
}
.event .form .tel {
    margin-top:40px;
}
.event .form .tel input {
    width:100%;
}
.event .table .check_wrap {
    margin-top:5px;
    text-align:left;
}
.event .table .check_wrap p {
    text-align:left;
    font-size:16px; font-weight:400;
    margin-bottom:4px;
}
.event .table .check_wrap p a {
    display:inline-block;
    width:70px; height:24px; line-height:22px;
    text-align:center;
    border:1px solid #a4a4a4;
    box-sizing:border-box;
    border-radius:4px;
    font-size:13px; font-weight:400;
    margin-left:12px;
}
.event .table .check_wrap input {
    width:0; height:0; display:none;
    overflow:hidden;
}
.event .table .check_wrap label {
    display:inline-block;
    margin:7px 0;
    padding-left:30px;
    background:url('../img/icon/ico_check.png') left center no-repeat;
    height:21px; line-height:21px;
    cursor:pointer;
}
.event .table .check_wrap input[type="checkbox"]:checked + label {
    background:url('../img/icon/ico_check_on.png') left center no-repeat;
}
.event .table .button button {
    width:450px; height:100px; line-height:100px;
    margin-top:50px;
    border-radius: 50px;
    background: linear-gradient(to bottom, #d83034, #b90004);
    font-size:40px;
    font-weight:500;
    font-family: 'aGESPM', sans-serif;
    color:#fefefe;
    box-shadow: 3px 12px 18px 0px rgba(0, 0, 0, 0.17);
}

/* footer-banner */
.footer_banner {
    position:fixed; bottom:0;
    width:100%; height:130px;
    background: url(../img/main/fix_banner_bg.png) center center no-repeat;
    background-size: cover;
    -webkit-box-shadow: 12px -1px 21px 0px rgba(0, 0, 0, 0.41);
    -moz-box-shadow: 12px -1px 21px 0px rgba(0, 0, 0, 0.41);
    box-shadow: 12px -1px 21px 0px rgba(0, 0, 0, 0.41);
    z-index:999;
    cursor:pointer;
}
.footer_banner .inner {
    position: relative;
    height: 100%;
}
.footer_banner .person {
    position: relative;
    float: left;
    width: 21.083%;
    margin-left: 5.5%;
    height: 100%;
}
.footer_banner .person img {
    position: absolute;
    bottom: 0;
    left: 0;
}
.footer_banner .logo {
    float: left;
    margin-left: 1.416%;
    width: 14.5%;
    line-height: 130px;
}
.footer_banner .logo img {
    vertical-align: middle;
}
.footer_banner .txt {
    float: left;
    display: table;
    margin-left: 1.833%;
    height: 100%;
}
.footer_banner .txt > div {
    display: table-cell;
    vertical-align: middle;
}
.footer_banner .txt span {
    display: block;
    margin-bottom: 12px;
    font-size: 20px;
    font-weight: 700;
    color: #111111;
}
.footer_banner .txt p {
    position: relative;
    font-size: 46px;
    font-weight: 700;
    font-family: 'Gmarket Sans', sans-serif;
    color: #111111;
}
.footer_banner .txt p::after {
    display: block;
    position: absolute;
    top: 50%;
    left: calc(100% + 18px);
    transform: translateY(-50%);
    margin-top: -5px;
    width: 63px;
    height: 20px;
    background: url(../img/main/fix_banner_arrow.png) center center no-repeat;
    background-size: cover;
    content: '';
}
.footer_banner .txt p strong {
    color: #d83034;
    font-size: inherit;
    font-family: inherit;
    font-weight: 700;
}

#gnb05 {background:#222;}

/* footer */
#footer {
padding: 50px 0;
background: #111111;
margin-bottom:130px;
}
#footer .foot_logo {
display: inline-block;
vertical-align: middle;
}
#footer .info {
display: inline-block;
vertical-align: middle;
margin-left: 62px;
}
#footer .info address {
font-size: 15px;
font-weight: 350;
color: #8d8d8d;
font-style: normal;
}
#footer .info address span {
position: relative;
display: inline-block;
margin-right: 4px;
padding-right: 8px;
line-height: 1.5;
}
#footer .info address span:last-child {
margin-right: 0;
padding-right: 0;
}
#footer .info address span::after {
display: block;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
width: 1px;
height: 12px;
background: #888;
content: '';
}
#footer .info address span:last-child::after {
display: none;
}
#footer .info .copy {
font-size: 15px;
font-weight: 350;
color: #888;
line-height: 1.75;
}
/* //footer */



.popup_wrap {
display: none;
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 9999999999;
}

.popup_wrap .popup {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 640px;
height: 640px;
z-index: 2;
}
.popup_wrap .popup .top {
height: 60px;
line-height: 34px;
font-size: 18px;
font-weight: 400;
color: #fff;
background: #252525;
padding: 12px 12px 12px 15px;
}
.popup_wrap .popup .top p {
float: left;
}
.popup_wrap .popup .top .close {
float: right;
cursor: pointer;
}
.popup_wrap .popup .top .close img {
width: 25px; vertical-align: middle;
}
.popup_wrap .popup .content {
height: 570px;
background: #fff;
padding: 15px;
font-size: 14px;
line-height: 1.5;
}
.popup_wrap .popup .content .padding {
height: 100%;
overflow-y: auto;
}
.popup_wrap .popup .content .padding::-webkit-scrollbar {
width: 0px;
background: transparent;
height: 0px !important;
}
.popup_wrap .popup .content .padding::-webkit-scrollbar-thumb {
background-color: #aaa;
}
.popup_wrap .popup .content .padding::-webkit-scrollbar-track {
background-color: #f5f5f5;
}

.popup_wrap .bg {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: rgba(0,0,0,0.5);
}

.top_btn {
    display: none;
    position: fixed;
    bottom: 100px;
    right: 100px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: #b90004;
    box-shadow: 2px 7px 9px 0px rgba(0, 0, 0, 0.17);
    z-index: 1000;
}
.top_btn span {
    display: block;
    padding-top: 26px;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    line-height: 1;
    background: url(../img/main/top_btn.png) center top no-repeat;
}

@media all and (max-width: 1200px) {
    /* common */
    .inner {
        padding:0 16px;
        width:100%;
        box-sizing:border-box;
    }
    /* header */
    #header .logo { left:16px; }
    #header .right_btn { right:16px; }
    /* footer-banner */
    .footer_banner .banner_inner {
        width:100%;
    }
    .footer_banner .text {
        right:15px;
    }
    .footer_banner .text .top {
        font-size:18px;
    }
    .footer_banner .text .btm {
        font-size:40px;
    }
    .footer_banner .logo {
        width:15%; text-align:center;
        margin:0;
    }
    .footer_banner .left img {
        max-width:100%;
    }
    /* common */
    .top_logo {
        font-size:20px; width:140px;
    }

    .main_visual span {
        padding-top: 61.666%;
        height: auto;
        background-size: auto 100%;
    }
    .service_sec .box01 .service_inner,
    .service_sec .box03 .service_inner {
        padding-left: 150px;
    }
    .service_sec .box02 .service_inner {
        padding-right: 150px;
    }
    .service_sec .box01 .img {
        bottom: 10px;
    }
    .service_sec .box03 .img {
        bottom: 20px;
    }

    /* footer-banner */
    .footer_banner .logo { display:none; }
    .footer_banner .txt p {
        font-size: 36px;
    }
}
@media all and (max-width: 1024px) {
    /* common */
    .only_web1024 { display:none !important; }
    .only_mo1024 { display:block !important; }
    #header .gnb li a { padding:0 25px; }

    /* pro_info */
    .event_sec .title,
    .service_sec .title,
    .youtube_sec .title,
    .event .title {
        font-size: 50px;
    }

    .pro_info .txt {
        padding-left: 50%;
    }
    .event_sec .portfolio_box .box {
        background-size: 20%;
    }
    .event_sec .portfolio_box .list li {
        font-size: 20px;
    }
    .youtube_sec .link_row button span {
        font-size: 30px;
    }
    
    .top_btn {
        bottom: 80px;
        right: 50px;
    }
    /* footer-banner */
    .footer_banner .text .btm { font-size:35px; }

}
@media all and (max-width: 850px) {
    /* common */
    .only_web { display:none !important; }
    .only_mo { display:block !important; }
    .top_logo { width:110px; height:30px; line-height:30px; font-size:16px; }
    h2 { font-size:32px; }
    #container {
        padding-top: 60px;
    }
    /* header */
    #header { height:60px; }
    #header .inner { padding:0; height:100%; }
    #header .logo a img { width: 102px; }
    #header .right_btn .inquiry_btn {
        text-indent:-9999px;
        width:30px; height:30px;
        background:url('/stockunion/img/mo/mo_ico_kakaotalk.png') center no-repeat;
        background-size:contain;
        padding:0;
        margin-right:0;
    }
    #header .right_btn a {
        margin-left:12px; margin-right:0;
    }
    #header .right_btn .call_btn {
        text-indent:-9999px;
        width:30px; height:30px;
        background:url('/stockunion/img/mo/mo_ico_call.png') center no-repeat;
        background-size:contain;
        padding:0; vertical-align:top;
    }
    #header .right_btn .ham_btn {
        display:inline-block !important;
        width:25px; height:23px;
        vertical-align:middle;
    }
    #header .right_btn .ham_btn span {
        display:block;
        width:100%; height:2px;
        margin-bottom:6px;
        background:#fff;
        -webkit-transition:all .3s ease;
        -ms-transition:all .3s ease;
        transition:all .3s ease;
    }
    #header .right_btn .ham_btn span:last-child {
        margin-bottom:0;
    }
    /* active */
    #header .gnb { display:none; }
    .ham_open { display:none !important; }
    #header.active .ham_open { display:block !important; }
    #header.active .ham_close { display:none !important; }
    #header.active { background:#ffffff; }
    #header.active .gnb {
        display:block !important;
        width:100%; margin:0; float: inherit;
        background:#fff;
        position:absolute; top:60px;
        border-top:1px solid #dbdbdb;
    }
    #header.active .gnb ul { width:100%; height:100%; padding: 10px 0; }
    #header.active .gnb li { float: inherit; text-align:center; display:block; }
    #header.active .gnb li a { color:#252525; font-size:14px; font-weight:500; line-height:1.5; padding: 12px 0; }
    #header.active .right_btn .inquiry_btn,
    #header.active .right_btn .call_btn { display:none; }
    #header.active .right_btn .ham_btn span { background:#333333; }
    #header.active .right_btn .ham_btn span:last-child { display:none; }
    #header.active .right_btn .ham_btn span:first-child { transform: rotate(45deg) translate(6px,5px); }
    #header.active .right_btn .ham_btn span:nth-child(2) { transform: rotate(-45deg) translate(0px,0px) }
    .genius_portfolio {
        width: 130px;
        line-height: 26px;
        font-size: 12px;
    }

    /* main_visual */
    .main_visual img {
        display: block;
        width: 100%;
    }

    /* pro_info */
    .pro_info {
        background: url(../img/main/pro_info_bg_mo.jpg) center bottom no-repeat;
        background-size: cover;
    }
    .pro_info .inner {
        padding: 40px 0 0;
        text-align: center;
    }
    .pro_info .txt {
        display: inline-block;
        text-align: left;
        padding-left: 0;
    }
    .pro_info .txt .sub_desc {
        margin-top: 10px;
        font-size: 15px;
    }
    .pro_info .txt .sub_desc span {
        display: block;
    }
    .pro_info .txt .name {
        margin-top: 12px;
        font-size: 27px;
    }
    .pro_info .txt .name span {
        margin-left: 10px;
        font-size: 13px;
    }
    .pro_info .txt .career {
        margin-top: 20px;
    }
    .pro_info .txt .career dt {
        width: 52px;
        font-size: 19px;
    }
    .pro_info .txt .career dd {
        width: calc(100% - 52px);
    }
    .pro_info .txt .career dd .box + .box {
        margin-top: 24px;
    }
    .pro_info .txt .career dd .box span {
        font-size: 13px;
    }
    .pro_info .person {
        position: static;
        margin-top: 7px;
        margin-left: auto;
        width: 100%;
    }
    .pro_info .person img {
        margin: 0 auto;
    }

    /* slider_banner */
    .slider_banner {
        padding: 31px 0;
    }


    /* event_sec */
    .event_sec {
        padding: 40px 0 60px;
        background: url(../img/main/event_sec_bg_mo.jpg) center bottom no-repeat;
        background-size: cover;
    }
    .event_sec .title {
        margin-top: 15px;
        margin-bottom: 0;
        font-size: 27px;
        line-height: 1.3;
    }
    .event_sec .portfolio_box {
        margin-top: 30px;
        padding: 0 5px;
    }
    .event_sec .portfolio_box .box {
        background-size: 85px;
        background-position: top 40px right 0;
    }
    .event_sec .portfolio_box .box,
    .event_sec .portfolio_box .box1
    .event_sec .portfolio_box .box2 {
        float: none;
        padding: 0;
        width: 100%;
    }
    .event_sec .portfolio_box .box2 {
        margin-top: 40px;
    }
    .event_sec .portfolio_box .num {
        width: 30px;
        height: 30px;
        font-size: 15px;
        line-height: 30px;
    }
    .event_sec .portfolio_box h3 {
        margin-top: 15px;
        font-size: 19px;
    }
    .event_sec .portfolio_box .list {
        margin-top: 14px;
    }
    .event_sec .portfolio_box .list li {
        padding-left: 10px;
        font-size: 14px;
    }
    .event_sec .portfolio_box .list li::before {
        position: absolute;
        top: 7px;
        width: 3px;
        height: 3px;
    }
    .event_sec .portfolio_box .list li + li {
        margin-top: 18px;
    }



    
    /* service_sec */
    .service_sec {
        padding: 40px 0 60px;
        background: #f6f6f6;
    }
    .service_sec .inner {
        padding: 0;
    }
    .service_sec .title {
        margin-top: 15px;
        font-size: 27px;
    }
    .service_sec .slider_box {
        margin-top: 15px;
        background: url(../img/main/service_bg_mo.png) center top 32px no-repeat;
        background-size: 100%;
    }
    .service_sec .slider_box .slick-arrow {
        display: none !important;
    }
    .service_sec .slider_item img {
        width: calc(100% - 64px);
        max-width: none;
    }
    .service_sec .slider_item .txt {
        margin-top: 10px;
    }
    .service_sec .slider_item .txt h3 {
        font-size: 20px;
    }
    .service_sec .slider_item .txt p {
        margin-top: 15px;
        font-size: 13px;
        line-height: 1.4;
    }
    .service_sec .slick-dots {
        margin-top: 20px;
    }
    .service_sec .slick-dots li + li {
        margin-left: 10px;
    }
    .service_sec .slick-dots li button {
        width: 15px;
        height: 15px;
        border-radius: 7.5px;
    }
    .service_sec .slick-dots li.slick-active button {
        width: 29px;
    }


    /* youtube_sec */
    .youtube_sec {
        padding: 40px 0 60px;
        background: url(../img/main/youtube_sec_bg_mo.jpg) center center no-repeat;
        background-size: cover;
    }
    .youtube_sec .title {
        margin-top: 15px;
        font-size: 27px;
        line-height: 1.3;
    }
    .youtube_sec .inner {
        margin-top: 25px;
        padding: 0 30px;
    }
    .youtube_sec .link_row {
        margin-top: 25px;
    }
    .youtube_sec .link_row button {
        width: calc(50% - 5px);
        height: 50px;
    }
    .youtube_sec .link_row button + button {
        margin-left: 10px;
    }
    .youtube_sec .link_row button span {
        padding-right: 15px;
        font-size: 14px;
        line-height: 48px;
        background-size: 8px;
    }
    
    
    /* event */
    .event {
        padding: 40px 0;
        background: #252525 url(../img/main/inquiry_sec_bg_mo.jpg) center center no-repeat;
        background-size: contain;
    }
    .event .sub_title {
        font-size: 12px;
    }
    .event .title {
        margin-top: 13px;
        font-size: 27px;
        line-height: 1.3;
    }
    .event .info { font-size:14px; margin-top:15px; }
    .event .table { margin-top: 40px; width:100%; }
    .event .table .form {
        margin-top: 0;
    }
    .event .form dl { margin-bottom:25px; }
    .event .form .tel { margin-top:0; margin-bottom:5px; }
    .event .form dt { font-size:15px; margin-bottom:10px; }
    .event .form input { height:40px; line-height:38px; font-size:12px; padding-left:10px; }
    .event .form .partner select { height:40px; line-height:38px; font-size:12px; padding-left:10px; background-size:10px; }
    .event .form .name { width:calc(50% - 5px); margin-right:10px; }
    .event .form .name input { width:100%; }
    .event .form .partner { width:calc(50% - 5px); margin-left:0; }
    .event .form .partner select { width:100%; }
    .event .table .check_wrap p { font-size:13px; line-height:1.5; }
    .event .table .check_wrap p a { width: 50px; height:20px; line-height:18px; font-size:10px; }
    .event .table .check_wrap label { font-size:12px; background-size:contain; height:16px; line-height:16px; padding-left:25px; }
    .event .table .check_wrap input[type="checkbox"]:checked + label { background-size:contain; }
    .event .table .button button { width:225px; height:50px; line-height:50px; font-size:20px; margin-top:37px; }

    /* popup */
    .popup_wrap .popup {
        width:85%; height:500px;
    }
    .popup_wrap .popup .content {
        height:440px;
    }
    .popup_wrap .popup .top {
        height:40px; line-height:14px; font-size:14px;
    }
    .popup_wrap .popup .content { font-size:12px; }
    .popup_wrap .popup .top .close img { width:15px; }

    /* footer */
    #footer {
        padding: 35px 0 30.556vw; margin-bottom:0;
    }
    #footer .foot_logo {
    display: block;
    margin: 0 auto;
    width: 97px;
    }
    #footer .foot_logo img {
    width: 100%;
    }
    #footer .info {
    display: block;
    margin-left: 0;
    margin-top: 18px;
    text-align: center;
    }
    #footer .info address,
    #footer .info .copy {
    font-size: 13px;
    }
    #footer .info address span::after {
    display: none;
    }
    #footer .info address span {
        display: inline;
    }

    /* footer-banner */
    .footer_banner {
        height: 19.444vw;
        background: url(../img/main/fix_banner_bg_mo.jpg) left center no-repeat;
        background-size: cover;
    }
    .footer_banner .person {
        position: absolute;
        bottom: 0;
        left: 3.750vw;
        float: none;
        margin-left: 0;
        width: 28.194vw;
        height: auto;
    }
    .footer_banner .person img {
        position: static;
    }
    .footer_banner .logo {
        display: block;
        margin-left: 3.333vw;
        width: 18.472vw;
        line-height: 19.444vw;
    }
    .footer_banner .txt {
        margin-left: 28.750vw;
    }
    .footer_banner .txt .logo_mo {
        margin-bottom: 1.667vw;
        width: 16.667vw;
    }
    .footer_banner .txt span {
        margin-top: 1.111vw;
        margin-bottom: 0;
        font-size: 2.778vw;
        font-weight: 700;
    }
    .footer_banner .txt p {
        font-size: 5vw;
        line-height: 1.2;
        letter-spacing: -0.05em;
    }
    .footer_banner .txt p::after {
        top: 1.944vw;
        left: calc(100% + 2.778vw);
        width: 8.750vw;
        height: 2.639vw;
        transform: none;
    }

    .top_btn {
        right: 16px;
        bottom: 125px;
        width: 49px;
        height: 49px;
    }
    .top_btn span {
        padding-top: 18px;
        font-size: 11px;
        background-size: 11px;
    }

}
@media all and (max-width: 350px) {
    .event_sec .title {
        font-size: 25px;
    }
    .event_sec .portfolio_box .box {
        background-position: top 0px right 0;
        background-size: 70px;
    }
    .youtube_sec .link_row button span {
        font-size: 12px;
    }
}


@media (hover:none), 
(hover:on-demand) {
  nav a:hover { 
    /* suppress hover effect on devices that don't support hover fully */
    background: none;
  }
  .youtube .channel li a:hover {
    transform:translateY(0px);
    }
}