@charset "utf-8";

*,
*::before,
*::after {
    box-sizing: inherit;
}
*,
::after,
::before {
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    /* font-smoothing: antialiased; */
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-overflow-scrolling: touch;
    text-rendering: optimizeLegibility;
    text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: none;
}
*::-moz-selection {
    color: #fff;
    background-color: #19b3b5;
}
*::selection {
    color: #fff;
    background-color: #19b3b5;
}
*::-webkit-selection {
    color: #fff;
    background-color: #19b3b5;
}
html {
    /* overflow-x:hidden; */
    box-sizing: border-box;
    -ms-overflow-style: scrollbar; /* overflow-x:hidden */
}
html,
body {
    margin: 0;
    background: #fff;
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-size: 13px;
    color: #2b2b2b;
}
body {
    min-height: 100%;
}
img {
    width: 100%;
    max-width: 100%;
    display: block;
}
figcaption {
    display: none;
}

/* font */
.font_noto {
    font-family: "noto-sans-scott", sans-serif;
}
.font_roboto {
    font-family: "Roboto", sans-serif;
}
.font_robotocon {
    font-family: "Roboto", sans-serif; /* -webkit-transform:scaleX(0.9);-moz-transform:scaleX(0.9);transform:scaleX(0.9);transform-origin:top left; */
}
.font_robotocon02 {
    font-family: "Roboto Condensed", sans-serif;
}

.font_slim {
    display: inline-block;
    -webkit-transform: scaleX(0.9);
    -moz-transform: scaleX(0.9);
    transform: scaleX(0.9);
    transform-origin: top left;
}

/* background color */
.bg_color1 {
    background: #439ab3;
} /* 청록색 */
.bg_color2 {
    background: #ff6194;
} /* 핑크색 */
.bg_color3 {
    background: #594cbb;
} /* 보라색 */
.bg_color4 {
    background: #3d4a90;
} /* 남색 */
.bg_color5 {
    background: #ed7e69;
} /* 오렌지색 */

.scroll {
    width: 90%;
    height: 100%;
    overflow-y: scroll;
    margin-left: 5%;
    padding-top: 8%;
}
#project .scroll {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    margin: 0;
    padding: 0;
    background: #000;
}

html,
body,
#wrapper {
    width: 100%; /*height:100vh;*/ /* overflow:hidden; */
}
#wrap {
    width: 100%;
    overflow: hidden;
}
.noScroll {
    height: 100% !important;
    overflow: hidden !important;
}
/* #wrapper.black , #wrapper.black * {color:#2b2b2b} */
#wrapper.black .subNum *,
#wrapper.black .mainSlideEx.swiper-container *,
#wrapper.black .mainSlide.swiper-container .swiper-pagination,
#wrapper.black .mainSlide.swiper-container .swiper-pagination *,
#wrapper.black .mainSlide.swiper-container * {
    color: #2b2b2b !important;
} /*181228 추가 swiper-container * */
#wrapper.black .swiper-pagination-bullet,
#wrapper.black #head #gnb > menu > li > label > span,
#wrapper.black #head #gnb > menu > li > label > span:before,
#wrapper.black #head #gnb > menu > li > label > span:after,
#wrapper.black .mainSlide.swiper-container .loadbar .loadbar_ani {
    background: #2b2b2b !important;
} /*181228 추가 loadbar_ani */
#wrapper.black .mainSlideEx.swiper-container + .swiper-pagination02,
#wrapper.black .mainSlide.swiper-container .loadbar {
    background: #fff;
} /*181228 추가 loadbar */
#wrapper.black .mainSlide.swiper-container .swiper-button-next {
    background: url(../images/common/slide_next_b.png) no-repeat;
    background-size: 100% 100%;
    background-position: center;
}
#wrapper.black .mainSlide.swiper-container .swiper-button-prev {
    background: url(../images/common/slide_prev_b.png) no-repeat;
    background-size: 100% 100%;
    background-position: center;
}
#wrapper.black #head h1 a {
    background: url(../images/common/logo_b.png) no-repeat center center;
    background-size: contain;
}
/* 200128 화 snsMenu 수정
#wrapper.black #foot #snsMenu menu li:first-child a {background-image:url(../images/common/icon_fb_b.png);}
#wrapper.black #foot #snsMenu menu li:nth-child(2) a {background-image:url(../images/common/icon_insta_b.png)}
#wrapper.black #foot #snsMenu menu li:nth-child(3) a {background-image:url(../images/common/icon_blog_b.png)}
#wrapper.black #foot #snsMenu menu li:last-child a {background-image:url(../images/common/icon_yb_b.png)} */
/* 220215 sns 순서 변경, class명 추가 */
#wrapper.black #foot #snsMenu menu li .sns_fb {
    background-image: url(../images/common/icon_fb_b.png);
}
#wrapper.black #foot #snsMenu menu li .sns_is {
    background-image: url(../images/common/icon_insta_b.png);
}
#wrapper.black #foot #snsMenu menu li .sns_bl {
    background-image: url(../images/common/icon_blog_b.png);
}
#wrapper.black #foot #snsMenu menu li .sns_yb {
    background-image: url(../images/common/icon_yb_b.png);
}
#wrapper.black #foot .project-request a {
    color: #2b2b2b;
}
#wrapper.black #foot .project-request a.project:before {
    background-position: 0 center;
}

/* pop190604 */
.pop_190604 {
    position: fixed;
    right: -1vh;
    top: 15%;
    height: 22vh;
    z-index: 10;
}
.pop_img_190604 {
    display: block;
    width: auto;
    height: 100%;
}
.pop_link_190604 {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 0;
}
.pop_btn_190604 {
    display: block;
    width: auto;
    height: 2.3vh;
    position: absolute;
    right: 5%;
    top: -20%;
    cursor: pointer;
    padding: 8%;
    box-sizing: content-box;
}

/*-----------------------------------------------------------------------------헤더-------------------------------------------------------------------------------*/
#head {
    position: relative;
    z-index: 500;
}
#head h1 {
    position: fixed;
    width: 6.1rem;
    height: 2.7rem;
    right: 1.4rem;
    top: 1.8rem;
    z-index: 10;
}
#head h1 a {
    width: 100%;
    height: 100%;
    text-indent: -9999px;
    background: url(../images/common/logo_w.png) no-repeat center center;
    background-size: contain;
    display: block;
}
#head #gnb {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 11;
} /*181102 수정 top:2rem->0;left:2rem->0*/
#head .subNum {
    position: fixed;
    top: 4.5rem;
    left: 2rem;
    font-size: 4vw;
    color: #2b2b2b;
    font-weight: 400;
    z-index: 10; /*추가*/
    font-family: "Roboto", sans-serif;
}
#head #gnb > menu > li > label {
    position: relative;
    width: 8rem;
    height: 6rem;
    display: block; /*padding:27px;box-sizing:content-box;*/
} /*181106 수정 width:3rem->8rem;height:2rem->6rem;padding:27px;box-sizing:content-box;*/
#head #gnb > menu > li > label > span {
    position: absolute;
    left: 2rem;
    top: 50%;
    width: 37%;
    height: 2px;
    text-indent: -9999px;
    background: #fff;
    display: block;
    transform: translateY(-50%);
} /*181102 수정 left:0->2rem;width: 100%->37%;*/
#head #gnb > menu > li > label > span:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 75%;
    height: 100%;
    background: #fff;
    display: block;
    content: "";
    transform: translateY(-500%);
}
#head #gnb > menu > li > label > span:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 75%;
    height: 100%;
    background: #fff;
    display: block;
    content: "";
    transform: translateY(500%);
}
#head #gnb > menu > li > input[type="checkbox"] {
    width: 0;
    height: 0;
    overflow: hidden;
    display: none;
}
#head #gnb > menu > li > input[type="checkbox"]:checked + .gnbMenu {
    transform: translateX(0);
    opacity: 1;
}
#head.active h1 a {
    background: url(../images/common/logo_b.png) no-repeat center center / contain;
}
#head.active #gnb > menu > li > label > span,
#head.active #gnb > menu > li > label > span:before,
#head.active #gnb > menu > li > label > span:after {
    background: #2b2b2b;
}
#head.active .subNum {
    color: #2b2b2b;
}

#head #gnb .gnbMenu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    padding: 5rem 1.8rem 0 1.8rem;
    background: rgba(0, 0, 0, 0.9);
    transform: translateX(-105%);
    opacity: 0;
    transition: all, 0.4s;
    z-index: 20;
}
#head #gnb > menu > li .gnbMenu ul li a {
    color: #fff;
    opacity: 0.5;
    display: block;
}
#head #gnb > menu > li .gnbMenu ul li a:active {
    opacity: 1;
}
#head #gnb > menu > li .gnbMenu .btn.close {
    position: absolute;
    top: 2.2rem;
    left: 2.2rem;
    width: 1.9rem;
    height: 1.9rem;
    text-indent: -9999px;
    background: url(../images/common/icon_close_w.png) no-repeat;
    background-size: 100% 100%;
    background-position: center;
}
#head #gnb > menu > li .gnbMenu ul:not(.family_list) {
    padding-left: 1.1rem;
}
#head #gnb > menu > li .gnbMenu ul:not(.family_list) li:not(:last-child) {
    margin-bottom: 1.3rem;
}
#head #gnb > menu > li .gnbMenu ul:not(.family_list) li:last-child {
    margin-bottom: 2rem;
}
#head #gnb > menu > li .gnbMenu ul:not(.family_list) li a {
    font-size: 1.5rem;
}
#head #gnb > menu > li .gnbMenu ul.family_list {
    padding: 2rem 0 2rem 1.1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}
#head #gnb > menu > li .gnbMenu ul.family_list li:not(:last-child) {
    margin-bottom: 1rem;
}
#head #gnb > menu > li .gnbMenu ul.family_list li:nth-child(3) {
    margin-bottom: 2rem;
}
#head #gnb > menu > li .gnbMenu ul.family_list li:last-child {
    padding-left: 0.5rem;
}
#head #gnb > menu > li .gnbMenu ul.family_list li:last-child {
    font-weight: bold;
}
#head #gnb > menu > li .gnbMenu ul.family_list li:last-child a {
    opacity: 1;
    font-weight: 200;
    margin-left: -2%;
    font-family: "noto-sans-scott", sans-serif;
}
#head #gnb > menu > li .gnbMenu ul.family_list li a {
    font-size: 1rem;
    opacity: 0.7;
}
a.project:before {
    width: 1.08rem;
    height: 0.77rem;
    margin-right: 0.5rem;
    background: url("../images/common/icon_project.png") no-repeat;
    background-size: cover;
    background-position: 100% center;
    display: inline-block;
    content: "";
    overflow: hidden;
}

#head .award_tag {
    position: fixed;
    bottom: 23%;
    right: 0;
    width: 35%;
    height: 101px;
    z-index: 10;
    background: url("../images/common/award_tag2018.png") no-repeat center right;
    background-size: contain;
}
#head .award_tag_leftbottom {
    display: block;
    width: 30.55vw;
    height: 9.72vw;
    max-width: 156px;
    max-height: 50px;
    position: fixed;
    top: auto;
    bottom: 24.3vw;
    left: 8.3vw;
    z-index: 10;
}
#head .award_tag_leftbottom.wannaone {
    background: url("../images/common/naward_tag2018_wannaone.png") no-repeat center left;
    background-size: contain;
}
#head .award_tag_leftbottom.sacademy {
    background: url("../images/common/naward_tag2018_sacademy.png") no-repeat center left;
    background-size: contain;
}
#head .award_tag_leftbottom.lg_nwm {
    background: url("../images/common/naward_tag2019_lg_nwm.png") no-repeat center left;
    background-size: contain;
}
#head .award_tag_leftbottom.sulwhasoo {
    background: url("../images/award/award_tag2019_sulwhasoo.png") no-repeat center left;
    background-size: contain;
}
#head .award_tag_leftbottom.kto {
    background: url("../images/award/award_tag2019_kto.png") no-repeat center left;
    background-size: contain;
}

.nav_logo {
    position: absolute;
    top: 4%;
    right: 7.1%;
    width: 19.2%;
    height: 50px;
    font-size: 0;
    z-index: 101;
}
.m_num {
    font-size: 0.5em;
    margin-right: 7%;
    font-family: "Roboto Condensed", sans-serif;
    vertical-align: top;
    line-height: 2;
    color: #fff !important;
    letter-spacing: 1px;
}
/*---------------------------------------------------------------------------------헤더 끝--------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------메인 본문-------------------------------------------------------------------------------*/
.container {
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
}
.container.overlay-open {
    -webkit-transform: translateX(140px);
    transform: translateX(140px);
    -webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s;
    transition: transform 0.5s, visibility 0s 0.5s;
}
.content {
    position: relative; /* overflow-x:hidden; */ /* height:100% */
}

.main #contents {
    position: relative;
    width: 100%;
    height: 100%;
}
.mainSlide.swiper-container {
    padding: 0;
    width: 100%;
    height: 100vh;
}
.mainSlide.swiper-container .swiper-slide > a,
.mainSlide.swiper-container .swiper-slide > a span {
    width: 100%;
    height: 100%;
    display: block;
}
.mainSlide.swiper-container .swiper-slide > a > span {
    position: relative;
    overflow: hidden;
}
.mainSlide.swiper-container .swiper-slide > a > span img {
    position: absolute;
    left: 0;
    top: 0;
    max-width: unset;
}
/*181227 추가*/
/*190222 어워드 관련 수정 .mainSlide.swiper-container dl {width:100%; position: fixed; top:46%; left:3%; padding:0 0 0 1rem; transform: translateY(-20%); z-index: 2;}/*award_tag관련 top:50%;*/
.mainSlide.swiper-container dl {
    width: 100%;
    position: fixed;
    top: 41.5vh;
    left: 3%;
    padding: 0 0 0 1rem;
    transform: translateY(-20%);
    z-index: 2;
}
.mainSlide.swiper-container h2 {
    font-size: 8vmin;
    color: #fff;
    letter-spacing: -1px;
}
.mainSlide.swiper-container dd span {
    display: inline;
}
.mainSlide.swiper-container dd {
    font-size: 1.2rem;
    color: #fff;
}
.mainSlide.swiper-container dd:first-of-type {
    margin: 0.5rem 0;
}
.mainSlide.swiper-container .loadbar {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100vw;
    height: 5px;
    background: #2b2b2b;
    z-index: 10;
}
.mainSlide.swiper-container .loadbar .loadbar_ani {
    width: 0;
    height: 100%;
    border-radius: 0;
    background: #fff;
    transform-origin: left center;
    display: none;
}
.mainSlide.swiper-container .loadbar .loadbar_ani.active {
    animation: width 1 5s linear;
    display: block;
}
/*181227 추가끝*/
/*190222 어워드 관련 수정 .mainSlide.swiper-container .swiper-button-next, .mainSlide.swiper-container .swiper-button-prev {top:calc(48% + 9.46rem);width:2.75rem; height:2.75rem}/*181217 award_tag관련 top:calc(50% + 9.46rem);*/
.mainSlide.swiper-container .swiper-button-next,
.mainSlide.swiper-container .swiper-button-prev {
    /*top:59.3vh;*/
    top: 62vh;
    width: 2.75rem;
    height: 2.75rem;
    outline: none;
}
.mainSlide.swiper-container .swiper-button-next {
    left: 5.3rem;
    background: url(../images/common/slide_next_w.png) no-repeat;
    background-size: 100% 100%;
    background-position: center;
}
.mainSlide.swiper-container .swiper-button-prev {
    left: 1.8rem;
    background: url(../images/common/slide_prev_w.png) no-repeat;
    background-size: 100% 100%;
    background-position: center;
}
/*190222 어워드 관련 수정 .mainSlide.swiper-container .swiper-pagination {left:1.6rem;top:calc(48% - 12.6rem);bottom:auto;width:3rem;font-size:1.4rem;color:#fff !important;transition:0s}/*181217 award_tag관련 top:calc(50% - 12.6rem);*/
.mainSlide.swiper-container .swiper-pagination {
    left: 1.6rem;
    top: 22.3vh;
    bottom: auto;
    width: 3rem;
    font-size: 3.3vh;
    color: #fff !important;
    transition: 0s;
}
.mainSlide.swiper-container .swiper-pagination span {
    color: #fff;
    display: block;
}
/*190222 어워드 관련 수정 .mainSlide.swiper-container .swiper-pagination span.swiper-pagination-current {font-size:2.3rem;color:#fff;font-weight:bold;overflow:hidden;transform:translateY(0%); opacity:1; transition:all, .5s;}/*181227 transform부터추가*/
.mainSlide.swiper-container .swiper-pagination span.swiper-pagination-current {
    font-size: 3.3vh;
    color: #fff;
    font-weight: bold;
    transform: translateY(0%);
    opacity: 1;
    transition: all, 0.5s;
}

.mainSlideEx.swiper-container {
    position: absolute;
    top: 46%;
    left: 3%;
    padding: 0 0 0 1rem;
    transform: translateY(-20%);
} /*181217 award_tag관련 top:50%;*/
.mainSlideEx.swiper-container .swiper-slide {
    height: 0;
    visibility: hidden;
}
.mainSlideEx.swiper-container .swiper-slide.swiper-slide-active {
    height: auto;
    visibility: visible;
}
.mainSlideEx.swiper-container .swiper-slide h2 {
    font-size: 9vmin;
    color: #fff;
    letter-spacing: -1px;
}
.mainSlideEx.swiper-container .swiper-slide dd {
    font-size: 1.2rem;
    color: #fff;
}
.mainSlideEx.swiper-container .swiper-slide dd:first-of-type {
    margin: 0.5rem 0;
}
.mainSlideEx.swiper-container + .swiper-pagination02 {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100vw;
    height: 5px;
    background: #2b2b2b;
    z-index: 10;
}
.mainSlideEx.swiper-container + .swiper-pagination02 .swiper-pagination-bullet {
    width: 100%;
    height: 100%;
    border-radius: 0;
    background: #fff;
    transform-origin: left center;
    display: none;
}
.mainSlideEx.swiper-container + .swiper-pagination02 .swiper-pagination-bullet.swiper-pagination-bullet-active {
    animation: width 1 5s linear;
    display: block;
}
@keyframes width {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}

/*190222 어워드 관련 수정 .swiper-pagination-total {font-size:1.2em;font-weight:300;margin:18% 0 0 -3%}*/
.swiper-pagination-total {
    font-size: 3.3vh;
    font-weight: 300;
    margin: 18% 0 0 -3%;
}
.c_name {
    font-weight: 300;
}
.c_type {
    font-weight: 600;
}

/*메인 푸터 아이콘*/
#foot {
    position: fixed;
    bottom: 1.5rem;
    left: 1.5rem;
    z-index: 10;
} /* 200128 화 snsMenu 수정 원래 bottom:2rem;left:2rem; */
#foot #snsMenu menu:after {
    clear: both;
    display: block;
    content: "";
}
#foot #snsMenu menu li {
    float: left;
}
/* 200128 화 snsMenu 수정
#foot #snsMenu menu li:not(:last-child) {margin-right:2.2rem}
#foot #snsMenu menu li a {width:1.5rem;height:1.5rem;text-indent:-9999px;background-position:center;background-repeat:no-repeat;display:block}
#foot #snsMenu menu li:first-child a {background-image:url(../images/common/icon_fb_w.png);background-size:auto 100%}
#foot #snsMenu menu li:nth-child(2) a {background-image:url(../images/common/icon_insta_w.png);background-size:100% auto}
#foot #snsMenu menu li:nth-child(3) a {background-image:url(../images/common/icon_blog_w.png);background-size:auto 100%}
#foot #snsMenu menu li:last-child a {background-image:url(../images/common/icon_yb_w.png);background-size:100% auto} */
#foot #snsMenu menu li:not(:last-child) {
    margin-right: 1.2rem;
}
#foot #snsMenu menu li a {
    width: 2.5rem;
    height: 2.5rem;
    text-indent: -9999px;
    display: block;
    position: relative;
}
#foot #snsMenu menu li a span {
    width: 1.5rem;
    height: 1.5rem;
    background-position: center;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
/* 220215 순서 변경, 클레스 추가해서 변경 */
#foot #snsMenu menu li .sns_fb {
    background-image: url(../images/common/icon_fb_w.png);
    background-size: contain;
}
#foot #snsMenu menu li .sns_is {
    background-image: url(../images/common/icon_insta_w.png);
    background-size: contain;
}
#foot #snsMenu menu li .sns_bl {
    background-image: url(../images/common/icon_blog_w.png);
    background-size: contain;
}
#foot #snsMenu menu li .sns_yb {
    background-image: url(../images/common/icon_yb_w.png);
    background-size: contain;
}
#foot .project-request {
    position: fixed;
    bottom: -1%;
    right: 2.5rem;
    z-index: 10;
    transform: rotate(90deg);
    transform-origin: right center;
    width: 33%;
    height: 5%;
    padding-top: 1%;
}
#foot .project-request a {
    color: #fff;
    display: block;
    font-size: 0.8em;
    width: 100%;
    height: 100%; /*     padding-top: 8px; */
}
#foot .project-request a.project:before {
    background-position: 100% center;
}
/*--------------------------------------------------------------------------------메인 본문 끝--------------------------------------------------------------------*/

/*--------------------------------------------------------------------------about 페이지-------------------------------------------------------------------------*/
#about {
    overflow: hidden;
    z-index: 200;
    background: #fff;
}
#about .btn_profile {
    display: block;
    width: 50%;
    margin: 8% auto 0;
    padding: 4vw 0;
    border: 1px solid #666;
    line-height: 1;
    font-size: 3.8vw;
}
.act {
    display: block;
}
#about #about_section01 {
    width: 100%; /* height:75vw; */
    height: auto;
    margin-top: 24%;
}

/* #about #about_section01 > img {width:100%} */
/*추가*/
#about #about_section02 {
    width: 100%; /* height:470px; */
    text-align: center;
    position: relative;
}
#about #about_section02 .sc02_sub {
    width: 100%;
    height: auto;
    text-align: center; /* position:absolute;left:0%;top:0; */
    display: block;
}

#about #about_section02 .section02_s_tit {
    /* width:50%;height:50px;margin:16px auto; */
    font-family: "Roboto", sans-serif;
    font-size: 4vw;
    line-height: 45px;
    /* letter-spacing: -2px;  */ /* padding-left:5% */
    margin-top: 5%;
}
#about #about_section02 .section02_tit {
    width: 100%;
    height: auto;
    margin: 3px auto;
    font-family: "Roboto", sans-serif;
    font-size: 6vw;
    letter-spacing: 0px;
    text-transform: uppercase;
}
#about #about_section02 .section02_txt {
    width: 100%;
    height: auto;
    padding-bottom: 7.5%;
    font-family: "noto-sans-scott", sans-serif;
}
#about #about_section02 .section02_txt .sc02_tit {
    font-size: 6vw;
    padding-top: 23px;
    font-weight: 200;
}
#about #about_section02 .section02_txt .sc02_tit_02 {
    margin-top: 20px;
    font-size: 3.5vw;
    color: #a6a6a6;
    font-weight: 200;
}
#about #about_section02 .section02_txt .sc02_tit_03 {
    font-size: 3.5vw;
    color: #a6a6a6;
    letter-spacing: -1px;
    line-height: 1.5;
    font-weight: 200;
}
#about #about_section02 .section02_txt .sc02_tit_04 {
    font-size: 4.5vw;
    color: #666666;
    letter-spacing: -2px;
    line-height: 1.5;
}

#about #about_section03 {
    width: 100%;
    height: auto;
    position: relative;
}
#about #about_section03 .sc_03_img {
    width: 95%; /* height:63vw; */
    margin: 0 auto;
}
#about #about_section03 .sc_03_img > img {
    /* position:absolute;right:0%;top:0; */
}
#about #about_section03 .section03_txt {
    width: 100%; /* height:250px; */
    padding-bottom: 10vw;
    text-align: center;
    font-family: "noto-sans-scott", sans-serif;
}
#about #about_section03 .section03_txt .sc03_tit {
    font-size: 6vw;
    padding-top: 40px;
    padding-bottom: 20p;
    font-weight: 200;
    margin-bottom: 20px;
}
#about #about_section03 .section03_txt .sc03_tit_02 {
    /* margin-top: 20px; */
    font-size: 3.5vw;
    color: #a6a6a6;
    font-weight: 200;
}
#about #about_section03 .section03_txt .sc03_tit_03 {
    font-size: 3.5vw;
    color: #a6a6a6;
    letter-spacing: -1px;
    font-weight: 200;
    line-height: 1.5;
}
#about #about_section04,
#about #about_section05 {
    width: 100%;
    height: auto;
    font-family: "noto-sans-scott", sans-serif;
    position: relative;
}
#about #about_section04 iframe {
    display: block;
}

#about .about_slider_wrap {
    width: 100%;
    max-width: 1920px;
    position: relative;
    margin: 10vw auto 0;
}
#about .aboutSldCont {
    width: 100%;
}
#about .aboutSldWrp {
}
#about .aboutSld {
    width: 100%;
}
#about .aboutSldImg {
    display: block;
    width: 100%;
}
#about .swiper-button-prev,
#about .swiper-button-next {
    width: 30px;
    height: 50px;
    margin-top: -25px;
    background-size: 40px;
}
#about .swiper-button-next,
#about .swiper-container-rtl .swiper-button-prev {
    right: 10px;
    background-image: url("../images/about/aboutSldBtnNext.svg?v=0");
    background-position: -12px center;
}
#about .swiper-button-prev,
#about .swiper-container-rtl .swiper-button-next {
    left: 10px;
    background-image: url("../images/about/aboutSldBtnPrev.svg?v=0");
    background-position: 4px center;
}

#about_section05 .sc05_txt {
    width: 80%; /* height:130px; */
    margin: 0 auto;
    text-align: center;
    padding: 4% 0 10% 0;
}
#about_section05 .sc05_txt .sc05_tit {
    letter-spacing: 0px;
    padding-top: 30px;
    font-size: 4vw;
}
#about_section05 .sc05_txt .sc05_mid {
    font-size: 6vw;
    margin-top: 7px;
    letter-spacing: -1px;
    color: #333;
    font-weight: 200;
}
#about_section05 .sc05_txt .sc05_bot {
    margin-top: 10px;
    letter-spacing: -1px;
    font-size: 3.5vw;
    color: #a6a6a6;
    font-weight: 200;
}
#about_section05 .sc05_obj {
    width: 88%; /* height:200px; */
    margin: 15px auto;
}
#about_section05 .sc05_obj .sc05_obj_01 {
    width: 100%; /* height:200px */
    padding-bottom: 40px;
    height: auto;
}
#about_section05 .sc05_obj .sc05_obj_01:after {
    clear: both;
    display: block;
    content: "";
}
#about_section05 .sc05_obj .sc05_obj_01 .obj_left {
    width: 50%;
    height: 100%;
    float: left;
}
#about_section05 .sc05_obj .sc05_obj_01 .obj_right {
    width: 50%;
    height: 100%;
    float: left;
    padding-left: 7%;
}
.obj_tit {
    font-size: 4.48vw;
    color: #39bcbd;
    letter-spacing: 0px;
    font-weight: 500;
}
.obj_mid {
    margin-top: 20px;
    color: #a6a6a6;
    font-size: 3.2vw;
    line-height: 1.5;
    font-weight: 200;
    letter-spacing: -1px;
}
.obj_bot {
    margin-top: 20px;
    letter-spacing: -0.5px;
    line-height: 20px;
}
#about_section05 .logo_n {
    width: 35%;
    height: auto;
    position: absolute;
    bottom: 1%;
    right: 0;
}
#about #about_section06 {
    width: 100%;
    height: 166vw;
    background: #262626;
    margin-top: 10%;
    position: relative;
}
#about #about_section06 .sc06_img {
    width: 95%;
    height: 63vw;
    margin: 0 auto;
    background: url("../images/about/sc06_bg.jpg") no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: -5%;
    left: 2.7%;
}
#about #about_section06 .sc06_txt {
    width: 100%; /* height:586px; */
    color: #fff;
    text-align: center;
    padding-top: 53.5%;
}
#about #about_section06 .sc06_txt .sc06_tit {
    font-size: 4vw;
    margin-top: 12%;
    font-family: "Roboto", sans-serif;
    letter-spacing: 0px;
}
#about #about_section06 .sc06_txt .sc06_tit > span {
    font-weight: bold;
}
#about #about_section06 .sc06_txt .sc06_tit_02 {
    font-size: 6vw;
    margin-top: 8%;
    letter-spacing: -1px /* font-family: 'noto-sans-scott', sans-serif; */;
    font-weight: 150;
}
#about #about_section06 .sc06_txt .sc06_tit_03 {
    margin-top: 9%;
    font-size: 3.3vw;
    letter-spacing: -1px;
    line-height: 1.65;
}
#about #about_section07 {
    width: 100%;
    height: auto;
}
#about #about_section07 .sc07_txt {
    width: 100%; /* height:130px; */
    padding-bottom: 30px;
    text-align: center;
    box-sizing: border-box;
    padding-top: 10%;
}
#about #about_section07 .sc07_tit {
    letter-spacing: 0px;
    font-size: 4vw;
}
#about #about_section07 .sc07_tit > span {
    font-weight: bold;
}
#about #about_section07 .sc07_tit_02 {
    margin-top: 2%;
    color: #555;
    letter-spacing: -1px;
    font-size: 6vw;
    font-weight: 200;
}
#about #about_section07 .sc07_tit_03 {
    color: #a6a6a6;
    margin-top: 2%;
    letter-spacing: -2px;
    font-size: 3.4vw;
}
#about #about_section07 .sc07_img {
    width: 100%; /* height:97vw; */ /* background:url('../images/about/about_client02.jpg')no-repeat; */
    background-size: 100% 100%;
}
#about #about_section07 .sc07_img .sc07_img_sub {
    width: 100%;
    height: auto;
}
#about #about_section08,
#about #about_section09 {
    width: 100%;
    height: auto;
}
#about #about_section10 {
    width: 100%;
    height: auto;
    margin-bottom: 20%;
}
/*--------------------------------------------------------------------------about 페이지 끝-----------------------------------------------------------------------*/

/*------------------------------------------------------------------------------portfolio 페이지-------------------------------------------------------------------*/
#portfolio {
    background: #fff;
    z-index: 200;
}

#portfolio .loader_wrap {
    width: 100%;
    height: 100vh;
    position: fixed;
}
#portfolio .loader_wrap .loader {
    position: absolute;
    width: 100px;
    height: 100px; /*box-sizing:border-box;*/
    left: 50%;
    top: 50%;
    z-index: 1;
    margin-left: -50px;
    margin-top: -50px;
    border: 2px solid #e5e5e5;
    border-radius: 50%;
    border-top: 2px solid #5c5c5c;
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform-origin: center center;
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform-origin: center center;
    }
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
#portfolio .loader_wrap .loader_txt {
    position: absolute;
    width: 100px;
    height: 100px;
    left: 50%;
    top: 50%;
    z-index: 1;
    margin-left: -50px;
    margin-top: -50px;
    line-height: 100px;
    text-align: center;
    font-size: 18px;
    font-family: "Roboto", sans-serif;
    -webkit-transform: scaleX(0.9);
    -moz-transform: scaleX(0.9);
    transform: scaleX(0.9);
    transform-origin: center center;
    font-weight: 600;
}

#portfolio .portfolio_list {
    width: 100%;
    max-width: 570px;
    margin: 0 auto;
    padding: 25% 0%;
}
#portfolio .portfolio_list .item {
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 0;
    margin-bottom: 16%;
    padding-bottom: 100%;
}
#portfolio .portfolio_list .item a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}
#portfolio .portfolio_list .item .thumb {
}
#portfolio .portfolio_list .item .cont {
    margin: 1% 0 0;
    font-family: "noto-sans-scott", sans-serif;
    font-weight: 200;
    text-transform: uppercase;
}
#portfolio .portfolio_list .item .cont .title {
    font-size: 1.5em;
    font-weight: 500;
    letter-spacing: -1px;
}
#portfolio .portfolio_list .item .cont .type {
    z-index: 10;
}
#portfolio .portfolio_list .item .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0;
    z-index: 10;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
}
#portfolio .portfolio_list .item .back_box {
    /* width:100%;height:96vw; */
    position: absolute;
    left: 0;
    bottom: 0;
    top: 0;
    right: 0;
    z-index: 2;
    -webkit-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 50%;
    opacity: 0;
    animation-delay: 0.8s;
    overflow: hidden;
}
#portfolio .portfolio_list .item .list_box {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1; /* top:413px; */
    -webkit-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1); /* background:#ddd url('../images/portfolio_02.png')no-repeat -43px -6px;background-size: 146% 105%; */ /* width: 100%;height: 96vw; */
    border-radius: 50%;
    overflow: hidden;
}
#portfolio .portfolio_list .item .list_box img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    max-width: none;
    height: 100%;
    transform: translate(-50%, -50%) scale(1);
    transition: all 0.5s;
}
#portfolio .portfolio_list .item.fadeInUp .list_box img {
    -webkit-animation-name: scIn;
    -moz-animation-name: scIn;
    -o-animation-name: scIn;
    animation-name: scIn;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}
#portfolio .portfolio_list .item .list_box.active {
    top: 0;
}
#portfolio .portfolio_list .item.active .back_box {
    height: 100%;
}
#portfolio .portfolio_list .item.active .back_box.active {
    height: 0;
    top: 0;
}
#portfolio .portfolio_list .item.active .img_box .thumb_layer {
    opacity: 0.45;
}
#portfolio .portfolio_list .odd {
    margin-left: -11%;
}

#portfolio .portfolio_list .item .cont.active {
    transform: translateX(0);
    transition: all, 0.8s;
}
#portfolio .portfolio_list .even .cont {
    text-align: left; /* transform:translateX(100%); */
    position: absolute;
    bottom: 4%;
    left: 0;
    z-index: 20;
}
#portfolio .portfolio_list .odd .cont {
    text-align: right; /* transform:translateX(-100%); */
    position: absolute;
    bottom: 4%;
    right: 0;
    z-index: 20;
}
#portfolio .portfolio_list .item.even.hidden {
    opacity: 0;
}
#portfolio .portfolio_list .item.odd.hidden {
    opacity: 0;
}
#portfolio .portfolio_list .item.even {
    opacity: 0;
}
#portfolio .portfolio_list .item.odd {
    opacity: 0;
}
#portfolio .portfolio_list .even {
    margin-left: 11%;
}

#portfolio .portfolio_view {
}
#portfolio .portfolio_view .position {
    position: absolute;
    top: 8%;
    left: 0;
    width: 1px;
    height: 1px;
}
#portfolio .portfolio_view .view_content {
    padding-bottom: 20%;
}
/* 추가02 */
#portfolio .portfolio_view .view_content .view_visual {
    position: relative; /*padding-top:168%;*/ /*padding:99% 6.9% 0*/ /* padding: 166% 6% 0% 6%; */
    z-index: 80;
    opacity: 0;
    transition: opacity 1.3s;
    overflow: hidden;
}
#portfolio .portfolio_view .view_content .view_visual:before {
    content: "";
    display: block;
    width: 100%;
    padding-top: 168%;
    position: relative;
}
/* 추가02 */
#portfolio .portfolio_view .view_content .view_visual.on {
    opacity: 1;
}
/* 추가02 */
#portfolio .portfolio_view .view_content .view_visual .visual_img {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    padding-top: 168%;
    overflow: hidden;
}

/* 추가02 */
/* #portfolio .portfolio_view .view_content .view_visual .visual_img:after {position:absolute; top:0; left:0; width:100%; height:100%; display:block; content:""; border-top:0 solid #fff; border-right:0 solid #fff; border-left:0 solid #fff; transition:all, 1.3s; transition-delay:0.8s;} */
/* 추가02 */
/* #portfolio .portfolio_view .view_content .view_visual .visual_img.on:after {border-top:88px solid #fff; border-right:25px solid #fff; border-left:25px solid #fff; } */

/* 추가02 */
#portfolio .portfolio_view .view_content .view_visual .visual_img img {
    position: absolute;
    top: 3.4%;
    left: 0;
    width: 100%;
}
#portfolio .portfolio_view .view_content .view_visual .visual_img img:nth-child(3) {
    /* transform:scale(2);  */
    transform: scale(1.1, 1.7);
    transition: all, 1.3s;
} /*default scale(1.35,2);*/
#portfolio .portfolio_view .view_content .view_visual .visual_img.on img:nth-child(3) {
    transform: scale(1);
}
#portfolio .portfolio_view .view_content .view_visual .visual_cont {
    position: absolute;
    top: 64%;
    left: 9%;
    display: table;
    vertical-align: middle;
    text-align: left; /* padding:111% 0 0 13%; */
    text-transform: uppercase;
    color: #fff;
}
#portfolio .portfolio_view .view_content .view_visual .visual_cont .title {
    margin-bottom: 2%; /*font-size:1.7em; color:#262626; */
    letter-spacing: -3px;
    -webkit-transform: scaleX(0.9);
    -moz-transform: scaleX(0.9);
    transform: scaleX(0.9);
    transform-origin: top left;
    font-size: 9vmin;
}
#portfolio .portfolio_view .view_content .view_visual .visual_cont .desc {
    /* font-size:1.1em; */
    letter-spacing: -1px;
    font-size: 4.3vmin;
}
#portfolio .portfolio_view .view_content .view_visual .visual_cont .desc .client {
    display: inline-block;
    font-weight: 300;
}
/* .client02 {padding-left:5%} */
#portfolio .portfolio_view .view_content .view_visual .visual_cont .desc .type {
    display: inline-block;
    font-weight: 700;
}
#portfolio .portfolio_view .view_content .view_detail {
    margin-top: 10vw;
    overflow: hidden;
    background: #fff;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info {
    /* margin:10% 6.9% 10% */
    margin: 0% 6.9% 11%;
    overflow: hidden;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table {
    width: 100%;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td {
    padding: 0 0 1%; /* font-size:0.9em; */
    font-size: 1em;
    color: #848484;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.logo {
    vertical-align: top; /* padding-top:2px */
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.logo img {
    width: 90%;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.client {
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.client02 {
    padding-left: 5%;
    line-height: 1.3;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.type {
    text-transform: uppercase;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.share {
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.desc {
    padding: 10% 0 9%; /* font-size:1em; */
    font-size: 4vw;
    color: #666666;
    letter-spacing: -1px;
    font-weight: 400;
    line-height: 1.7em;
    text-align: justify;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.share a {
    display: inline-block; /*width:5%;*/
    margin: 0 0 0 3.5%;
    vertical-align: bottom;
}
.share_fb > img {
    width: 89%;
}
.share_tw > img {
    width: 76%;
    margin-left: 14%;
}
.share_p > img {
    width: 70%;
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.link {
}
#portfolio .portfolio_view .view_content .view_detail .detail_info table td.link .btn_link {
    position: relative;
    display: block;
    width: 60%;
    height: 46px;
    border: 2px solid #636363;
    font-size: 4vw; /*color:#636363;*/
    line-height: 42px;
    text-align: center;
    z-index: 1;
    transition: 0.3s ease all;
    margin: 0 auto;
}
.btn_link:hover {
    boder: 0;
    color: #fff;
    background: #636363;
}
.btn_link:visited {
    boder: 1px solid #636363;
    color: #636363;
    background: #fff;
}

#portfolio .portfolio_view .view_content .view_detail .detail_cont {
    /* margin:0 6.9%; */
    font-family: "noto-sans-scott", sans-serif;
    text-align: center;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_title {
    padding: 0 1% 5%; /* font-size:1.5em; */
    color: #2b2b2b;
    letter-spacing: -1.5px;
    font-size: 5.5vw;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_subtitle {
    padding: 8% 1%; /* font-size:1.5em; */
    color: #2b2b2b;
    letter-spacing: -1.5px;
    font-size: 4vw;
}
/* 추가02 */
#portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_cont_box {
    padding: 3% 6.9% 10%;
    font-size: 3.7vw;
    color: #666666;
    line-height: 1.7em;
    letter-spacing: -1.2px;
    font-weight: 200;
    text-align: justify;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_img {
    position: relative;
    overflow: hidden;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_play {
    position: relative;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_play .btn_play {
    position: absolute;
    top: 43%;
    left: 50%;
    width: 9.3%;
    margin: 0 0 0 -4.65px;
    opacity: 0.7;
    -webkit-animation: playani 3s ease-out;
    -moz-animation: playani 3s ease-out;
    animation: playani 3s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .player {
    display: none;
    position: absolute;
    top: 17%;
    left: 50%;
    width: 80%;
    height: 60%;
    margin-left: -40%;
    z-index: 210;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .player iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .player .btn_close {
    position: absolute;
    top: -25px;
    right: -25px;
    width: 7%;
}
#portfolio .portfolio_view .view_content .view_detail .detail_cont .player.active {
    display: block;
}

/*푸터 애니메이션*/
.btn_play02 {
    position: absolute;
    top: 108%;
    left: 6%;
    width: 32px;
    height: 88px; /* margin:-70px 0 0 -90.5px; */
    opacity: 0.7;
    -webkit-animation: playani 3s ease-out;
    -moz-animation: playani 3s ease-out;
    animation: playani 3s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    z-index: 50;
}

/*포트폴리오 상세페이지 삼성*/
.effect {
    width: 100%;
    height: auto;
    box-sizing: border-box;
}
.effect .effect_tit01 {
    width: 100%;
    height: auto;
    font-size: 4vw;
    padding-top: 10vw;
    font-weight: 600;
    letter-spacing: 1px;
}
.effect .effect_tit02 {
    width: 100%;
    height: auto;
    font-size: 5.3vw;
    letter-spacing: 1px;
    font-weight: 300;
    margin-top: 2%;
}
.effect .effect_tit03 {
    width: 100%;
    height: auto;
    font-size: 3.7vw;
    letter-spacing: -1px;
    font-weight: 300;
    margin-top: 2%;
    margin-bottom: 10%;
    line-height: 1.7;
    color: #666;
}

.effect .mini01_tit {
    width: 100%;
    height: auto;
    font-size: 5.2vw;
    letter-spacing: -1px;
    font-weight: 500;
    margin: 15% 0 5% 0;
    color: #000;
}
.effect .mini01_tit02 {
    width: 100%;
    height: auto;
    line-height: 1.7;
    color: #666;
    font-size: 3.8vw;
    font-weight: 200;
    margin: 3% auto;
}
.effect .mini01_tit02 > img {
    margin-top: 8%;
}
.effect .mini01_tit02 > span {
    letter-spacing: -1px;
}

/*추가*/
.event_bt .left_bt {
    display: block;
    width: 48%;
    height: auto;
    float: left;
}
.event_bt .right_bt {
    display: block;
    width: 48%;
    height: auto;
    float: right;
}

/*스크롤 추가*/
/* 추가02 */
.scroll-indicator {
    position: fixed;
    left: 50%;
    bottom: 0;
    z-index: 100;
    display: inline-block; /* height:200px; */
    height: 93px;
    width: 50px;
    min-height: 30px;
    font-weight: bold;
    font-style: normal;
    color: #fff;
    font-size: 16px;
}
.scroll-indicator .border-grey {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
    width: 2px;
    height: 100%;
    background: #333;
    overflow: hidden;
}
.scroll-indicator .border-grey .border {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 200;
    width: 3px;
    height: 100%;
    background: #ffffff;
    -webkit-animation: scrollani 1.8s linear;
    -moz-animation: scrollani 1.8s linear;
    animation: scrollani 1.8s linear;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    transform: translateY(-100%);
}
.scroll-indicator em {
    /* width:32%; */
    width: 100%;
    font-size: 14px;
    display: inline-block;
    font-style: normal;
    position: absolute;
    left: 18%;
    top: -2%;
    color: #fff;
}

/*어워드 태그 추가*/
.award_tag_leftbottom {
    position: absolute;
    top: 78%;
    left: 9%;
    width: 30.55vw;
    height: 9.72vw;
    z-index: 100;
}
/*각페이지 t스타일에서 배경추가하기 ex) .award_tag_leftbottom {background:url("./images/common/naward_tag2018_wannaone.png") no-repeat center left; background-size:contain;}*/

#m_footer .bg_link {
    display: block;
    width: 100%;
    height: 100%;
    z-index: 130;
    position: absolute;
    top: 0;
    left: 0;
}

#portfolio_list {
    width: 100%;
    height: 101vw; /* background:#ddd; */
    position: relative;
}

/*탑링크 버튼*/
.hv {
    width: 60px;
    height: 60px;
    color: #fff;
    background: #333;
    font-size: 35px;
    cursor: pointer;
    position: absolute;
    top: -1px;
    right: 0px;
    z-index: 999;
    overflow: hidden;
}
.hv > a {
    width: 100%;
    height: 100%;
    display: block;
}
.up_arrow {
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 66px;
    transition: all, 0.5s;
    color: #fff;
    font-family: "돋움", sans-serif;
}
.hv:hover .up_arrow {
    transform: translateY(-100%);
}
.sc_arrow {
    position: absolute;
    top: 60px;
    right: 16px;
}

.pf_list_bt {
    width: 55%;
    height: auto;
    position: absolute;
    top: 29%;
    left: 23%;
}
.pf_list_bt_a {
    display: block;
    width: 100%;
    height: 57px;
    text-align: center;
    line-height: 57px;
    font-size: 5vw;
    padding-left: 2%;
    border-top: 1.5px solid #2b2b2b;
    border-bottom: 1.5px solid #2b2b2b;
}
/* .pf_list_bt_a > img {width:200px }*/

.pf_icon_list {
    width: 67%;
    height: 40px;
    position: absolute;
    top: 58%;
    left: 19%;
}
.pf_icon_list > ul {
}
.pf_icon_list > ul > li {
    float: left;
    width: 9.333333333vw;
    height: 8.266666667vw; /* width:35px;height:31px;margin-right:8% */
}
.pf_icon_list > ul > li:nth-child(1),
.pf_icon_list > ul > li:nth-child(2),
.pf_icon_list > ul > li:nth-child(3) {
    margin-right: 13%;
}
.pf_icon_list > ul > li > a {
    display: block;
    width: 100%;
    height: 100%;
}
.pf_icon_list > ul > li > a > img {
    /* width:73% */
    width: 65%;
}
/* .pf_icon_list > ul > li > a > img:nth-child(4) {width:93% ! important} */

.pf_copy {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 12%;
    left: 0%;
    text-align: center;
    font-size: 3.4vw;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0;
}

.ic.arrow_w {
    background: url(../images/common/icon_arrow.png);
    background-position: 0 0;
    background-repeat: no-repeat;
}
.ic {
    display: inline-block;
    position: absolute;
    top: 48%;
    right: 20px;
    width: 8px;
    height: 15px;
    margin-top: -7.5px;
    line-height: 13px;
}

/* 스크롤 애니메이션 */
@keyframes scrollani {
    0% {
        transform: translateY(-100%);
    }
    100% {
        transform: translateY(0%);
    }
}
@-webkit-keyframes scrollani {
    0% {
        transform: translateY(-100%);
    }
    100% {
        transform: translateY(0%);
    }
}
@-moz-keyframes scrollani {
    0% {
        transform: translateY(-100%);
    }
    100% {
        transform: translateY(0%);
    }
}

@media screen and (orientation: landscape) {
    .mainSlide.swiper-container .swiper-pagination {
        top: calc(50% - 6.5rem);
        font-size: 1.2rem;
    }
    .mainSlide.swiper-container .swiper-pagination span.swiper-pagination-current {
        font-size: 1.7rem;
    }
    #head .subNum {
        top: 2rem;
        left: 6rem;
    }
}
/*------------------------------------------------------------------------------portfolio 페이지 끝----------------------------------------------------------------------*/

/*----------------------------------------------------------------------------news 페이지-------------------------------------------------------------------------------*/
#news {
    background: #fff;
    overflow: hidden;
    z-index: 200;
}
#news .news_pdt {
    height: 30vw;
    max-height: 120px;
}
#news .hidden-scroll {
    margin-top: 0;
}
#news .news_list {
    padding: 25% 6.9%;
}

/*뉴스 tab*/
#tabName {
    position: relative;
    width: 100%;
    height: auto;
    padding-top: 4rem;
    margin-top: 25%;
}
#tabName h1 {
    width: 20.1%;
    height: 4rem;
    font-size: 1rem;
    text-align: center;
    display: table;
}
#tabName h1.on {
    /* background-color:green !important */
}
#tabName h1.on a {
    /* color:red; */
    color: #000;
    font-weight: bold;
}
#tabName h1 a {
    width: 100%;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
}
#tabName h1:first-of-type {
    position: absolute;
    top: 0;
    left: 0; /*  background-color:yellowgreen; */
}
#tabName h1:nth-of-type(2) {
    position: absolute;
    top: 0;
    left: 20%; /*  background-color:yellowgreen; */
}
#tabName h1:nth-of-type(3) {
    position: absolute;
    top: 0;
    left: 40%; /*  background-color:yellowgreen; */
}
#tabName h1:nth-of-type(4) {
    position: absolute;
    top: 0;
    left: 60%; /*  background-color:yellowgreen; */
}
#tabName h1:last-of-type {
    position: absolute;
    top: 0;
    left: 80%; /*  background-color:yellowgreen; */
}
.blind {
    width: 0;
    height: 0;
    overflow: hidden;
}
.tabCont ul {
    width: 86%;
    height: auto;
    margin: 0 auto;
}
.tabCont ul li {
    width: 100%;
    height: auto; /* background:#ddd */
    margin-bottom: 18%;
}
.tabCont ul li a {
    width: 100%;
    height: 100%;
    display: block;
}
.news_arti {
    width: 100%;
    height: auto;
    margin-top: 5%; /* background:green; */
}
.news_arti .news_tit {
    font-size: 5.7vw;
    font-weight: 500;
    padding-bottom: 5px;
    line-height: 1.3;
}
.news_arti .news_sub {
    font-weight: 200;
    margin-top: 5px;
    letter-spacing: -1px;
    line-height: 1.5;
    font-size: 3.4vw;
}
.news_arti .news_date {
    margin-top: 5%;
    font-weight: 200;
}
.news_align_lf {
    text-align: left;
}
.news_align_rt {
    text-align: right;
}
/*//뉴스 tab*/

/* 뉴스 스와이퍼 */
.slick-slider {
    position: relative;
    display: block;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.slick-list:focus {
    outline: none;
}
.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
}
.slick-track:before,
.slick-track:after {
    display: table;
    content: "";
}
.slick-track:after {
    clear: both;
}
.slick-loading .slick-track {
    visibility: hidden;
}
.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}
[dir="rtl"] .slick-slide {
    float: right;
}
.slick-slide img {
    display: block;
}
.slick-slide.slick-loading img {
    display: none;
}
.slick-slide.dragging img {
    pointer-events: none;
}
.slick-initialized .slick-slide {
    display: block;
}
.slick-loading .slick-slide {
    visibility: hidden;
}
.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}

.slick-initialized .swipe-tab-content {
    position: relative;
    min-height: 365px;
}
@media screen and (min-width: 767px) {
    .slick-initialized .swipe-tab-content {
        min-height: 500px;
    }
}
.slick-initialized .swipe-tab {
    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: 50px;
    background: none;
    border: 0;
    color: #757575;
    cursor: pointer;
    text-align: center;
    border-bottom: 2px solid rgba(0, 0, 0, 0);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.slick-initialized .swipe-tab:hover {
    color: #000;
}
.slick-initialized .swipe-tab.active-tab {
    border-bottom-color: #000;
    color: #000;
    font-weight: bold;
}
.main-container {
    width: 100%;
    height: auto;
    padding: 25px; /* background: #f1f1f1 */
}

.sub-container {
    width: 100%;
    height: 3rem;
    margin-top: 26%;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
}
.sub-header.swiper-container {
    width: 100%;
    height: 100%;
    overflow: visible;
}
.sub-header.swiper-container .swiper-button-prev,
.sub-header.swiper-container .swiper-button-next {
    top: 50%;
    transform: translateY(-50%);
    width: 3rem;
    height: 100%;
    margin-top: 0;
}
.sub-header.swiper-container .swiper-wrapper {
    /* width:80%; */ /* padding:0 3rem; */
}
.sub-header.swiper-container .swiper-wrapper .swiper-slide {
    width: auto;
    text-align: center;
    line-height: 3rem;
    color: #e6e6e6;
}
.sub-header.swiper-container .swiper-wrapper .swiper-slide.on {
    color: #888;
}
.sub-header.swiper-container .swiper-button-prev {
    left: -2%;

    background-image: url(../images/ico_angle05.png) /*, -webkit-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle05.png) /*, -ms-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle05.png) /*, linear-gradient(#ffffff, #fafafa)*/;

    /*-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border-color:#e6e6e6;
	border-width:1px;
	border-style:solid;*/

    background-repeat: no-repeat;
    background-size: 19% auto, 100% 100%;
    background-position: center;
}

.sub-header.swiper-container .swiper-button-next {
    right: -2%;

    background-image: url(../images/ico_angle06.png) /*, -webkit-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle06.png) /*, -ms-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle06.png) /*, linear-gradient(#ffffff, #fafafa)*/;

    /*-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border-color:#e6e6e6;
	border-width:1px;
	border-style:solid;*/

    background-repeat: no-repeat;
    background-size: 19% auto, 100% 100%;
    background-position: center;
}
.sub-header.swiper-container .swiper-button-prev.swiper-button-disabled,
.sub-header.swiper-container .swiper-button-next.swiper-button-disabled {
    opacity: 0;
}

.main-container.swiper-container .swiper-slide {
    height: 0;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.4s;
}
.main-container.swiper-container .swiper-slide.swiper-slide-active {
    height: auto;
    visibility: visible;
    opacity: 1 !important;
}
/* //뉴스 스와이퍼 */

/*뉴스 탑링크 버튼*/
.hv02 {
    width: 60px;
    height: 60px;
    color: #fff;
    background: #333;
    font-size: 35px;
    cursor: pointer;
    position: fixed;
    bottom: 0px;
    right: 0px;
    z-index: 200;
    overflow: hidden;
}
.hv02 > a {
    width: 100%;
    height: 100%;
    display: block;
}
.up_arrow02 {
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 66px;
    transition: all, 0.5s;
    color: #fff;
    font-family: "돋움", sans-serif;
}
.hv02:hover .up_arrow02 {
    transform: translateY(-100%);
}
.sc_arrow02 {
    position: absolute;
    top: 60px;
    right: 18px;
}

/* 스와이퍼  버튼 */
.main-container {
    overflow: visible;
    z-index: 20;
}
.main-container .swiper-button-prev,
.main-container .swiper-button-next {
    position: absolute;
    top: -3rem;
    margin: 0;
    width: 3rem;
    height: 3rem;
    z-index: 100;
}
.main-container .swiper-button-prev {
    left: -2%;
    background-image: url(../images/ico_angle05.png) /*, -webkit-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle05.png) /*, -ms-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle05.png) /*, linear-gradient(#ffffff, #fafafa)*/;
    /* -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border-color: #e6e6e6;
    border-width: 1px;
    border-style: solid;*/
    background-repeat: no-repeat;
    background-size: 19% auto, 100% 100%;
    background-position: center;
}
.main-container .swiper-button-next {
    right: -2%;
    background-image: url(../images/ico_angle06.png) /*, -webkit-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle06.png) /*, -ms-linear-gradient(#ffffff, #fafafa)*/;
    background-image: url(../images/ico_angle06.png) /*, linear-gradient(#ffffff, #fafafa)*/;
    /*-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border-color: #e6e6e6;
    border-width: 1px;
    border-style: solid;*/
    background-repeat: no-repeat;
    background-size: 19% auto, 100% 100%;
    background-position: center;
}
.main-container .swiper-button-prev.swiper-button-disabled,
.main-container .swiper-button-next.swiper-button-disabled {
    opacity: 1;
}
.hidden-scroll {
    position: relative;
    width: 100%;
    height: 3rem;
    margin-top: 30%;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    overflow: hidden;
} /*181005 수정 margin-top:35%->30%*/
.swiper02-pgnv {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    overflow-x: scroll;
    white-space: nowrap;
    z-index: 1;
}
.swiper02-pgnv .swiper-pagination {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    width: auto;
    height: 100%;
    font-size: 0;
}
.swiper02-pgnv .swiper-pagination .swiper-pagination-bullet {
    width: 25%;
    height: 100%;
    font-size: 1.1rem;
    color: #666666;
    line-height: 3rem;
    background: transparent;
    opacity: 1;
    -webkit-transform: scaleX(0.9);
    -moz-transform: scaleX(0.9);
    transform: scaleX(0.9);
    transform-origin: top left;
}
.swiper02-pgnv .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    color: #000;
    font-weight: bold;
}
.ns_list {
    margin-bottom: 15%;
}
/* 스와이퍼  버튼 끝*/
/*----------------------------------------------------------------------------news 페이지 끝----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------award 페이지-------------------------------------------------------------------------------*/
#award {
}
#award .award_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}
#award .award_bg .bgimg {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}
#award .award_bg .bgimg.active {
    opacity: 1;
}
#award .award_bg .bgimg img {
    width: 100%;
    height: 100%;
}
#award .award_cont {
    padding-top: 25%;
    -webkit-transform: scaleX(0.9);
    -moz-transform: scaleX(0.9);
    transform: scaleX(0.9);
}
#award .award_box {
    padding-bottom: 10%;
    text-align: left;
}
#award .award_box .award_title {
    font-size: 1.8em;
    color: #fff;
    font-weight: 700;
    line-height: 1.5em;
    text-align: center;
    transform-origin: top center;
}
#award .award_box .award_list {
    margin: 0 10%;
}
#award .award_box .award_list li {
    padding-top: 3%;
    font-size: 1.1em;
    line-height: 1em;
    color: #fff;
    width: 96%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#award .award_box .award_list li .year {
    display: inline-block;
    width: 35px;
}
#award .award_box .award_list li .year-clear {
    display: inline-block;
    width: 38px;
    color: transparent;
}
#award .award_box .award_list.font-noto li {
    letter-spacing: -1px;
}
#award .award_box.award_center {
    text-align: center;
}
#award .award_box.award_center .award_list {
    width: 100%;
    margin: 0;
}
.award_mask {
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.84;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 200;
}

/* 20220104 award2022 추가 */
/* common stlye */
#award2022 mark {
    background: none;
    color: #fff;
}
#award2022 > * {
    line-height: 1.25;
}
#award2022 img {
    width: auto;
}
#award2022 video {
    max-width: 100%;
    min-width: 90%;
}
#award2022 a {
    color: inherit;
}
#award2022 .hide {
    width: 1px;
    height: 1px;
    overflow: hidden;
    position: absolute;
    border: none;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
}
#award2022 .pr {
    position: relative;
}
#award2022 .flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
#award2022 .flex_center {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}
#award2022 .align_center {
    -webkit-align-items: center;
    align-items: center;
}
#award2022 .justify_center {
    -webkit-justify-content: center;
    justify-content: center;
}
#award2022 .justify_spacebetween {
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
#award2022 .delay05 {
    animation-delay: 0.5s;
}
#award2022 .delay1 {
    animation-delay: 1s;
}
#award_cnt2,
#award_cnt3,
#award_cnt4 {
    background: #000;
    color: #fff;
    position: relative;
}
#award2022 .cnt_tit1 {
    text-align: center;
}
#award2022 .cnt_tit1 p:first-child {
    font-family: "Roboto Condensed";
    font-size: 16px;
    font-weight: 200;
    padding-bottom: 10px;
}
#award2022 .cnt_tit1 p:first-child span {
    font-weight: 400;
}
#award2022 .cnt_tit1 h2 {
    font-size: 28px;
    padding-bottom: 14.591px;
}
#award2022 .cnt_tit1 h2 + p {
    font-size: 16px;
    padding-bottom: 36.477px;
    color: #ddd;
}
#award2022 .cnt_tit1 p:last-child {
    font-size: 16px;
    padding-bottom: 30px;
    color: #ddd;
    font-weight: 100;
}
#award2022 .cnt_tit1 strong {
    font-size: 16px;
    padding-bottom: 20px;
    color: #eee;
    font-weight: 100;
}
#award2022 .cnt_tit2 {
    text-align: center;
}
#award2022 .cnt_tit2 .box_num {
    font-family: "Gotham";
    font-weight: 100;
    font-size: 75px;
}
#award2022 .cnt_tit2 .box_num + h2 {
    font-size: 28px;
    padding: 5px 0 14px;
}
#award2022 .cnt_tit2 h2:last-child {
    font-size: 16px;
    font-weight: 100;
    padding-bottom: 32.458px;
    color: #e2e2e2;
}
#award2022 .btn_more {
    color: #fff;
    border: 1px solid #fff;
    border-radius: 50px;
    text-align: center;
    display: block;
    width: 200px;
    margin: 0 auto;
    font-size: 18px;
    padding: 10px 0;
    font-weight: 400;
}
#dim {
    display: none;
    position: fixed;
    z-index: 2000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
}
#video_pop {
    position: fixed;
    z-index: 2000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
    width: 90%;
}
#video_pop iframe {
    max-width: 100%;
}
#video_pop2 {
    position: fixed;
    z-index: 2000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
    width: 90%;
}
#video_pop2 iframe {
    max-width: 100%;
}
.md_close_btn {
    width: 23px;
    height: 23px;
    position: absolute;
    top: -30px;
    right: 0;
    background: url("../images/portfolio/btn_close.png") no-repeat center / cover;
}
.hide {
    width: 1px;
    height: 1px;
    overflow: hidden;
    position: absolute;
    border: none;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
}
#award2022 .btn_play {
    position: relative;
    display: block;
    margin: auto;
}
#award2022 .btn_play::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 51px;
    height: 66px;
    background: url(../images/portfolio/btn_play.png) no-repeat center / cover;
    -webkit-animation: playani 3s ease-out;
    -moz-animation: playani 3s ease-out;
    animation: playani 3s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

/* keyframe */
@keyframes txt_top {
    0% {
        transform: translateY(40%);
        opacity: 0;
    }
    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}
@-webkit-keyframes txt_top {
    0% {
        -webkit-transform: translateY(40%);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0%);
        opacity: 1;
    }
}
@-moz-keyframes txt_top {
    0% {
        -moz-transform: translateY(40%);
        opacity: 0;
    }
    100% {
        -moz-transform: translateY(0%);
        opacity: 1;
    }
}
@keyframes txt_btm {
    0% {
        transform: translateY(-30%);
        opacity: 0;
    }
    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}
@-webkit-keyframes txt_btm {
    0% {
        -webkit-transform: translateY(-30%);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0%);
        opacity: 1;
    }
}
@-moz-keyframes txt_btm {
    0% {
        -moz-transform: translateY(-30%);
        opacity: 0;
    }
    100% {
        -moz-transform: translateY(0%);
        opacity: 1;
    }
}
@keyframes x_rotate {
    0% {
        transform: rotate(360deg);
        opacity: 0;
    }
    100% {
        transform: rotate(0deg);
        opacity: 1;
    }
}
@-webkit-keyframes x_rotate {
    0% {
        -webkit-transform: rotate(360deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: rotate(0deg);
        opacity: 1;
    }
}
@-moz-keyframes x_rotate {
    0% {
        -moz-transform: rotate(360deg);
        opacity: 0;
    }
    100% {
        -moz-transform: rotate(0deg);
        opacity: 1;
    }
}

/* award2022 stlye */
#award2022 {
    z-index: 200;
    width: 100%;
    background: #000;
    color: #fff;
    position: relative;
    font-family: "NotoSansKR";
    line-height: 1;
    font-weight: 400;
}
#award2022 button {
    font-family: inherit;
}
#award_cnt1 {
    width: 100%;
    position: relative;
    overflow: hidden;
    background: #000;
    height: 100vh;
}
#award_cnt1 .ribbon {
    background: url("../images/award/m_ribbon.png") no-repeat center / cover;
    width: 100%;
    height: 215.733px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
#award_cnt1 #mAwardBg {
    pointer-events: none;
    z-index: -1;
}
#award_cnt1 .cnt1_txt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
#award_cnt1 .cnt1_wrap {
    height: 260px;
    flex-direction: column;
    -webkit-flex-direction: column;
}
#award_cnt1 .cnt1_wrap > div {
    transition: transform 0.3s;
}
#award_cnt1 .cnt1_logo {
    width: 233.67px;
    height: 34.47917px;
    background: url("../images/award/m_cnt1_logo.png") no-repeat center / cover;
    -webkit-animation: txt_top 3s;
    -moz-animation: txt_top 3s;
    animation: txt_top 3s;
}
#award_cnt1 .cnt1_x {
    width: 30px;
    height: 30px;
    position: relative;
    -webkit-animation: x_rotate 3s;
    -moz-animation: x_rotate 3s;
    animation: x_rotate 3s;
}
#award_cnt1 .cnt1_x::before {
    content: "";
    display: block;
    width: 1px;
    height: 30px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
}
#award_cnt1 .cnt1_x::after {
    content: "";
    content: "";
    display: block;
    width: 1px;
    height: 30px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
}
#award_cnt1 .cnt1_award {
    -webkit-animation: txt_btm 3s;
    animation: txt_btm 3s;
}
#award_cnt1 .cnt1_award p {
    position: relative;
    font-family: "Myriad Pro";
    letter-spacing: 0.035em;
    color: #fff;
    font-size: 21px;
    line-height: 1.2;
    padding-left: 70px;
}
#award_cnt1 .cnt1_award p::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 53px;
    height: 66px;
    background: url("../images/award/m_cnt1_n.png") no-repeat center / cover;
}
#award_cnt1 .cnt1_video {
    height: 100vh;
}

/* 220204 edit award list*/
#award2022 #awardList {
    font-size: 16px;
    margin: 100px auto;
    font-weight: 300;
    letter-spacing: 0;
    background: none;
    position: relative;
    overflow: hidden;
    padding: 0 1em;
    word-break: keep-all;
}
#award2022 .fixed {
    position: fixed;
    top: 0;
    left: 0;
}
#awardList > div {
    flex-direction: column;
    -webkit-flex-direction: column;
    align-items: center;
    -webkit-align-items: center;
}
#awardList ul li {
    padding-bottom: 1.8em;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
#awardList mark {
    flex-basis: 70px;
    flex-shrink: 0;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
}
#awardList ul li p:nth-child(odd) {
    padding-bottom: 0.3em;
}
#awardList ul li p:nth-child(even) {
    padding-bottom: 1.2em;
}
#awardList ul li span {
    display: inline-block;
}
#awardList ul li .organization {
    padding-right: 30px;
    font-weight: 500;
}
#awardList ul li .field {
    font-weight: 500;
}
#awardList .hide_list {
    visibility: hidden;
    overflow: hidden;
    max-height: 0;
}
#awardList .view_more {
    font-size: 16px;
}
#awardList .view_more:hover,
#awardList .view_more:focus {
    color: #000;
    background: #fff;
    border: 1px solid #000;
}
#awardList .show_list,
#awardList .hide_list {
    width: 100%;
}

#award2022 #award_cnt2 {
    padding-top: 100px;
}
#award_cnt3 .cnt_tit2 {
    padding-top: 40px;
}
#award_cnt3 .cnt3_boxes {
    text-align: center;
}
#award_cnt3 .cnt3_boxes img {
    width: 235.417px;
    margin: 0 auto 33.35px;
    min-width: 62.6%;
}
#award_cnt3 .cnt3_boxes h3 {
    font-size: 23px;
    padding-bottom: 10px;
}
#award_cnt3 .cnt3_boxes p {
    font-size: 16px;
    line-height: 1.4;
    color: #eee;
    font-weight: 100;
    padding-bottom: 90.36px;
}
#award_cnt4 .cnt4_img {
    position: relative;
}
/* #award_cnt4 .cnt4_img::before{position: absolute; content: ""; display: block; width: 100%; height: 100%; background: url("../images/award/m_cnt4_img3.png") no-repeat center / cover; top: 0; left: 0; z-index: -1;} */
/* #award_cnt4 .cnt4_img img{width: 100%; margin: 0 auto; min-width: 77%;} */
#award_cnt4 .cnt4_img img {
    margin: auto;
}
#award_cnt4 .cnt4_nAward {
    padding: 91.713px 0 0;
    text-align: center;
    position: relative;
}
#award_cnt4 .cnt4_nAward img {
    width: 213.542px;
    margin: 0 auto;
    min-width: 56%;
}
#award_cnt4 .cnt4_nAward .m_deco {
    position: absolute;
    top: 2%;
    left: 12.083%;
    width: 55.729px;
    height: 81.812px;
    background: url("../images/award/m_deco1.png") no-repeat center / cover;
}
#award_cnt4 .cnt4_nAward h3 {
    padding: 24.266px 0 10.633px;
    font-size: 26px;
}
#award_cnt4 .cnt4_nAward p {
    font-size: 16px;
    color: #eee;
    line-height: 1.4;
    font-weight: 100;
}
#award_cnt5 {
    padding: 60px 0 0;
    text-align: center;
}
#award_cnt5 .cnt5_img {
    display: block;
    position: relative;
}
#award_cnt5 .cnt5_img img {
    width: 178.646px;
    margin: 0 auto;
    min-width: 47.6%;
}
#award_cnt5 .cnt5_img span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 38.542px;
    height: 38.542px;
    line-height: 130%;
    text-align: center;
    background: #f44b00;
    border-radius: 50%;
    font-size: 9.896px;
    position: absolute;
    top: 9%;
    right: 24%;
}
#award_cnt5 .cnt5_box strong {
    font-size: 18.229px;
    padding-top: 18.229px;
    line-height: 1.3;
    display: block;
}
#award_cnt5 .cnt5_box strong + p {
    font-size: 13px;
    color: #00000075;
    padding: 15.633px 0 57.32px;
}
#award_cnt5 .cnt5_box .award_work {
    padding-bottom: 104.219px;
}
#award_cnt5 .cnt5_box .award_work .m_deco {
    position: absolute;
    top: 243.395px;
    left: 1%;
    width: 27.604px;
    height: 28.139px;
    background: url("../images/award/m_deco2.png") no-repeat center / cover;
    z-index: 10;
}
#award_cnt5 .cnt5_box .award_work h3 {
    font-size: 23.438px;
    line-height: 1.2;
    padding-bottom: 30px;
    font-weight: 700;
}
#award_cnt5 .cnt5_box .award_work .video_wrap {
    width: 343.75px;
    height: 358.513px;
    margin: 0 auto 28.66px;
    min-width: 90%;
    position: relative;
    overflow: hidden;
}
#award_cnt5 .cnt5_box .award_work .video_wrap video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#award_cnt5 .cnt5_box .award_work > p {
    font-size: 16px;
    line-height: 1.35;
    margin: 0 15.625px 32.308px;
    word-break: keep-all;
    font-weight: 100;
}
#award_6_7 {
    position: relative;
}
#award_6_7::before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url("../images/award/m_cnt67_bg.jpg") no-repeat center / cover;
    z-index: -1;
    top: 0;
    left: 0;
}
#award_cnt6 .cnt_tit2 {
    padding: 65.219px 0 0;
}
#award_cnt6 .cnt6_box {
    position: relative;
}
#award_cnt6 .cnt6_box img {
    width: 203.125px;
}
#award_cnt6 .cnt6_box:nth-child(1) .skew_txt {
    position: absolute;
    top: 41.688px;
    left: 128.646px;
}
#award_cnt6 .cnt6_box:nth-child(2) {
    margin-top: -84.417px;
}
#award_cnt6 .cnt6_box:nth-child(2) img {
    margin-left: auto;
}
#award_cnt6 .cnt6_box:nth-child(2) .skew_txt {
    position: absolute;
    top: 50%;
    left: 78.125px;
}
#award_cnt6 .cnt6_box:nth-child(3) {
    margin-top: -21.07px;
}
#award_cnt6 .cnt6_box:nth-child(3) .skew_txt {
    position: absolute;
    top: 84.417px;
    right: 8%;
}
#award_cnt6 .cnt6_box:nth-child(3) img {
    margin-left: 53.646px;
}
#award_cnt6 .cnt6_box p {
    transform: skewY(-10deg);
}
#award_cnt6 .cnt6_box .cnt6_big_txt {
    font-weight: 700;
    font-size: 42.198px;
    text-shadow: 3px 3px 5px #000;
    padding-bottom: 7px;
}
#award_cnt6 .cnt6_box .cnt6_big_txt + p {
    font-size: 16px;
}
#award_cnt6 .btn_more {
    margin: 36.477px auto 0;
}
#award_cnt7 {
    color: #fff;
    padding-top: 77px;
    position: relative;
    overflow: hidden;
    padding-bottom: 74.47px;
}
/* #award_cnt7::before{position: absolute; content: ""; display: block; width: 100%; height: 100%; background: url("../images/award/m_cnt7_bg.jpg") no-repeat center / cover; z-index: -1; top: 0; left: 0;} */
#award_cnt7 .award_youtube {
    padding-top: 35px;
}
#award2022 .award_youtube,
#award_cnt7 ul li {
    width: 90%;
    min-width: 334.896px;
    margin: 0 auto 15.633px;
    display: block;
}
#award_cnt7 li h3 {
    padding: 48.462px 0 32.28px;
    font-size: 26.042px;
    line-height: 1.4;
    font-weight: 700;
}
#award_cnt7 li p {
    font-size: 18.229px;
    line-height: 1.4;
}
.so_delicious {
    transform: skewY(-10deg);
    font-weight: 700;
    font-size: 35px !important;
    line-height: 1 !important;
    position: absolute;
    top: 2%;
    right: 2%;
}
.so_delicious span {
    display: block;
    border-bottom: 1px solid #ffffff40;
}
#award_cnt7 li.enjoy_txt {
    padding: 126px 0 141.633px;
    width: auto;
    margin: auto;
    text-align: center;
}
#award_cnt7 li.enjoy_txt p {
    position: relative;
    font-size: 36.3px;
    padding-bottom: 0;
    line-height: 1;
    transform: skewY(-10deg);
    font-weight: 700;
    text-shadow: 2px 2px 2px #000;
}
#award_cnt7 li.enjoy_txt p::before,
#award_cnt7 li.enjoy_txt p::after {
    position: absolute;
    content: "";
    display: block;
    width: 46.875px;
    height: 43.772px;
    background: no-repeat center / cover;
    left: 50%;
    transform: translateX(-50%);
}
#award_cnt7 li.enjoy_txt p::before {
    background-image: url("../images/award/m_ldquo.png");
    top: -50px;
}
#award_cnt7 li.enjoy_txt p::after {
    background-image: url("../images/award/m_rdquo.png");
    bottom: -55px;
}
#award_cnt7 li.cnt7_video p {
    padding-bottom: 36.477px;
}
/*----------------------------------------------------------------------------award 페이지 끝-----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------contact 페이지-------------------------------------------------------------------------------*/
#contact {
    z-index: 140;
}
#contact .info {
    width: 100%;
    height: 191vw;
    position: relative;
    background: url("../images/contact/contact_01.png") no-repeat;
    background-size: 100%;
}
#contact .info .info_txt {
    width: 80%;
    height: 94px;
    position: absolute;
    top: 14%;
    left: 10%;
    text-align: center;
    text-transform: uppercase;
    animation: opaanimation_contact 1s ease alternate;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    opacity: 0;
}
/*181005 수정animation:opaanimation->opaanimation_contact*/
@keyframes opaanimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
/*181005 원래 animation에 transform추가 (위의 animation다른 곳에 사용됬을 것 같아서 수정안하고 추가)*/
@keyframes opaanimation_contact {
    0% {
        opacity: 0;
        transform: translateY(50px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
#contact .info .info_txt .info_tit {
    color: #fff;
    font-size: 7vw;
    font-family: "Roboto", sans-serif;
    letter-spacing: -1px;
}
#contact .info .info_txt .info_tit02 {
    margin-top: 4%;
    font-size: 4vw;
    color: #fff;
    font-weight: 200;
    letter-spacing: 0px;
}
#contact .info .btn_profile {
    position: absolute;
    top: 31%;
    left: 18%; /* width:202px; */ /*181005 수정 width:238px->64%;*/
    width: 64%;
    height: 46px;
    border: 1px solid #fff; /*181005 수정 line-height:3->46px;*/
    line-height: 46px;
    color: #fff;
    font-size: 4vw; /* padding-left:5%; */
    text-align: center;
    animation: opaanimation_contact 1s ease alternate;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    animation-delay: 0.4s;
    opacity: 0;
}
/*181005 수정animation:opaanimation->opaanimation_contact*/
#contact .info .btn_newturn {
    position: absolute;
    top: 43%;
    left: 18%; /*181005 수정 width:238px->64%;*/
    width: 64%;
    height: 46px;
    border: 1px solid #fff; /*181005 수정 line-height:3->46px;*/
    line-height: 46px;
    color: #fff;
    font-size: 4vw; /* padding-left:6%; */
    text-align: center;
    animation: opaanimation_contact 1s ease alternate;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    animation-delay: 0.8s;
    opacity: 0;
}
/*181005 수정animation:opaanimation->opaanimation_contact*/
#contact .info .nturn {
    position: absolute;
    top: 54.5%;
    left: 0;
    width: 100%;
    height: auto;
    font-family: "Roboto Condensed", sans-serif;
}
#contact .info .nturn .nturn_txt {
    margin: 6% 0 0 19%;
    animation: opaanimation_contact 1s ease alternate;
    animation-fill-mode: forwards;
    animation-delay: 1.2s;
    opacity: 0;
}
/*181005 수정animation:opaanimation->opaanimation_contact*/
#contact .info .nturn .nturn_txt .nturn_01 {
    width: 100%;
    height: auto;
}
#contact .info .nturn .nturn_txt .nturn_01 .nturn_tit {
    font-size: 4.8vw;
    color: #fff;
    margin: 10% 0 2% 0%;
}
#contact .info .nturn .nturn_txt .nturn_01 .nturn_sub {
    color: #fff;
    font-size: 4vw;
}
#contact .info .nturn .nturn_txt .nturn_01 .nturn_sub > span {
    color: #fff;
}
#contact .map {
    position: relative;
}
#contact .map .map_marker {
    position: absolute; /* top:67%;left:50%; */
    top: 54%;
    left: 49%;
    display: inline-block;
    font-size: 0;
}
#contact .map .map_marker .pulse {
    width: 15px;
    height: 15px;
    border: 5px solid #fff;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background-color: #fff;
    z-index: 10;
    position: absolute;
}
#contact .map .map_marker .dot {
    position: absolute;
    height: 40px;
    width: 40px;
    top: -13px;
    left: -13px;
    z-index: 2;
    opacity: 0;
    border: 10px solid #fff;
    background: #fff;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;
    -webkit-animation: mapani 2.5s ease-out;
    -moz-animation: mapani 2.5s ease-out;
    animation: mapani 2.5s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
#contact .map .btn_map {
    position: absolute; /* bottom:10.7%;right:8%; */
    top: 5%;
    left: 9%;
    display: inline-block; /*181005 수정 width:238px->50%;*/
    width: 50%;
    height: 46px;
    background: #333; /*181005 수정 line-height:3->46px;*/
    line-height: 46px;
    padding-left: 10%;
    font-size: 4.5vw;
    font-family: "Roboto", sans-serif;
    border: 2px solid #fff;
    color: #fff;
}
/* .btn_newturn:hover {background:url(../images/contact/btn_profile_on.png)no-repeat;background-size:100% 100%} */
/*----------------------------------------------------------------------------contact 페이지 끝----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------프로젝트 의뢰----------------------------------------------------------------------------*/
.layer {
    opacity: 0;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh !important; /* height:100%; */
    background: #000;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.layer_close {
    opacity: 0;
    position: absolute;
    top: 11vw;
    right: 10vw;
    width: 6.5%;
    z-index: 0;
}
.layer_inner {
    width: 100%; /* height:100%; */
    opacity: 0;
}
.layer_inner .layer_sec {
    width: 0;
    height: 0;
    margin-top: 0;
    visibility: hidden;
    transition: visibility 0s 1s;
    transform: translateZ(0);
    overflow: hidden;
}
.layer_inner .layer_sec::after {
    content: "";
    display: inline-block;
    height: 100%;
    width: 0;
    vertical-align: middle;
}
.layer_inner .layer_sec .form {
    /*width:69%; margin:35% 14.9% 80% 14.9%; */ /* width:75%;margin:48% 14.9% 80% 12%;display: inline-block;vertical-align: bottom; */
    margin-top: 6.5rem;
    box-sizing: border-box;
    /*추가*/
    -webkit-animation: slidein02 1.1s ease-out;
    animation: slidein02 1.1s ease-out;
    animation-delay: 1.1s;
    opacity: 0;
    transition: opacity 1.1s;
    transition-delay: 1.1s;
}
@keyframes slidein02 {
    0% {
        opacity: 0 !important; /* margin-top:100% */ /* margin-top:48% */
    }
    100% {
        opacity: 1 !important; /* margin-top:48% */
    }
}

.layer_inner .layer_sec .form label {
    display: block;
    margin-bottom: 34px;
    color: #fff; /* font-size:1.4em; */
    font-size: 2.2em;
    line-height: 1.5em;
    letter-spacing: -1px;
    -webkit-transform: scaleX(0.96);
    -moz-transform: scaleX(0.96);
    transform: scaleX(0.96);
    transform-origin: top left;
    font-weight: 200;
}
.layer_inner .layer_sec .form .form_box {
    position: relative;
    width: 100%;
}
.layer_inner .layer_sec .form .form_box::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 2px;
    left: 0;
    bottom: 0;
    background: #656565;
}
.layer_inner .layer_sec .form .form_box .f_input {
    width: 100%;
    color: hsla(0, 0%, 100%, 0.3);
    background: none;
    border: none;
    outline: none;
    padding: 0;
    margin: 0;
    border-radius: 0;
    -webkit-appearance: none !important/* ;font-size:1.8em; */;
    font-size: 2em;
    color: #fff;
}
/* .f_input {font-size:2em} */
.layer_inner .layer_sec .form .form_box .f_textarea {
    margin-top: -7%;
}
.f_input:focus .btn_container {
    display: none;
}
.layer_inner .layer_sec .form .form_box .f_desc {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 52px;
    color: #fff;
    opacity: 0.2;
    letter-spacing: -0.5px;
    visibility: hidden;
    font-weight: 300;
}
.layer_inner .layer_sec .form .form_box .f_alert {
    opacity: 0;
    position: absolute;
    bottom: -38px;
    left: 0;
    font-size: 16px;
    color: #fff;
    font-weight: 100;
    line-height: 16px;
    -webkit-transform: scaleX(0.97);
    -moz-transform: scaleX(0.97);
    transform: scaleX(0.97);
    transform-origin: top left;
}
.layer_inner .layer_sec .form label,
.layer_inner .layer_sec .form .form_box .f_input {
    backface-visibility: hidden;
    opacity: 0;
    transform: rotate(-10deg) rotateX(50deg) translateX(-40px) translateY(40px) translateZ(0);
}
.layer_inner .layer_sec.active {
    visibility: visible;
    transition: 0s 0s;
    width: 91%;
    height: auto;
    overflow: visible;
    margin-top: 1rem;
}
.layer_inner .layer_sec.active .form label,
.layer_inner .layer_sec.active .form .form_box .f_input {
    transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.4s, opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s;
    opacity: 1;
    transform: rotate(0) rotateX(0) translateX(0) translateY(0) translateZ(0);
}
.layer_inner .layer_sec.leaving .form label,
.layer_inner .layer_sec.leaving .form .form_box .f_input {
    transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.4s, opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s;
    opacity: 0;
    transform: rotate(10deg) rotateX(-50deg) translateX(40px) translateY(-40px) translateZ(0);
}

.layer_inner .btn_container {
    /* position:absolute;top:76%;left:12%; */
    width: 100%; /* margin-bottom:50%; */ /* margin-left:14.9% */
    margin-top: 19%;
    /*추가*/
    -webkit-animation: slidein03 1.2s ease-out;
    animation: slidein03 1.2s ease-out;
    animation-delay: 1.2s;
    opacity: 0;
    transition: opacity 1.2s;
    transition-delay: 1.2s;
}

@keyframes slidein03 {
    0% {
        opacity: 0 !important; /* top:300% */
        top: 76%;
    }
    100% {
        opacity: 1 !important;
        top: 76%;
    }
}
/* .layer_inner .layer_logo {width:25vw;height:auto;position:absolute;bottom:15%;right:15%} */

.opacity {
    opacity: 1 !important;
}

.layer_inner .btn_container .btn_next {
    position: relative;
    display: inline-block; /*/width:257px; */
    width: 268px;
    height: 50px;
    background: #000;
    border: 2px solid #fff;
    font-size: 1.4em;
    font-weight: 200;
    color: #fff;
    text-align: left;
    line-height: 45px;
    padding-left: 5%;
}
.btn_container_close > a {
    position: relative;
    display: inline-block; /*/width:257px; */
    width: 268px;
    height: 50px;
    background: #000;
    border: 2px solid #fff;
    font-size: 1.4em;
    font-weight: 200;
    color: #fff;
    text-align: left;
    line-height: 45px;
    text-align: center;
}

.layer_inner .btn_container_close {
    /* position:absolute; */ /*bottom:107px;left:55px; margin-bottom:353px;margin-left:200px */ /* bottom:24%;left:13% */
}

.layer.open {
    display: block;
    opacity: 1;
    z-index: 102;
}
.layer.active {
    /* padding:6.9%; */
    padding: 2.9%;
    background: #fff;
    z-index: 999;
}
.layer.active .layer_inner {
    opacity: 1;
    background: #000;
    position: relative;
    padding: 7rem 1.5rem 0 3rem;
    margin-top: 5%;
}
.layer .layer_inner .inner_tit {
    width: 94%;
    height: 72px;
    position: absolute;
    top: 13%;
    left: 12%;
    -webkit-animation: slidein 0.9s ease-out;
    animation: slidein 0.9s ease-out;
    animation-delay: 0.5s;
    opacity: 0;
    transition: opacity 1.5s;
    transition-delay: 0.5s;
}
@keyframes slidein {
    0% {
        opacity: 0 !important; /* top:50% */
        top: 13%;
    }
    100% {
        opacity: 1 !important;
        top: 13%;
    }
}
.layer.active .layer_inner .inner_tit .layer_tit {
    font-size: 1.5em;
    margin-bottom: 5%;
    color: #fff;
    font-weight: 500;
}
.layer.active .layer_inner .inner_tit .layer_tit02 {
    color: #fff;
    font-weight: 200;
}
.layer_inner .inner_tit02 {
    width: 84%;
    height: 70px; /* position:absolute;bottom:10%;left:12%; */
    color: #e9e9e9;
    display: none;
}
/* .layer_inner .inner_tit02 .f_line {position:absolute;top:9%;left:6%} */
.layer_inner .inner_tit02 > p {
    font-size: 0.85em;
    font-weight: 200;
}
.layer.active .layer_close {
    opacity: 1;
    z-index: 100;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
}
.layer.active .layer_close:hover {
    opacity: 0.5;
}

.mask {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.8;
    z-index: 95;
}
input::placeholder {
    color: #fff;
    font-weight: 300;
    font-family: "Roboto", sans-serif;
    letter-spacing: -0.5px;
    opacity: 0.2;
}
input::-webkit-input-placeholder {
    color: #fff;
    font-weight: 300;
    font-family: "Roboto", sans-serif;
    letter-spacing: -0.5px;
    opacity: 0.2;
}
input:-ms-input-placeholder {
    color: #fff;
    font-weight: 300;
    font-family: "Roboto", sans-serif;
    letter-spacing: -0.5px;
    opacity: 0.2;
}
/*----------------------------------------------------------------------------프로젝트 의뢰 끝--------------------------------------------------------------------------*/

/* --------------------------------------------------------------------css animation---------------------------------------------------------------------------------- */
@keyframes mapani {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    25% {
        transform: scale(0);
        opacity: 0.2;
    }
    50% {
        transform: scale(0.1);
        opacity: 0.5;
    }
    75% {
        transform: scale(0.5);
        opacity: 0.9;
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}
@-webkit-keyframes mapani {
    0% {
        -webkit-transform: scale(0);
        opacity: 0;
    }
    25% {
        -webkit-transform: scale(0);
        opacity: 0.2;
    }
    50% {
        -webkit-transform: scale(0.1);
        opacity: 0.5;
    }
    75% {
        -webkit-transform: scale(0.5);
        opacity: 0.9;
    }
    100% {
        -webkit-transform: scale(1);
        opacity: 0;
    }
}
@-moz-keyframes mapani {
    0% {
        -moz-transform: scale(0);
        opacity: 0;
    }
    25% {
        -moz-transform: scale(0);
        opacity: 0.2;
    }
    50% {
        -moz-transform: scale(0.1);
        opacity: 0.5;
    }
    75% {
        -moz-transform: scale(0.5);
        opacity: 0.9;
    }
    100% {
        -moz-transform: scale(1);
        opacity: 0;
    }
}
@keyframes playani {
    0% {
        opacity: 0.7;
    }
    25% {
        opacity: 0.1;
    }
    50% {
        opacity: 0.7;
    }
    75% {
        opacity: 0.1;
    }
    100% {
        opacity: 0.7;
    }
}
@-webkit-keyframes playani {
    0% {
        opacity: 0.7;
    }
    25% {
        opacity: 0.1;
    }
    50% {
        opacity: 0.7;
    }
    75% {
        opacity: 0.1;
    }
    100% {
        opacity: 0.7;
    }
}
@-moz-keyframes playani {
    0% {
        opacity: 0.7;
    }
    25% {
        opacity: 0.1;
    }
    50% {
        opacity: 0.7;
    }
    75% {
        opacity: 0.1;
    }
    100% {
        opacity: 0.7;
    }
}
/* -------------------------------------------------------------------------css animation 끝----------------------------------------------------------------------------- */

/*------------------------------------------------------------------------------------------ 아이폰 4, 아이폰 5 -------------------------------------------------------------------------*/
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) {
    #foot {
        left: 10rem;
    }
    .share_tw {
        margin-left: 1% !important;
    }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (orientation: landscape) {
    #foot {
        left: 10rem;
    }
    .share_tw {
        margin-left: 1% !important;
    }
}
/*------------------------------------------------------------------------------------------ 아이폰 4, 아이폰 5  끝-------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------아이폰 x-----------------------------------------------------------------------------------*/
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    /*헤더*/
    /*#head #gnb {top:0.8rem}
	#head h1 {top:2.4rem}
	#head .subNum {top:5.3rem}*/

    /*gnb메뉴*/
    #head #gnb > menu > li .gnbMenu ul:not(.family_list) {
        padding-left: 2rem;
    }
    #head #gnb > menu > li .gnbMenu ul.family_list {
        padding: 2rem 0 2rem 2rem;
    }
    .mainMenu {
        margin-top: 10%;
    }
    #head #gnb > menu > li .gnbMenu ul:not(.family_list) li:not(:last-child) {
        margin-bottom: 8%;
    }
    #head #gnb > menu > li .gnbMenu .btn.close {
        top: 3.4rem;
        left: 2.8rem;
    }
    .nav_logo {
        top: 4.4%;
    }

    /*프로젝트 리퀘스트*/
    #nav .menu_list li {
        padding: 5px 0 6.3%;
    }
    #nav .menu_list {
        margin: 27% 9.9% 0 9.9%;
    }
    #nav .menu_list {
        padding-bottom: 8%;
    }

    /* .layer_inner .layer_sec .form {margin: 58% 14.9% 80% 12%} */
    @keyframes slidein02 {
        0% {
            opacity: 0 !important; /* margin-top:100% */ /* margin-top:58% */
        }
        100% {
            opacity: 1 !important; /* margin-top:58% */
        }
    }

    .layer_inner .layer_sec .form .form_box {
        /* position:absolute;top:58%;left:11%;width:80%; */ /*추가*/
        -webkit-animation: slidein04 1.1s ease-out;
        animation: slidein04 1.1s ease-out;
        animation-delay: 1.1s;
        transition: opacity 1.1s;
        transition-delay: 1.1s;
    }
    @keyframes slidein04 {
        0% {
            opacity: 0 !important; /* top:200% */
            top: 58%;
        }
        100% {
            opacity: 1 !important;
            top: 58%;
        }
    }

    /* .layer_inner .btn_container {top: 70%;} */
    @keyframes slidein03 {
        0% {
            opacity: 0 !important; /* top:200% */
            top: 70%;
        }
        100% {
            opacity: 1 !important;
            top: 70%;
        }
    }
    .layer_inner .btn_container .btn_next,
    .btn_container_close > a {
        width: 271px;
    }

    .layer_inner .inner_tit02 {
        display: block; /* top:80%; */ /*추가*/
        -webkit-animation: slidein05 1.4s ease-out;
        animation: slidein05 1.4s ease-out;
        animation-delay: 1.4s;
        transition: opacity 1.4s;
        transition-delay: 1.4s;
        opacity: 0;
        margin-top: 7%;
    }
    @keyframes slidein05 {
        0% {
            opacity: 0 !important; /* top:200% */
        }
        100% {
            opacity: 1 !important;
            top: 80%;
        }
    }

    .layer_inner .layer_sec.active {
        margin-top: 8rem;
    }
    .layer_inner .layer_sec .form label {
        margin-bottom: 8%;
    }
    .layer_inner .btn_container {
        margin-top: 4rem;
    }
}
/*---------------------------------------------------------------------------------------------아이폰 x 끝-----------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------세로가 긴 핸드폰 용 (190529)-----------------------------------------------------------------------------------------*/
@media only screen and (min-height: 650px) {
    .scroll {
        width: 92%;
        margin-left: 4%;
    }
    .mainMenu {
        margin-top: 1rem;
    }
    #head #gnb > menu > li .gnbMenu ul:not(.family_list) li:not(:last-child) {
        margin-bottom: 2.3rem;
    }
    #head #gnb > menu > li .gnbMenu ul:not(.family_list) li:last-child {
        margin-bottom: 3rem;
    }
    #head #gnb > menu > li .gnbMenu ul.family_list {
        padding: 3.5rem 0 2rem 2rem;
    }
}
/*---------------------------------------------------------------------------------------------세로가 긴 핸드폰 용 끝 (190529)-----------------------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------------------가로 모드-------------------------------------------------------------------------------------------------*/
@media screen and (orientation: landscape) {
    /*로고*/
    #head h1 {
        right: 4.2vw !important;
        top: 4vw !important;
        width: 6.5rem !important;
        height: 2.8rem !important;
    }
    #head .award_tag {
        bottom: 52%;
    }
    #head .award_tag_leftbottom {
        width: 20.6vw;
        height: 6.66vw;
        left: 20vw;
        bottom: auto;
        top: calc(41% + 7.33rem);
    }

    /*gnb메뉴*/
    #head #gnb {
        left: 0.6rem;
    }
    #head .subNum {
        top: 4.8rem;
        left: 2.6rem;
        font-size: 1.3rem !important;
    }
    .nav_logo {
        top: 6%;
        right: 5%;
        width: 13%;
    }
    .mainMenu {
        width: 41%;
        border-right: 1px solid #fff;
    }
    #head #gnb > menu > li .gnbMenu ul:not(.family_list) li a {
        font-size: 2.8vw;
    }
    #head #gnb > menu > li .gnbMenu ul.family_list {
        width: 50%;
        position: absolute;
        top: 24.5%;
        right: -1%;
        border: 0;
    }
    #head #gnb > menu > li .gnbMenu ul.family_list li a {
        font-size: 2.3vw;
    }
    .scroll {
        padding-top: 5%;
    }

    /* 메인 팝업 */
    .pop_190604 {
        height: 45vh;
        right: 20%;
        top: auto;
        bottom: 5vh;
    }
    .pop_btn_190604 {
        height: 5.3vh;
        right: -3%;
        top: -16%;
    }

    /*메인 슬라이드*/
    .mainSlide.swiper-container .swiper-pagination {
        width: 6rem;
        top: calc(80% - 6.5rem);
        font-size: 0.8rem;
        left: 10rem;
    }
    .mainSlide.swiper-container .swiper-pagination span {
        display: inline-block;
    }
    .mainSlide.swiper-container .swiper-pagination span.swiper-pagination-current {
        font-size: 1.5rem;
    }
    /*181228 추가*/
    .mainSlide.swiper-container dl {
        top: 40%;
    }
    /*181228 추가끝*/
    .mainSlideEx.swiper-container {
        top: 40%;
    }
    .mainSlide.swiper-container .swiper-button-next,
    .mainSlide.swiper-container .swiper-button-prev {
        top: calc(40% + 9.46rem);
    }
    .mainSlide.swiper-container .swiper-button-prev {
        left: 2.6rem;
    }
    .mainSlide.swiper-container .swiper-button-next {
        left: 6rem;
    }
    #foot {
        left: 2.5rem;
    }
    #foot .project-request {
        bottom: -23%;
    }

    /*About Us 페이지*/
    #about #about_section01 {
        margin-top: 0%;
    }
    #about #about_section01 > video {
        height: 378px !important;
    }
    #about #about_section02 .section02_s_tit {
        margin-top: 4%;
    }
    #about #about_section02 .section02_s_tit,
    #about_section05 .sc05_txt .sc05_tit,
    #about #about_section07 .sc07_tit {
        font-size: 3.2vw;
    }
    #about #about_section02 .section02_tit,
    #about #about_section02 .section02_txt .sc02_tit,
    #about #about_section03 .section03_txt .sc03_tit,
    #about_section05 .sc05_txt .sc05_mid,
    #about #about_section07 .sc07_tit_02 {
        font-size: 4.3vw;
    }

    #about #about_section02 .section02_txt .sc02_tit_02,
    #about #about_section02 .section02_txt .sc02_tit_03,
    #about #about_section02 .section02_txt .sc02_tit_04,
    #about #about_section03 .section03_txt .sc03_tit_02,
    #about #about_section03 .section03_txt .sc03_tit_03,
    #about #about_section07 .sc07_tit_03,
    .pf_copy {
        font-size: 2.3vw;
    }
    #about .btn_profile {
        width: 40%;
        margin: 4% 0 0 31%;
        line-height: 2.2;
        font-size: 3vw;
    }
    #about #about_section03 {
        padding-top: 6%;
    }
    #about #about_section03 .section03_txt {
        padding-bottom: 7vw;
    }

    #about_section05 .sc05_txt .sc05_bot {
        font-size: 2.5vw;
        margin-top: 4%;
    }
    .obj_tit {
        font-size: 3.2vw;
        letter-spacing: -1px;
    }
    .obj_mid {
        font-size: 2.5vw;
        line-height: 1.3;
        letter-spacing: -1px;
    }
    #about #about_section06 {
        height: 120vw;
    }
    #about #about_section06 .sc06_txt .sc06_tit {
        font-size: 3.2vw;
        margin-top: 8%;
    }
    #about #about_section06 .sc06_txt .sc06_tit_02 {
        font-size: 4.3vw;
        margin-top: 2%;
    }
    #about #about_section06 .sc06_txt .sc06_tit_03 {
        margin-top: 4%;
        font-size: 2.3vw;
        line-height: 1.4;
    }

    #about #about_section07 .sc07_txt {
        padding-top: 7%;
    }
    #about #about_section10 {
        margin-bottom: 6%;
    }
    .pf_list_bt {
        width: 46%;
        left: 27%;
    }
    .pf_list_bt_a {
        height: 73px;
        line-height: 2.7;
        font-size: 4vw;
    }
    .pf_icon_list {
        left: 27%;
    }
    #portfolio_list {
        height: 85vw;
    }

    /*푸터*/
    /* .m_pt_name {top:183px ! important}
	#m_footer {padding-top: 47% ! important;} */
    .pp_desc {
        font-size: 7.5vw;
    }
    .pp_desc02 {
        font-size: 2.5vw;
    }

    /*portfolio 페이지
	#portfolio .portfolio_list .item a {width:36%;height:96%}
	#portfolio .portfolio_list .even {margin-left: 65%;}
	#portfolio .portfolio_list {padding-top:13%}
	#portfolio .portfolio_list .item {padding-bottom: 37%;}*/
    #portfolio .portfolio_list .item a {
        width: 60%;
        height: 60%;
    }
    #portfolio .portfolio_list .even {
        margin-left: 57%;
    }
    #portfolio .portfolio_list .odd {
        margin-left: -3%;
    }
    #portfolio .portfolio_list .item {
        width: 75%;
        margin-bottom: -40%;
        padding-bottom: 76%;
    }

    /*NEWS 페이지*/
    .hidden-scroll {
        margin-top: 21%;
    }
    .news_arti .news_tit {
        font-size: 3vw;
    }
    .news_arti .news_sub {
        font-size: 2vw;
    }
    .news_arti .news_date {
        margin-top: 4%;
        font-size: 1.8vw;
    }

    /*AWARD 페이지*/
    #award .award_cont {
        padding-top: 18%;
    }
    #award .award_box .award_list {
        text-align: center;
    }

    /*CONTACT 페이지*/
    #contact .info .info_txt {
        top: 9%;
    }
    #contact .info .info_txt .info_tit {
        font-size: 4.8vw;
    }
    #contact .info .info_txt .info_tit02 {
        font-size: 3vw;
    }
    #contact .info .btn_profile {
        top: 27%; /*181005 수정 left:32%->18%;*/
        left: 18%;
        font-size: 2.5vw;
        line-height: 2.7;
    }
    #contact .info .btn_newturn {
        top: 39%; /*181005 수정 left:32%->18%;*/
        left: 18%;
        font-size: 2.5vw;
        line-height: 2.7;
    }
    #contact .map .btn_map {
        font-size: 3vw;
        padding-left: 5%;
        line-height: 2;
    }

    /*포트폴리오 상세페이지*/
    #portfolio .portfolio_view .view_content .view_visual {
        margin-top: -7% !important;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td.desc,
    #portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_cont_box {
        font-size: 2.5vw;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td.desc {
        padding-top: 5%;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td.link .btn_link {
        width: 45%;
        height: 50px;
        font-size: 3vw;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_title {
        font-size: 4vw;
    }
    #portfolio .portfolio_view .view_content .view_visual .visual_img img {
        top: 0.4%;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td.logo img {
        width: 65%;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_cont .player .btn_close,
    #portfolio .portfolio_view .view_content .view_detail .detail_cont .player2 .btn_close {
        top: -43px;
    }
}
/*-------------------------------------------------------------------------------------가로 모드 끝-----------------------------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------------------패드-------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 768px) {
    #head h1,
    .nav_logo {
        right: 4.2vw !important;
        top: 4vw !important;
        width: 6.5rem !important;
        height: 2.8rem !important;
    }
    #head h1 {
        right: 3vw;
        top: 2.8vw;
    }
    #head .subNum {
        font-size: 1.5rem;
    }
    #head .award_tag {
        bottom: 28%;
    }
    .mainSlide.swiper-container .swiper-pagination span.swiper-pagination-current,
    .swiper-pagination-total {
        font-size: 2.7vh;
    }

    #portfolio_list {
        height: 75vw;
    }
    .pf_list_bt {
        width: 48%;
        left: 26%;
        top: 22%;
    }
    .pf_list_bt_a {
        font-size: 4vw;
    }
    .pf_icon_list {
        width: 46%;
        height: auto;
        left: 27%;
        top: 49%;
    }
    .pf_icon_list > ul {
        overflow: auto;
    }
    .pf_icon_list > ul > li {
        width: 17.5%;
    }
    .pf_icon_list > ul > li:nth-child(1),
    .pf_icon_list > ul > li:nth-child(2),
    .pf_icon_list > ul > li:nth-child(3) {
        margin-right: 10%;
    }
    .pf_copy {
        bottom: 17%;
        font-size: 2.7vw;
    }

    #about #about_section02 .section02_txt .sc02_tit_02,
    #about #about_section02 .section02_txt .sc02_tit_03,
    #about #about_section03 .section03_txt .sc03_tit_02,
    #about #about_section03 .section03_txt .sc03_tit_03,
    #about_section05 .sc05_txt .sc05_bot,
    #about .obj_mid,
    #about #about_section06 .sc06_txt .sc06_tit_03,
    #about #about_section07 .sc07_tit_03 {
        font-size: 2.5vw;
    }
    #about #about_section02 .section02_s_tit,
    #about_section05 .sc05_txt .sc05_tit,
    #about #about_section06 .sc06_txt .sc06_tit,
    #about #about_section07 .sc07_tit {
        font-size: 3vw;
    }
    #about #about_section02 .section02_txt .sc02_tit_04,
    #about .obj_tit {
        font-size: 3.5vw;
    }
    #about #about_section02 .section02_tit,
    #about #about_section02 .section02_txt .sc02_tit,
    #about #about_section03 .section03_txt .sc03_tit,
    #about_section05 .sc05_txt .sc05_mid,
    #about #about_section06 .sc06_txt .sc06_tit_02,
    #about #about_section07 .sc07_tit_02 {
        font-size: 5vw;
    }
    #about #about_section07 .sc07_img,
    #about #about_section08,
    #about #about_section09 {
        display: block;
        width: 80%;
        margin: 0 auto;
    }

    #portfolio .portfolio_list {
        max-width: unset;
        overflow: hidden;
    }
    #portfolio .portfolio_list .item {
        float: left;
        width: 35%;
        margin-bottom: 16%;
        padding-bottom: 35%;
    }
    #portfolio .portfolio_list .even {
        margin-left: 12.5%;
    }
    #portfolio .portfolio_list .odd {
        margin-left: 7.5%;
    }
    #portfolio .portfolio_list .item a {
        width: 100%;
        height: 100%;
    }

    #portfolio .portfolio_view .view_content .view_visual {
        margin-top: -10%;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td {
        font-size: 2.3vw;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td.desc {
        font-size: 3vw;
        padding-top: 5%;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td.logo img {
        width: 65% !important;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_info table td.link .btn_link {
        height: auto;
        line-height: 2.3;
    }
    #portfolio .portfolio_view .view_content .view_detail .detail_cont .pf_cont_box {
        font-size: 3.2vw;
    }

    .ns_list {
        margin-bottom: 7%;
    }
    .news_arti .news_tit {
        font-size: 5.2vw;
    }
    .news_arti .news_sub {
        font-size: 2.9vw;
    }

    #contact .info .info_txt .info_tit {
        font-size: 6vw;
    }
    #contact .info .info_txt .info_tit02 {
        font-size: 3vw;
    }
    #contact .info .btn_profile,
    #contact .info .btn_newturn {
        height: auto;
        font-size: 3vw;
        line-height: 3;
    }
    #contact .info .btn_newturn {
        top: 41%;
    }
    #contact .map .btn_map {
        height: auto;
        font-size: 3.5vw;
        line-height: 2.3;
    }
}
/*-------------------------------------------------------------------------------------패드 끝-----------------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------아이폰X 가로 모드-----------------------------------------------------------------------------------------------*/
@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: landscape) {
    .mainSlide.swiper-container .swiper-pagination span.swiper-pagination-current,
    .swiper-pagination-total {
        font-size: 1.5rem;
    }
}
/*-------------------------------------------------------------------------------------아이폰X 가로 모드 끝-----------------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------아이패드 가로 모드-----------------------------------------------------------------------------------------------*/
@media screen and (min-width: 1024px) and (orientation: landscape) {
    .mainSlide.swiper-container .swiper-button-next,
    .mainSlide.swiper-container .swiper-button-prev,
    .mainSlide.swiper-container .swiper-pagination,
    #head .award_tag_leftbottom {
        margin-top: 0;
        top: calc(52% + 9.46rem);
    }

    /* 메인 팝업 */
    .pop_190604 {
        height: 37vh;
        top: 17%;
        bottom: auto;
        right: -1vh;
    }
    .pop_btn_190604 {
        height: 2.8vh;
        right: 0;
        top: -9%;
    }
    #head .award_tag {
        bottom: 24%;
    }
    #foot .project-request {
        bottom: 0;
        width: auto;
    }
}
/*-------------------------------------------------------------------------------------아이패드 가로 모드 끝-----------------------------------------------------------------------------------------------*/
