.mbr{display:block;}
html{scroll-behavior: smooth;}

/*메뉴*/



.menu_all {position:fixed;display: block;width:100%;height:100%;background: #0038ffa1;left:0;top:0;z-index: -999;backdrop-filter: grayscale(1) blur(8px);opacity: 0;transition: .2s;}
.menu_all.visible{opacity:1;z-index: 9999;}
.menu_all .con{position: fixed;background: #fcfcf9;top: 0;right: -400px;width: 80%; max-width: 400px;height: 100%;z-index: 9999;opacity: 0;visibility: hidden;transition: 0.3s ease-in-out;display: flex;align-items: center;justify-content: center;box-shadow: -2px 0 20px 10px rgba(0,0,0,0.05);}
.menu_all.visible .con{opacity: 1;visibility: visible;right: 0;}
.menu_all .menu_btn {position: absolute;right: 10px;top: 10px;z-index: 99999;}
.menu_all .menu_btn a{display: block;width: 55px;height: 55px;border-radius: 19px;background: url('/img/close.svg')no-repeat center; background-size: 20px;}
.menu_all .con > ul{width:100%; padding:0 20px;}
.menu_all .con > ul > li {border-bottom:1px solid #eee;padding: 15px 0;}
.menu_all .con > ul > li:last-child{border:none;}
.menu_all .con > ul > li > a{padding: 10px 0;display:block;font-size: 26px;line-height: 1;font-weight: 600;letter-spacing: -.05rem;position: relative;text-align: left;transition: .2s;}
.menu_all .con > ul > li > a:hover{margin-left:3px;transform: skew(-15deg);/*font-style:italic;*/color:#0051ff;}
.menu_all .con > ul > li > a span{position: absolute;top: 13px;font-size: 14px;transition: .2s;height: 35px;background: #0051ff;color: #fff;line-height: 35px;display: inline-block;padding: 0 15px 0 12px;font-weight: 400;border-radius: 10px 10px 10px 0;opacity: 0;}
.menu_all .con > ul > li > a span::before{content:'';position:absolute;width:5px;height:4px;background:url('/img/tail.svg')no-repeat;}
.menu_all .con > ul > li > a:hover span{opacity: 1; margin-left: 12px;}
.menu_all .con > ul > li > ul{padding-bottom:10px;}
.menu_all .con > ul > li > ul > li{font-size: 19px;font-weight:400;position:relative;padding-left:20px;padding-bottom:10px;text-transform: uppercase;}
.menu_all .con > ul > li > ul > li::before{content:'';position:absolute; top:50%; left:4px; margin-top:-6px; background:#222;width:5px; height:2px;}
.menu_all .con > .txt_wrap {position:absolute; left:30px;bottom:60px;}
.menu_all .con > .txt_wrap .sns{margin-bottom:15px;}
.menu_all .con > .txt_wrap .sns a{width:40px;height:40px;border-radius: 10px;box-sizing: border-box;display: inline-block;margin-right: 6px;}
.menu_all .con > .txt_wrap .sns a.insta{background:#eee url('/img/insta_ico.svg')no-repeat center; background-size:28px}
.menu_all .con > .txt_wrap .sns a.kakao{background:#eee url('/img/kakao_ico.svg')no-repeat center; background-size:24px}
.menu_all .con > .txt_wrap .info{}
.menu_all .con > .txt_wrap .info p{font-size: 14px;font-weight:500;color: #222;display: inline-block;margin-right: 15px;}
.menu_all .con > .txt_wrap .info p a{display: block;padding-left: 20px;position: relative;}
.menu_all .con > .txt_wrap .info p.tell a::before{content:'';position:absolute;left:0;top: 50%;margin-top: -7.5px;width: 13px;height: 13px;background: url('/img/call_ico.svg')no-repeat;}
.menu_all .con > .txt_wrap .info p.mail a::before{content:'';position:absolute;left:0;top: 50%;margin-top: -5px;width: 14px;height: 10px;background: url('/img/e_ico.svg')no-repeat;}
#header.nav-up {/* top: -120px !important; */height:55px;background: #fff;box-shadow: 0px 8px 21px 0px rgb(4 0 0 / 5%);}
#header.nav-up .logo{width:70px; top:0; left:20px;}
#header.nav-up .menu_btn{top:0;right:0;}
#header.nav-up .menu_btn a{border:none;}






#header {clear: both;}
#header .menu{float: right;margin-right: 40px;}
#header .menu span{color: #fff; float: left; font-size: 24px; font-weight: 700; margin-left: 40px; line-height: 80px;transition: .2s;}

#header.nav-up {/* top: -120px !important; */height:60px;background: #1a44b9;}
#header.nav-up .logo{width:12%;max-width: 220px; line-height: 60px; left:40px;}
#header.nav-up .menu{margin-right: 40px;}
#header.nav-up .menu span{font-size: 18px; line-height: 60px;margin-left: 30px;}

#header.sub_header{background: #1a44b9;}


/*메인 비주얼*/
.visual {position: relative; width: 100%; height: 100vh; margin-bottom: 160px; overflow: hidden; background-image: url('/img/visual.jpg'); background-size: cover; background-position: center;}
.visual img {width: 100%; height: 100vh; opacity: 0;}

/*서브비주얼*/
.sub_visual{margin-bottom:45px}
.sub_visual .title{font-size:78px;font-weight: 800;font-style: italic;}

/*메인*/
#main .item_wrap{z-index: 1;position: relative;}
#main .item_wrap .item {margin-bottom: 160px; clear: both;scroll-margin-top: 100px; }
#main .item_wrap .item.trd {margin-bottom: 0;}
#main .item .tit {text-align: center; margin-bottom: 60px;}
#main .item .tit h2 {font-size: 50px; font-weight: 800;  color: #222; margin-bottom: 25px; letter-spacing: -1px;}
#main .item .tit p {font-size: 18px; line-height: 30px; color: #222; font-weight: 200; letter-spacing: -.25px;}

/*메인-01 brand*/
#main01.item .b_info {}
#main01.item .b_info ul {clear: both; width: 102%; margin-left: -2%;}
#main01.item .b_info ul li {float: left; margin-left: 2%; width: 31%;}
#main01.item .b_info ul li img {width: 100%;}
#main01.item .b_info .name {font-size: 26px; font-weight: 800; letter-spacing: -.5px; text-align: center;margin-top: 35px;}
#main01.item .b_info .name span {font-size: 18px;display: block;font-weight: 600;margin-top: 4px;}
#main01.item .b_info p{font-size: 16px;font-weight:300;line-height: 25px;margin-top: 20px;}

/*메인-02 wallpaper*/
#main02{}
#main02 ul.img_area{clear: both; overflow: hidden;}
#main02 ul.img_area li{width: 50%; float: left;}
#main02 ul.img_area li a{display: block; overflow: hidden;}
#main02 ul.img_area li a img{width: 100%; max-width: 640px;}
#main02 .wbtn{clear: both; text-align: center; margin: 30px;}
#main02 .wbtn a{transition:all .2s ease-in-out; font-size: 16px;display:inline-block;position:relative;cursor:pointer;min-width: 140px;height: 55px;line-height: 55px;color: #fff!important;background: #2050f5; box-sizing: border-box;text-align:center;font-weight: 600;}



/*02_project 프로젝트*/
#sub.project{}
#sub.project .con_wrap{}
#sub.project .con_wrap h1{text-align: center; font-size: 53px;font-weight: 800; letter-spacing: -1px;margin-bottom: 12px;}
#sub.project .con_wrap p.info_txt{text-align: center; font-size: 16px;font-weight: 300;letter-spacing: -.5px;}
#sub.project .con_wrap ul{width:100%; overflow:hidden; margin-top: 80px;}
#sub.project .con_wrap ul li{width:50%;float:left;position: relative;}
#sub.project .con_wrap ul li a{display:block;position: relative;}
#sub.project .con_wrap ul li a img{/* width:100%; *//* height: 100%; */display: block;}
#sub.project .con_wrap ul li a::after{opacity:0;content:"";position:absolute;left:0;top:0;width: 100%;height:100%;backdrop-filter:grayscale(1);/* background: linear-gradient(to top, #0051ff,  transparent); */background: #174ab7;mix-blend-mode: hard-light;-webkit-transition:all 0.7s cubic-bezier(0.54, 0.005, 0.155, 0.99);-moz-transition:all 0.7s cubic-bezier(0.54, 0.005, 0.155, 0.99);-ms-transition:all 0.7s cubic-bezier(0.54, 0.005, 0.155, 0.99);-o-transition:all 0.7s cubic-bezier(0.54, 0.005, 0.155, 0.99);transition: all 0.3s cubic-bezier(0.54, 0.005, 0.155, 0.99);}
#sub.project .con_wrap ul li a:hover::after{opacity:1;}
#sub.project .con_wrap ul li .scr{position:absolute;left:0;bottom:0;width:100%;display: table;z-index: 10;/* opacity: 0; */transition: all 0.3s ease-in-out;}
#sub.project .con_wrap ul li .scr p{display: table-cell;width:calc(100% - 90px);max-width: 250px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;font-size: 18px;font-weight: 600;color: #fff;margin-left: 30px;line-height: 1.2;vertical-align: bottom;padding: 0 20px 30px 30px;}

/*02-1 project_view 프로젝트 상세*/
.project_view .con.info{margin-bottom: 40px;background: #fff;overflow: hidden;}
.project_view .con.info .txt{text-align: center;}
.project_view .con.info .txt h3{font-size: 42px;font-weight: 700;line-height: 1;margin-bottom: 25px;}
.project_view .con.info .txt p{font-size: 14px;font-weight: 300;line-height: 1.5; color: #777;}
.project_view .con.info .txt p.type{margin-bottom:25px;}
.project_view .con.info .txt p.type span{font-size: 15px;font-weight: 300;margin-right: 30px;}
.project_view .con.info .txt p.type span em{font-size: 15px;font-weight: 600;}
.project_view .con_img{margin-top: 50px;padding-top: 50px;border-top:1px solid #ddd;margin-bottom: 50px;}
.project_view .con_img ul{width: 101%; margin-left: -1%;}
.project_view .con_img ul li{float: left;margin-left: 1%;width: 49%;}
.project_view .con_img ul li p{}
.project_view .con_img ul li img{width: 100%;}
.project_view .element{float: left;width: 49%;margin-right: 1%;}
.project_view .element h6{font-size: 15px;font-weight: 600;font-style: italic;border-bottom: 1px solid #ddd;padding-bottom: 10px;margin-bottom: 30px;}
.project_view .font{}
.project_view .font .font_img{}
.project_view .font img{width: auto;}
.project_view .color{}
.project_view .color .point{float: left;}
.project_view .color .point i{display: block;text-align: center;width: 130px;height: 25px;border-radius: 12.5px;}
.project_view .color .point p{text-align: center;font-size: 14px; font-weight: 600;line-height: 1.2;}
.project_view .color .point p span{font-weight: 300;color: #888;}
.project_view .con_wrap ul li p{text-align:center;}
.project_view .con_wrap ul li img {max-height: 1200px; height: 100%; width: auto; max-width: 1000px;text-align: center; display: inline-block; margin: 0 auto; margin-bottom: 20px;}

.list_btn{text-align: center; margin-top: 60px; }
.list_btn input{font-size: 14px;font-family: 'Montserrat';text-transform: uppercase;font-weight: 700;background: url('/img/list_ico.png')no-repeat 98% 2px;background-size: 13px;line-height: 1;padding: 0 45px 12px 0;border-bottom: 2px solid #222;}

.down_wrap{text-align: center;clear:both; width: 100%; max-width: 1000px; margin: 0 auto; margin-bottom: 40px;}
.down_wrap.w50 div{display:inline-block; width:49%;border: 1px solid #222; box-sizing:border-box;}
.down_wrap div a{display:block;font-size:18px;font-weight:500;height:50px;line-height:48px;box-sizing:border-box;text-align:center;color: #222; transition:.2s;}
.down_wrap div a:hover {color:#fff;background:#222222;}
.down_wrap.w100 div{width:100%;}

/*메인- 03 contact*/
.request{}

.request .table{position: relative;overflow: hidden;transition: .6s ease-in-out;}
.request .table form{}
.request .table table{margin-bottom: 50px;}
.request .table h5{text-align: left;font-weight: 600;font-size: 20px;line-height: 1;margin-bottom: 30px;}
.request .table .input_area:first-child{border-bottom: 1px solid #222;margin-bottom: 50px;}
.request .table .input_area:first-child td input{margin-bottom:0;}
.request .table h5 em{color: #0051ff; font-size: 24px; font-weight: 800;padding-right: 10px;}
.request .table tr{padding-bottom: 12px;}
.request .table tr td{margin-bottom: 24px;}
.request .table tr td + td{padding-left: 25px;}
.request .table tr td p{font-size: 15px;font-weight: 500;text-align: left;margin-bottom: 8px;}
.request .table tr td input[type=text], input[type=tel], input[type=email], input[type=date]{font-size: 16px;padding: 10px 18px;border: 1px solid #b9b8b8;border-radius: 5px;box-sizing: border-box;height: 56px;width: 100%;font-weight: 400;font-family: 'Montserrat','Noto Sans KR', sans-serif;margin-bottom: 25px;outline: none;}
.request .table td input::placeholder,textarea::placeholder{font-size:14px; font-weight:400; color:#aaa; font-family: 'Montserrat','Noto Sans KR', sans-serif;}
.request .table td input::placeholder,textarea::placeholder{font-size:14px; font-weight:400; color:#aaa; font-family: 'Montserrat','Noto Sans KR', sans-serif;}
.request .table td input::-webkit-placeholder,textarea::-webkit-placeholder{font-size:14px; font-weight:400; color:#aaa; font-family: 'Montserrat','Noto Sans KR', sans-serif;}
.request .table td input::-ms-placeholder,textarea::-ms-placeholder{font-size:14px; font-weight:400; color:#aaa; font-family: 'Montserrat','Noto Sans KR', sans-serif;}
.request .table td input::-mos-placeholder,textarea::-mos-placeholder{font-size:14px; font-weight:400; color:#aaa; font-family: 'Montserrat','Noto Sans KR', sans-serif;}
.request .table td textarea{width:100%;height: 230px;border-radius: 5px;padding: 15px;box-sizing: border-box;resize: none;outline: none;}
.request .btnSubmit{width: 185px;height: 65px;line-height: 65px;text-align: center;font-size: 18px;font-weight: 600;color: #fff;background: #0051ff;border-radius: 8px;display: block;margin: 0 auto 20px;}
.thankyou_message{font-size:16px;position: absolute;width: 100%;height: 100%;/*display: table !important;*/top: 0;left: 0;background: #ffffff82;backdrop-filter: blur(3px) grayscale(1);}
.thankyou_message h2{color: #222;display: table-cell;text-align: center;vertical-align: middle;font-weight: 300;font-size: 20px;}
.thankyou_message h2 em{display:block;/* text-transform: uppercase; */font-weight: 700;font-size: 48px;line-height: 1.2;color: #0051ff;margin-bottom: 10px;}