@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}
html,body, div, ul, li, p, figure, input, textarea{ font-family:'Pretendard', sans-serif; letter-spacing: 0}
ul,ol,li{list-style:none}
div{ box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
a,a:link,a:active,a:visited,a:hover{text-decoration:none;}
span,span:focus{outline:none;border:0;background:none;padding:0;margin:0}
blockquote, q{quotes:none}
blockquote:before, blockquote:after, q:before, q:after{content:'';content:none}
legend, caption span{position:absolute;left:-9999em;top:0;width:0.1%;height:0.1%;text-indent:-999em;overflow:hidden;visibility:hidden}
table{border-collapse:collapse;border-spacing:0}
input:focus{ outline:none; -webkit-tap-highlight-color :transparent;}
input,select,textarea{-webkit-appearance:none;font-size:inherit;color:inherit}
input[type="radio"]{-webkit-appearance:radio}
input[type="checkbox"]{-webkit-appearance:checkbox}
input{ border-radius: 0 !important;}
button{outline:0;border:none;border-radius:0;background:none}
a:focus,button:focus{outline:none}
h1, h2, h3, h4, h5, h6{font-weight:normal}
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none; margin:0}
input::-webkit-input-placeholder{ color:#cbcbcb;} 
textarea::-webkit-input-placeholder{ color:#cbcbcb;}
input::-ms-input-placeholder{ color:#cbcbcb;}
textarea::-ms-input-placeholder{ color:#cbcbcb;}
input::-moz-placeholder{ color:#cbcbcb;}
textarea::-moz-placeholder{ color:#cbcbcb;}
img{ max-width:100%; height:auto}

.eng{ font-family:'neue-haas-unica', sans-serif !important; letter-spacing: 0 !important}
.center{ width:100%; padding: 0 60px; box-sizing: border-box}
.center:after{ content: ""; display: block; clear: both}
.t_only{ display: none !important;}
.m_only{ display: none !important;}
.mobile{ display:none !important}
.disN{ display:none !important}
#coverBG{position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.7); z-index:1001}
.refresh{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(255,255,255,0.7); z-index:11111}
.refresh i{ position:absolute; top:50%; left:0; width:100%; text-align:center; transform:translateY(-50%); font-size:40px; color:#154050;}

#quick_kakao{ }
#quick_kakao img{ display:block;}
#quickBtn{ position:fixed; right:60px; bottom:50px; z-index:10; }
#quickBtn .requestBtn{ display: none}
#quickBtn .requestBtn img{ width: 77px;}

/* section animation */
.trans-up {opacity:0;}
.on .trans-up {
	animation:transUp 1s both;-webkit-animation:transUp 1s both;-ms-animation:transUp 1s both;
	transition:transform 1s cubic-bezier(.19,1,.22,1),opacity 1s cubic-bezier(.19,1,.22,1);
    -webkit-transition:transform 1s cubic-bezier(.19,1,.22,1),opacity 1s cubic-bezier(.19,1,.22,1);
    -ms-transition:transform 1s cubic-bezier(.19,1,.22,1),opacity 1s cubic-bezier(.19,1,.22,1);
}
.on .trans-up[data-delay-turn="1"] {animation-delay:.3s;}
.on .trans-up[data-delay-turn="2"] {animation-delay:.5s;}
.on .trans-up[data-delay-turn="3"] {animation-delay:.7s;}
.on .trans-up[data-delay-turn="4"] {animation-delay:.9s;}
.on .trans-up[data-delay-turn="5"] {animation-delay:1.1s;}
.on .trans-up[data-delay-turn="6"] {animation-delay:1.3s;}
.on .trans-up[data-delay-turn="7"] {animation-delay:1.5s;}
.on .trans-up[data-delay-turn="8"] {animation-delay:1.7s;}
.on .trans-up[data-delay-turn="9"] {animation-delay:1.9s;}
.on .trans-up[data-delay-turn="10"] {animation-delay:2.1s;}
.on .trans-up[data-delay-turn="11"] {animation-delay:2.3s;}

@keyframes transUp {
	0% {opacity:0;transform:translateY(50px);-webkit-transform:translateY(50px);-ms-transform:translateY(50px);}
	100% {opacity:1;transform:translateY(0);-webkit-transform:translateY(0);-ms-transform:translateY(0);}
}

@-webkit-keyframes transUp {
	0% {opacity:0;transform:translateY(50px);-webkit-transform:translateY(50px);-ms-transform:translateY(50px);}
	100% {opacity:1;transform:translateY(0);-webkit-transform:translateY(0);-ms-transform:translateY(0);}
}

@keyframes fadeIn {
	0% {opacity:0;}
	100% {opacity:1;}
}

/* Header */
header{ position:fixed; top:0; left:0; width:100%; padding: 20px 0; z-index:11;}
header .center{ position: relative;}
header .logo{ position: absolute; top: 50%; left: 60px; transform: translateY(-50%); display:block; transition:0.3s;}
header .logo img{ display: block; width: 185px}
header .right{ float:right; text-align:right;}
header .right a{ display:inline-block; vertical-align: middle;}
header .right a.btn_request{ line-height: 42px; font-size: 16px; font-weight: 600; color: #fff; padding: 0 22px; background-color: #ef4e1b; border-radius: 25px; margin-right: 40px;}
header .right a.btn_menu{}
header .right a.btn_menu img{ display: block; width: 35px;}
header.fixed{ background-color:rgba(0,0,0,0.05); backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px);}

/* footer */
footer{ padding:80px 0; background-color:#1f1f1f;}
footer .logo{ float: left;}
footer .logo img{ width: 220px;}
footer .rightBox{ float: right; width:75%;}
footer .rightBox .infoBox{ display:table; width:100%; border-collapse:collapse}
footer .rightBox .infoBox ul{ display:table-cell; width:33%; text-align:left; vertical-align:top}
footer .rightBox .infoBox ul li{ line-height:1.6;}
footer .rightBox .infoBox ul li:first-of-type{ font-size:18px; font-weight:200; color:#efebe8; font-family:'neue-haas-unica', sans-serif !important; letter-spacing: 0 !important}
footer .rightBox .infoBox ul li a{ font-size:30px;  color:#fff; font-family:'neue-haas-unica', sans-serif !important; letter-spacing: 0 !important}
footer .rightBox .infoBox ul li a img{ position: relative; width:20px;}
footer .rightBox .infoBox ul li a:hover img{ top: -5px;}
footer .rightBox .infoBox ul li span{ font-size:30px; font-weight: 200; color:#efebe8; font-family:'neue-haas-unica', sans-serif !important; letter-spacing: 0 !important}
footer .agreeBtn{ margin-top: 100px;}
footer .agreeBtn a{ font-size:16px; font-weight: bold; color: #fff;}
footer .bt_info{ font-size:14px; font-weight: 300; color:#efebe8; margin:20px 0; }
footer .bt_info span{line-height:1.4;}
footer .copyright{ font-size:14px; font-weight:500; color:#efebe8; font-family:'neue-haas-unica', sans-serif !important; letter-spacing: 0 !important}
#div-gpt-ad{ display:none}

/* 팝업:공통 */
.popup_full{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; padding: 0 60px; box-sizing: border-box; background-color: rgba(255,255,255,0.9); z-index: 1000;}
.popup_full .topBox{ position: absolute; top: 0; left: 0; width: 100%; padding: 25px 60px; box-sizing: border-box; z-index: 3}
.popup_full .topBox.fixed{ background-color:rgba(0,0,0,0.05); backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px);}
.popup_full .topBox .logo{ display: inline-block;}
.popup_full .topBox .logo img{ display: block; width: 185px;}
.popup_full .topBox .xBtn{ position: absolute; top: 25px; right: 60px;}
.popup_full .topBox .xBtn img{ display: block; width: 35px;}

/* 팝업:메뉴 */
nav .menu{ margin-top: 7vw; font-size: 0;}
nav .menu li{ display: inline-block; vertical-align: middle; width: 50%; padding: 20px 0;}
nav .menu li a{ position: relative; font-size: 4.5vw; font-weight: bold; color: #1f1f1f; font-family:'neue-haas-unica', sans-serif !important;}
nav .menu li a:hover{ top: -5px;}
nav .menu li a span{ position: relative; display: inline-block; vertical-align: super; line-height: 1.2; padding: 0 20px 3px; font-size: 1.4vw; color: #fff; background-color: #ef4e1b; border-radius: 30px; left: -30px; top: -10px;}
nav .menu li a.active{ color: #cbcbcb}
nav .sns{ margin-top: 6vw; padding-top: 4vw; border-top: 1px solid #1f1f1f; font-size: 0;}
nav .sns li{ display: inline-block; vertical-align: middle; width: 50%; margin-bottom: 30px}
nav .sns li a{}
nav .sns li a span{ display: inline-block; vertical-align: middle; font-size: 2vw; font-weight: 500; color: #1f1f1f; font-family:'neue-haas-unica', sans-serif !important;}
nav .sns li a img{ position: relative; display: inline-block; vertical-align: middle; width: 26px; margin-left: 10px;}
nav .sns li a:hover img{ top: -5px;}
nav .menuBox{ margin-top: 7vw; font-size: 0;}
nav .menuBox ul{ display: inline-block; vertical-align: top; width: 50%;}
nav .menuBox ul li{ padding: 20px 0;}
nav .menuBox ul li a{ position: relative; font-size: 2.5vw; font-weight: bold; color: #1f1f1f; font-family:'neue-haas-unica', sans-serif !important;}
nav .menuBox ul li a:hover{ top: -5px;}
nav .menuBox ul li a span{ position: relative; display: inline-block; vertical-align: super; line-height: 1.2; padding: 0 15px 3px; font-size: 1vw; color: #fff; background-color: rgba(239,78,27,0.9); border-radius: 30px; left: -30px; top: -10px;}
nav .menuBox ul li a span.blue{ background-color: rgba(142,180,206,0.9);}
nav .menuBox ul li a.active{ color: #cbcbcb}
nav .menuBox .menu1{}
nav .menuBox .menu1 li{ padding: 0;}
nav .menuBox .menu1 li a{ font-size: 4.5vw; }
nav .menuBox .menu2{ font-size: 0; text-align: left;}
nav .menuBox .menu2 .half{ display: inline-block; vertical-align: top; width: 50%;}
nav .menuBox .menu2 li{ margin-bottom: 20px}

/* 팝업:상담신청 */
.popup_full .contents{ position: relative; height: inherit; background-color: #fff;}
.popup_full .contents:before{ content: ""; position: absolute; top: 0; left: 0; width: 50%; height: 100%; background-color: #efebe8}
.popup_full .contents .halfBox{ font-size: 0; }
.popup_full .contents .halfBox .half{ display: inline-block; vertical-align: top; width: 50%; }
.popup_full .contents .slideBox{}
.popup_full .contents .slideBox .swiper-slide{ position: relative; height: 100vh; background-position: center; background-repeat: no-repeat; background-size: cover;}
.popup_full .contents .slideBox .slide01{ background-image:url("/img/home/request_slide_04.jpg");}
.popup_full .contents .slideBox .slide02{ background-image:url("/img/home/request_slide_05.jpg");}
.popup_full .contents .slideBox .slide03{ background-image:url("/img/home/request_slide_06.jpg");}
.popup_full .contents .slideBox .swiper-slide .text01{ position: absolute; left: 80px; bottom: 175px; font-size: 60px; font-weight: 500; color: #fff; line-height: 1.2; letter-spacing: 0; z-index: 2}
.popup_full .contents .slideBox .swiper-slide .text02{ position: absolute; right: 80px; bottom: 180px; font-size: 30px; font-weight: 500; color: #fff; line-height: 1.2; letter-spacing: 0; z-index: 2}
.popup_full .contents .formBox{ position: relative; padding: 100px; box-sizing: border-box;}
.popup_full .contents .formBox .title{ font-size: 38px; font-weight: bold; color: #1f1f1f; margin-bottom: 60px;}
.popup_full .contents .formBox .form_list{}
.popup_full .contents .formBox .form_list *{ letter-spacing: -0.03em;}
.popup_full .contents .formBox .form_list ul{ margin-bottom: 50px; font-size: 0;}
.popup_full .contents .formBox .form_list ul:last-child{ margin-bottom: 0}
.popup_full .contents .formBox .form_list ul li{ display: inline-block; vertical-align: middle; width: calc(50% - 30px); font-size: 0;}
.popup_full .contents .formBox .form_list ul li:first-child{ margin-right: 60px;}
.popup_full .contents .formBox .form_list ul .full{ display: block; width:100% !important; margin-right: 0 !important}
.popup_full .contents .formBox .form_list ul li .form_title{ display: inline-block; vertical-align: middle; width: 70px; font-size: 24px; font-weight: bold; color: #1f1f1f;}
.popup_full .contents .formBox .form_list ul li .form_title span{ display: inline-block; vertical-align: top; width: 6px; height: 6px; border-radius: 50%; background-color: #ef4e1b; margin-left: 5px;}
.popup_full .contents .formBox .form_list ul li .inputBox{ display: inline-block; vertical-align: middle; width: calc(100% - 70px); height: 40px;}
.popup_full .contents .formBox .form_list ul li .inputBox input{ display: block; width: 100%; height: 100%; border: none; border-bottom: 1px solid #1f1f1f; background-color: transparent; outline: none; font-size: 16px; font-weight: 500; color: #1f1f1f; padding: 0; box-sizing: border-box;}
.popup_full .contents .formBox .form_list ul li .inputBox input:focus{ border-bottom-width: 2px;}
.popup_full .contents .formBox .form_list ul li .borderN input{ border: none !important}
.popup_full .contents .formBox .form_list ul li p{ display: inline-block; vertical-align: middle; font-size: 18px; color: #1f1f1f; margin-left: 10px;}
.popup_full .contents .formBox .form_list ul li p.dash{ margin: 0 15px;}
.popup_full .contents .formBox .form_list ul li.phone .form_title{ width: 100px;}
.popup_full .contents .formBox .form_list ul li.phone .inputBox{ width: calc(50% - 108px);}
.popup_full .contents .formBox .form_list ul li.phone .borderN{ width:40px !important;}
.popup_full .contents .formBox .form_list ul li.budget .form_title{ width: 120px;}
.popup_full .contents .formBox .form_list ul li.budget .inputBox{ width: calc(100% - 161px);}
.popup_full .contents .formBox .form_list ul li .pyBox{ display: inline-block; vertical-align: middle; width: calc(100% - 70px); font-size: 0;}
.popup_full .contents .formBox .form_list ul li .pyBox input[type=radio]{ display: none;}
.popup_full .contents .formBox .form_list ul li .pyBox input[type=radio] + label{ display: inline-block; vertical-align: middle; width: 99px; line-height: 45px; font-size: 16px; color: #1f1f1f; text-align: center; border: 1px solid #efebe8; border-radius: 5px; margin-right: 10px; cursor: pointer}
.popup_full .contents .formBox .form_list ul li .pyBox input[type=radio]:checked + label{ background-color: #efebe8; border-color: #1f1f1f;}
.popup_full .contents .formBox .form_list ul li .pyBox .inputBox{ width: calc(100% - 249px);;}
.popup_full .contents .formBox .form_list .halfBox2{ font-size: 0; margin-bottom: 60px;}
.popup_full .contents .formBox .form_list .halfBox2 .half2{ display: inline-block; vertical-align: top; width: calc(50% - 30px);}
.popup_full .contents .formBox .form_list .halfBox2 .half2:first-child{ margin-right: 60px;}
.popup_full .contents .formBox .form_list .halfBox2 .half2 .form_title{ display: block; width: 100%; margin-bottom: 20px;}
.popup_full .contents .formBox .form_list .form_notice{ font-size: 14px; font-weight: 300; color: #ef4e1b; line-height: 1.4; margin-top: 5px; margin-bottom: 10px;}
.popup_full .contents .formBox .form_list .halfBox2 .half2 ul li{ display: block; width: 100%; margin-right: 0 !important}
.popup_full .contents .formBox .form_list .halfBox2 .half2 ul li .inputBox{ width:100%}
.popup_full .contents .formBox .form_list ul li .rootBox{ font-size: 0;}
.popup_full .contents .formBox .form_list ul li .rootBox input[type=radio]{ display: none;}
.popup_full .contents .formBox .form_list ul li .rootBox input[type=radio] + label{ display: inline-block; vertical-align: middle; width: calc(33.33% - 9px); line-height: 45px; font-size: 16px; color: #1f1f1f; text-align: center; border: 1px solid #efebe8; border-radius: 5px; margin-right: 10px; margin-bottom: 10px; cursor: pointer}
.popup_full .contents .formBox .form_list ul li .rootBox input[type=radio] + label:nth-of-type(3n){ margin-right: 0}
.popup_full .contents .formBox .form_list ul li .rootBox input[type=radio]:checked + label{ background-color: #efebe8; border-color: #1f1f1f;}
.popup_full .contents .formBox .form_list ul li .textArea{ width: 100%; height: 253px; border-left: 1px solid #1f1f1f; border-right: 1px solid #1f1f1f; box-sizing: border-box}
.popup_full .contents .formBox .form_list ul li .textArea textarea{ display: block; width: 100%; height: 100%; font-size: 16px; color: #1f1f1f; padding: 0 15px; box-sizing: border-box; border: none; background-color: transparent; resize: none;}
.popup_full .contents .formBox .form_list ul li .uploadBox{ display:inline-block; vertical-align:middle}
.popup_full .contents .formBox .form_list ul li .uploadBox input{ display:none;}
.popup_full .contents .formBox .form_list ul li .uploadBox label{ display:inline-block; vertical-align:middle; width:110px; height:110px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; padding:25px 0; text-align:center; cursor:pointer}
.popup_full .contents .formBox .form_list ul li .uploadBox label i{ font-size:30px; color:#1f1f1f;}
.popup_full .contents .formBox .form_list ul li .uploadBox label p{ display: block; font-size:16px; color:#1f1f1f; margin:5px 0 0;}
.popup_full .contents .formBox .form_list ul li .notice{ display: block; font-size:16px; font-weight: 300; color:#b2b2b2; margin-top:10px; margin-bottom: 20px;}
.popup_full .contents .formBox .form_list ul li .img_list{ display:inline-block; vertical-align:middle}
.popup_full .contents .formBox .form_list ul li .img_list .imgBox{ position:relative; display:inline-block; vertical-align:middle; width:110px; height:110px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; text-align:center; margin-right:10px; }
.popup_full .contents .formBox .form_list ul li .img_list .imgBox > img{ width:100%; height:100%; border-radius:5px; z-index:1}
.popup_full .contents .formBox .form_list ul li .img_list .imgBox .img_delete{ position:absolute; top:2px; right:2px; display:block; padding:5px 5px 6px; border-radius:50%; background-color:rgba(0,0,0,0.3); z-index:2;}
.popup_full .contents .formBox .form_list ul li .img_list .imgBox .img_delete img{ display:block; width:8px;}
.popup_full .contents .formBox .agreeBox{ margin-top: 40px;}
.popup_full .contents .formBox .agreeBox img{ display: inline-block; vertical-align: middle; margin-right: 10px; width: 22px;}
.popup_full .contents .formBox .agreeBox .agreeBtn{ display: inline-block; vertical-align: middle; font-size: 22px; font-weight: 500; color: #1f1f1f; border-bottom: 1px solid #1f1f1f;}
.popup_full .contents .formBox .agreeBox span{ display: inline-block; vertical-align: middle; font-size: 22px; font-weight: 300; color: #1f1f1f; margin-left: 10px;}
.popup_full .contents .formBox .requestBtn{ position: absolute; bottom: 100px; right: 100px; display: flex; align-items: center; justify-content: center; width: 280px; height: 70px; font-size: 22px; font-weight: bold; color: #fff; text-align: center; background-color: #ef4e1b; border-radius: 50px;}



main section{ position: relative; overflow: hidden}
main section h1{ font-size: 4vw; font-weight: bold; color: #1f1f1f;}
main section h2{ font-size: 34px; font-weight: 600; color: #1f1f1f;}
main section h3{ font-size: 24px; font-weight: 500; color: #1f1f1f;}
main section h4{ font-size: 20px; color: #1f1f1f;}
main section h5{}
main section .triple{ display: flex; justify-content: space-between; padding: 60px 300px 60px 30px;}
main section .triple li{ width: 34%; padding: 0 30px; box-sizing: border-box}
main section .triple li:last-child{ margin-top: 15px}
main section .triple li .text{ line-height: 1.8;}
main section .triple li a{display: block;}
main section .triple li .swiper-slide{}
main section .triple li .swiper-slide img{ display:block; width: 100%;}
main section .triple li h3{ margin-top: 20px;}
main section .triple li .subject{ line-height: 1.2; margin-bottom: 20px;}
main section .triple li .moreBtn{ margin-top: 50px;}
main section .triple li .moreBtn span{ display: inline-block; font-size: 22px; font-weight: 500; color: #ef4e1b; border-bottom: 2px solid #ef4e1b; padding-bottom: 4px; font-family:'neue-haas-unica', sans-serif !important;}
main section.secBt{ padding: 0 !important;}
main section.secBt .halfBox{ font-size: 0;}
main section.secBt .halfBox .half{ position: relative; display: inline-block; width: 50%;}
main section.secBt .halfBox .half .pc_only{ display: block; width: 100%;}
main section.secBt .halfBox .half .textBox{ position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; text-align: center; z-index: 2}
main section.secBt .halfBox .half .textBox h1{ color: #fff;}
main section.secBt .halfBox .half .textBox div{ font-size: 3vw; font-weight: 500; color: #fff;}
main section.secBt .halfBox .half .textBox a{ position: relative; display: inline-block; font-size: 20px; font-weight: 500; color: #fff; margin-top: 30px;}
main section.secBt .halfBox .half .textBox a:before{ content: ""; position: absolute; left: 0; bottom: -5px; width: 100%; height: 2px; background-color: #fff;}


/* main */
#main section .visual_title{ position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; font-size: 3vw; font-weight: 500; color: #fff; text-align: center; z-index: 5; letter-spacing: 0.25em;}
#main section .visual_title span{ opacity:0; display:inline-block; animation:visualTitleFade 1s ease forwards;}
#main section .visual_title span:nth-child(1){ animation-delay:.1s;}
#main section .visual_title span:nth-child(2){ animation-delay:.8s;}
#main section .visual_title span:nth-child(3){ animation-delay:1.5s;}
@keyframes visualTitleFade{
    from{opacity:0;}
    to{opacity:1;}
}
#main section .visualSwiper{ position: relative; height: 100vh;}
#main section .visualSwiper .swiper-slide{ overflow: hidden}
#main section .visualSwiper .swiper-slide > div{ position: relative; height:inherit; background-position: center; background-position: center; background-size: cover; transition: 4s;}
#main section .visualSwiper .swiper-slide p{ position:absolute; left: 60px; bottom: 50px; font-size: 20px; font-weight: 400; color: #fff; font-family:'neue-haas-unica', sans-serif !important;}
#main section .visualSwiper .swiper-slide .slide01{ background-image:url(/img/home/main_visual_01.jpg?3);}
#main section .visualSwiper .swiper-slide .slide02{ background-image:url(/img/home/main_visual_02.jpg?3); transform: scale(1.04);}
#main section .visualSwiper .swiper-slide .slide03{ background-image:url(/img/home/main_visual_03.jpg?3);}
#main section .visualSwiper .swiper-slide-active .slide01{ transform: scale(1.04);}
#main section .visualSwiper .swiper-slide-active .slide02{ transform: scale(1);}
#main section .visualSwiper .swiper-slide-active .slide03{ transform: scale(1.04);}
#main section .visualSwiper .explore{ position:absolute; left: 0; bottom: 110px; width: 100%; text-align: center; z-index: 2}
#main section .visualSwiper .explore .circle{ position:absolute; top: -110px; left: 50%; margin-left: -120px; display:block; width: 240px; animation: rotate_image 20s linear infinite;}
#main section .visualSwiper .explore p{ display: block; font-size:20px; font-weight: 400; color: #fff; margin: 0 auto; font-family:'neue-haas-unica', sans-serif !important;}
#main section .visualSwiper .explore .arrow_down{ display: inline-block; margin-top: 15px; /*animation: rotate_arrow 8.3s infinite;*/}
#main section .visualSwiper .swiper-pagination{ position: absolute; left: 0; bottom: 0; width: 100%; line-height: 0; z-index: 2;}
#main section .visualSwiper .swiper-pagination span{ width:33.3333%; height: 5px; border-radius: 0; background-color: #fff; opacity: 0.8; margin: 0;}
#main section .visualSwiper .swiper-pagination .swiper-pagination-bullet-active{ background-color: #ef4e1b; opacity: 1;}
#main section .visual_video{ position: relative; height: 100vh;}
#main section .visual_video .main_visual_video{ position:relative; width:100%; height:100vh; overflow:hidden; background:#000;}
#main section .visual_video .main_visual_video .main_visual_iframe{ position:absolute; top:50%; left:50%; width:100vw; height:56.25vw; min-width:177.78vh; min-height:100vh; transform:translate(-50%,-50%); border:0; z-index:1; opacity:0; transition:opacity .35s ease; display:block; background:#000;}
#main section .visual_video .main_visual_video .main_visual_iframe.is_show{ opacity:1;}
#main section .visual_video .main_visual_video .main_visual_poster{ position:absolute; inset:0; z-index:2; background-position:center; background-size:cover; background-repeat:no-repeat; opacity:1; visibility:visible; transition:opacity .35s ease;}
#main section .visual_video .main_visual_video .main_visual_poster.hide{ opacity:0; visibility:hidden; pointer-events:none;}
#main section .visual_video .main_visual_video .pc_main_iframe, 
#main section .visual_video .main_visual_video .pc_main_poster{display:block;}
#main section .visual_video .main_visual_video .mobile_main_iframe, 
#main section .visual_video .main_visual_video .mobile_main_poster{ display:none;}
#main section .visual_video .main_visual_video .video_container{ width:100%; height:100%;}
#main section .visual_video .main_visual_video .video_container iframe{ display: block; position:absolute; top: 0; left: 0; width:100%; height:100%; z-index: 0;}
#main section .visual_video .main_visual_video .video_text{ position:absolute; left: 60px; bottom: 50px; font-size: 20px; font-weight: 400; color: #fff; font-family:'neue-haas-unica', sans-serif !important;}
#main section .visual_video .main_visual_video .video_text span{}
#main section .visual_video .explore{ position:absolute; left: 0; bottom: 110px; width: 100%; text-align: center; z-index: 2}
#main section .visual_video .explore .circle{ position:absolute; top: -110px; left: 50%; margin-left: -120px; display:block; width: 240px; animation: rotate_image 20s linear infinite;}
#main section .visual_video .explore p{ display: block; font-size:20px; font-weight: 400; color: #fff; margin: 0 auto; font-family:'neue-haas-unica', sans-serif !important;}
#main section .visual_video .explore .arrow_down{ display: inline-block; margin-top: 15px; /*animation: rotate_arrow 8.3s infinite;*/}
#main section .visual_video .swiper-pagination{ position: absolute; left: 0; bottom: 0; width: 100%; line-height: 0; z-index: 2;}
#main section .visual_video .swiper-pagination span{ width:33.3333%; height: 5px; border-radius: 0; background-color: #fff; opacity: 0.8; margin: 0;}
#main section .visual_video .swiper-pagination .swiper-pagination-bullet-active{ background-color: #ef4e1b; opacity: 1;}
#main section.sec02{ padding: 100px 0 60px; background-color: #efebe8;}
#main section.sec02 h1{ padding: 0 60px; font-family:'neue-haas-unica', sans-serif !important;}
#main section .midSwiper{ position: relative; height: 100vh;}
#main section .midSwiper .swiper-slide{ position: relative; height:inherit; background-position: center; background-position: center; background-size: cover;}
#main section .midSwiper .slide01{ background-image:url(/img/home/main_middle_slide_01.jpg);}
#main section .midSwiper .slide02{ background-image:url(/img/home/main_middle_slide_02.jpg);}
#main section .midSwiper .slide03{ background-image:url(/img/home/main_middle_slide_03.jpg);}
#main section .midSwiper .textBox{ position:absolute; left: 0; bottom: 80px; width:100%; text-align: left; padding: 0 60px; box-sizing: border-box}
#main section .midSwiper .textBox .number{ color: #fff; letter-spacing: 0; font-family:'neue-haas-unica', sans-serif !important;}
#main section .midSwiper .textBox .subject{ font-size: 3vw; font-weight: 500; color: #fff; margin-top: 10px; font-family:'neue-haas-unica', sans-serif !important; letter-spacing: 0;}
#main section .midSwiper .textBox .text{ color:#fff; margin-top: 20px; line-height: 1.8;}
#main section .midSwiper .textBox .moreBtn{ display: inline-block; margin-top: 30px;}
#main section .midSwiper .textBox .moreBtn span{ display: inline-block; font-size: 22px; font-weight: 500; color: #fff; border-bottom: 2px solid #fff; padding-bottom: 4px; font-family:'neue-haas-unica', sans-serif !important;}
#main section .midSwiper .swiper-pagination{ position: absolute; left: 0; bottom: 0; width: 100%; line-height: 0; z-index: 2;}
#main section .midSwiper .swiper-pagination span{ width:33.3333%; height: 5px; border-radius: 0; background-color: #fff; opacity: 0.8; margin: 0;}
#main section .midSwiper .swiper-pagination .swiper-pagination-bullet-active{ background-color: #ef4e1b; opacity: 1;}
#main section.sec04{ padding:100px 60px 120px;}
#main section.sec04 .section_title{}
#main section.sec04 .section_text{ line-height: 1.8; margin-top: 50px;}
#main section.sec04 .moreBtn{ display: inline-block; margin-top: 40px;}
#main section.sec04 .moreBtn span{ display: inline-block; font-size: 22px; font-weight: 500; color: #ef4e1b; border-bottom: 2px solid #ef4e1b; padding-bottom: 4px; font-family:'neue-haas-unica', sans-serif !important;}
#main section.sec04 .makeSenseSwiper{}
#main section.sec04 .makeSenseSwiper .swiper-slide{ padding: 0 320px; background-color: #fff;}
#main section.sec04 .makeSenseSwiper .swiper-slide img{ display: block; max-width: 100%; margin: 0 auto}
#main section.sec05{ padding-bottom: 56.25%;}
#main section.sec05 iframe{ display: block; position:absolute; top: 0; left: 0; width:100%; height:100%; z-index: 0;}
#main section.sec05 .textBox{ position:absolute; left: 0; top: 50%; transform: translateY(-50%); width:100%; text-align: left; padding: 0 60px; box-sizing: border-box}
#main section.sec05 .textBox .number{ color: #fff; letter-spacing: 0; font-family:'neue-haas-unica', sans-serif !important;}
#main section.sec05 .textBox .subject{ font-size: 3vw; font-weight: 500; color: #fff; margin-top: 10px; font-family:'neue-haas-unica', sans-serif !important; letter-spacing: 0;}
#main section.sec05 .textBox .text{ color:#fff; margin-top: 20px; line-height: 1.8;}
#main section.sec05 .textBox .moreBtn{ display: inline-block; margin-top: 30px;}
#main section.sec05 .textBox .moreBtn span{ display: inline-block; font-size: 22px; font-weight: 500; color: #fff; border-bottom: 2px solid #fff; padding-bottom: 4px; font-family:'neue-haas-unica', sans-serif !important;}
main section.sec06{ padding: 100px 60px 200px; background-color: #efebe8;}
main section.sec06 .projects{ font-size: 2vw; font-weight: 500; color: #c5c4c4; font-family:'neue-haas-unica', sans-serif !important;}
main section.sec06 .tabBox{ margin-top: 40px; font-size: 0;}
main section.sec06 .tabBox a{ display: inline-block; vertical-align: middle; font-size: 3.5vw; font-weight: 600; color: #1f1f1f; margin-right: 80px; font-family:'neue-haas-unica', sans-serif !important;}
main section.sec06 .tabBox a.on{ position: relative;}
main section.sec06 .tabBox a.on:before{ content: ""; position: absolute; left: 0; bottom: -20px; width: 100%; height: 10px; background-color: #1f1f1f;}
main section.sec06 .moreBtn{ position: absolute; right: 60px; bottom: 100px;}
main section.sec06 .moreBtn span{ display: inline-block; vertical-align: middle; font-size: 3.5vw; font-weight: 500; color: #fff; font-family:'neue-haas-unica', sans-serif !important;}
main section.sec06 .moreBtn img{ display: inline-block; vertical-align: middle; width: 2.5vw; max-width: 61px; margin-left: 20px;}
main section.sec06 .projects_list{ margin-top: 80px;}
main section.sec06 .projects_list li{ display: inline-block; vertical-align: top; width:22%; margin-right: 3vw;}
main section.sec06 .projects_list li a{ display: block;}
main section.sec06 .projects_list li figure{ overflow: hidden;}
main section.sec06 .projects_list li figure img{ display: block; transition: 0.3s;}
main section.sec06 .projects_list li:hover figure img{ transform: scale(1.1);}
main section.sec06 .projects_list li .textBox{ margin-top: 20px;}
main section.sec06 .projects_list li .textBox .subject{ line-height: 1.2;}

@keyframes rotate_arrow{ 
	0% { transform: rotateY(180deg);}
	10% { transform: rotateY(0);}
	49.99% { transform: rotateY(0);}
	50% { transform: rotateY(180deg);}
	60% { transform: rotateY(0);}
	100% { transform: rotateY(0);}
}


/* about */
#about section .triple{ padding-top: 100px; padding-bottom: 100px;}
#about section.sec02{ background-color: #efebe8;}
#about section.sec03{ display: flex; justify-items: center; flex-direction: column; justify-content: center; height: 100vh; padding: 0 60px; box-sizing: border-box; background-image: url("/img/home/about_essentials_bg.jpg?1"); background-position: center; background-repeat: no-repeat; background-size: cover; box-sizing: border-box;}
#about section .visual_title{ position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; font-size: 4.5vw; color: #fff; text-align: center; z-index: 5; font-family:'neue-haas-unica', sans-serif !important;}
#about section .visualSwiper{ position: relative; height: 100vh;}
#about section .visualSwiper .swiper-slide{ position: relative; height:inherit; background-position: center; background-position: center; background-size: cover;}
#about section .visualSwiper .swiper-slide.slide01{ background-image:url(/img/home/about_visual_off.jpg)}
#about section .visualSwiper .swiper-slide.slide02{ background-image:url(/img/home/about_visual_on.jpg)}
#about section.sec03 .halfBox{ margin-top: 100px}
#about section.sec03 .halfBox .half:last-child{ padding-right: 200px;}
#about section .halfBox{ font-size: 0; }
#about section .halfBox .half{ display: inline-block; vertical-align: middle; width: 50%;}
#about section .halfBox .half .essentials{}
#about section .halfBox .half .essentials li{ margin-top: 100px}
#about section .halfBox .half .essentials li:first-child{ margin-top: 0}
#about section .halfBox .half .essentials li .text01{ font-size: 60px; font-weight: bold; color: #fff;}
#about section .halfBox .half .essentials li .text02{ font-weight: 300; color: #fff; margin-top: 10px;}
#about section .halfBox .half .circle_title{ font-size: 60px; font-weight: bold; color: #fff; text-align: center; margin-bottom: 40px; font-family:'neue-haas-unica', sans-serif !important;}
#about section .halfBox .half .circleBox{ position: relative;}
#about section .halfBox .half .circleBox .circle{ display: block; width: 22vw; margin: 0 auto; animation: rotate_image 20s linear infinite; transform-origin: 50% 50%;}
#about section .halfBox .half .circleBox .circle_lil{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 9vw; z-index: 1}
@keyframes rotate_image{ 100% { transform: rotate(360deg);}}
#about section.sec03 .section_title{ color: #fff;}
#about section.sec04{ padding: 150px 60px;}
#about section.sec04 .section_subTitle{ color: #1f1f1f; margin-top: 20px;}
#about section.sec04 .organizations{ position:relative; display: inline-block; vertical-align: top; margin-left: 40px; margin-top: 60px;}
#about section.sec04 .organizations:before{ content: ""; position: absolute; top: 35px; left: -40px; width: 2px; height: 492px; background-color: #ef4e1b;}
#about section.sec04 .organizations li{ margin-bottom: 60px;}
#about section.sec04 .organizations li .text01{ position:relative; font-size: 60px; font-weight: bold; color: #1f1f1f;}
#about section.sec04 .organizations li .text01:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: -40px; width: 30px; height: 2px; background-color: #ef4e1b;}
#about section.sec04 .organizations li .text02{ font-size: 22px; color: #1f1f1f; margin-top: 10px;}
#about section.sec04 figure{ display: block; margin-top: 150px; text-align: left;}
#about section.sec04 figure.pc_only img{ display: inline-block; vertical-align: top;}
#about section.sec04-1{ padding-bottom: 250px;}


/* service */
#service{}
#service section h1{  margin-bottom: 60px}
#service section .subTitle{ font-size: 2.2vw; font-weight: bold; color: #1f1f1f;}
#service section h4{ margin-top: 30px; line-height: 1.8;}
#service section{ padding: 150px 60px; box-sizing: border-box; overflow: hidden;}
#service section .swiper-container{ margin-top: 4vw;}
#service section .swiper-slide{}
#service section .swiper-slide img{ display: block; max-width: 100%; margin: 0 auto;}
#service section.sec01{ width: 100%; height: 100vh; background-image: url("/img/home/service_visual_260128.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover;}
#service section.sec01 .textBox{ position: absolute; top: 50%; transform: translateY(-50%); left: 60px; text-align: left; z-index: 2}
#service section.sec01 .textBox .visual_title{ font-size: 3.8vw; font-weight: bold; color: #fff; letter-spacing: 0; font-family:'neue-haas-unica', sans-serif !important;}
#service section.sec01 .textBox .visual_text{ font-size: 20px; color: #fff; line-height: 1.8; margin-top: 3vw; font-weight: 300;}
#service section.sec02{ background-color: #efebe8}
#service section.sec02 figure{ position: relative; max-width: 1920px; margin: 60px auto 0;}
#service section.sec02 figure img{ display: block; width: 100%;}
#service section.sec02 figure img.process1_on{ position: absolute; top: 0; left: 0; opacity: 0; animation:fadeInOut 4s both infinite;-webkit-animation:fadeInOut 4s both infinite;-ms-animation:fadeInOut 4s both infinite; z-index: 2}

#service section.sec03 .swiper-container{ position: relative; margin-top: -5vw; padding-right: 8vw; z-index: -1;}
#service section.sec03 .swiper-slide{ text-align: right;}
#service section.sec03 .swiper-slide img{ display: inline-block; max-width: 75%}
#service section.sec04 .swiper-container{}
#service section.sec04 .swiper-slide figure{ text-align: center; background-color: #fff;}
#service section.sec04 .swiper-slide img{ display: inline-block; vertical-align: middle; margin: 0 auto;}
#service section.sec04 .swiper-slide img:first-child{ max-width: 35%; margin-right: 300px}
#service section.sec04 .swiper-slide img:last-child{ max-width: 15%;}
#service section.sec04-1{ position: relative; padding-bottom: 0; padding-top: 100px}
#service section.sec04-1 .swiper-container{ width:50%; overflow: hidden; margin: 0; }
#service section.sec04-1 .swiper-slide{ text-align: center; background-color: #fff}
#service section.sec04-1 .swiper-slide img{ display:inline-block; max-width: 75%;}
#service section.sec04-1 .videoBox{ position:absolute; bottom:0; right: 0; width:50%; height: 100%;}
#service section.sec04-1 .videoBox iframe{ display: block; position:absolute; top: 0; right: 0; width:95%; height:103%; z-index: 0;}
#service section.sec05{ position: relative; padding: 0;}
#service section.sec05 .titleBox{ position: absolute; left: 60px; top: 100px; z-index: 2;}
#service section.sec05 .subTitle,
#service section.sec05 h4{ color: #fff;}
#service section.sec05 .swiper-container{ margin: 0}

#service section.sec05-1 .halfBox{ font-size: 0; margin-top: 100px;}
#service section.sec05-1 .halfBox .half{ display: inline-block; vertical-align: top; width: 50%; }
#service section.sec05-1 .slideBox{ position: relative; text-align: center; padding: 0 6vw;}
#service section.sec05-1 .slideBox .phone_mocup{ position: absolute; top: 0; left: 0; width: 100%;}
#service section.sec05-1 .slideBox .phone_mocup img{ display: inline-block;}
#service section.sec05-1 .slideBox .swiper-container{ z-index: 2}
#service section.sec05-1 .slideBox .swiper-slide img{ display: inline-block;}
#service section.sec05-1 .slideBox .swiper-slide .text01,
#service section.sec05-1 .slideBox .swiper-slide .text02{ display: none;}
#service section.sec05-1 .slideBox .swiper-pagination{ display: none;}
#service section.sec05-1 .slide_text{ padding-left: 40px;}
#service section.sec05-1 .slide_text li{ margin-bottom: 120px; }
#service section.sec05-1 .slide_text li *{ color: #cbcbcb;}
#service section.sec05-1 .slide_text li h2{ font-size: 1.8vw}
#service section.sec05-1 .slide_text li.active *{ color: #1f1f1f;}
#service section.sec06{ padding: 100px 60px 200px;}
#service section.section_styling{ padding-right:150px;}
#service section.section_styling .slideBox{ position: relative; width: 100%; height: 40vw; overflow: hidden; margin-top: 5vw; }
#service section.section_styling .styling_slide { position: absolute; width:100%; inset: 0; opacity: 0;	visibility: hidden;	pointer-events: none; transition: opacity 600ms ease, visibility 0ms linear 600ms; display: grid; grid-template-columns: 1.35fr 0.9fr 0.75fr;	column-gap: 150px; align-items: center; justify-items: center; z-index: 0;}
#service section.section_styling .styling_slide.is-active {	opacity: 1;	visibility: visible; pointer-events: auto; transition: opacity 600ms ease, visibility 0ms linear 0ms; z-index: 2;}
#service section.section_styling .styling_slide:not(.is-active) img { opacity: 0 !important;}
#service section.section_styling .panel { width: 100%; height: 100%; display: flex;	align-items: center; justify-content: center;}
#service section.section_styling .panel img { max-width: 100%; max-height: 100%; object-fit: contain; opacity: 0; transition: opacity 700ms ease; will-change: opacity; user-select: none; -webkit-user-drag: none;}
#service section.section_styling .panel img.is-visible { opacity: 1;}
#service section.section_styling_view{ padding:0}
#service section.section_styling_view *{ margin: 0}
#service section.section_styling_view .swiper-slide img{ width:100%;}

#episodes{ padding: 100px 0}
#episodes .circle_head{ display: none}
#episodes #list_skin{ font-size: 0; margin-top: 0; padding-left: 50%;}
#episodes #list_skin .leftBox{ position: fixed; top: 50%; left: 0; transform: translateY(-50%); width: 50%; }
#episodes #list_skin .rightBox{}
#episodes #list_skin .circleBox{}
#episodes #list_skin .circleBox figure{ position: relative; width: 70%; max-width: 600px; margin: 0 auto;}
#episodes #list_skin .circleBox figure .circle{ position: absolute; top: 0; left: 0; display: block; width: 100%;}
#episodes #list_skin .circleBox figure .circle_episodes{ display: block; width: 100%;}
#episodes #list_skin .circleBox .text{ font-size: 24px; color: #1f1f1f; text-align: center; margin-top: 40px;}
#episodes #list_skin .episodes_list{ height: auto;}
#episodes #list_skin .episodes_list li{ position: relative; cursor: pointer; margin-bottom: 50px;}
#episodes #list_skin .episodes_list li input[type=checkbox]{ position: absolute; top: 10px; left: 10px; z-index: 10;}
#episodes #list_skin .episodes_list li figure img{ display: block; max-width: 100%;}
#episodes #list_skin .episodes_list li .subject{ font-size: 30px; font-weight: bold; color: #1f1f1f; margin-top: 10px;}
#episodes .btnBox{ padding-left: 50%; text-align: left; margin-top: 20px;}
#episodes .btnBox button,
#episodes .btnBox a{ display: inline-flex; justify-content: center; align-items: center; border-radius: 0; border: 1px solid #cbcbcb; width: 80px; height: 40px; line-height: 1; padding: 0; text-align: center; box-sizing: border-box; background-color: transparent; color: #cbcbcb !important; font-size: 12px; margin: 0; vertical-align: middle;}

/* Chrome, Safari용 스크롤 바 */
#episodes #list_skin .rightBox::-webkit-scrollbar {width: 6px; height: 6px; border: 2px solid #fff; }
#episodes #list_skin .rightBox::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {display: block; height: 10px; background:#efefef}
#episodes #list_skin .rightBox::-webkit-scrollbar-track {background: #efefef; -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.15)}
#episodes #list_skin .rightBox::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(0,0,0,.15); -webkit-border-radius: 4px; border-radius: 6px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.05)}

#episodes_view_popup{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; z-index: 100;}
#episodes_view_popup .xBtn{ position:fixed; top:30px; right: 50px; z-index: 10}
#episodes_view_popup .xBtn img{ display: block; width: 30px;}
#episodes_view_popup .swiperBox{ position: relative;}
#episodes_view_popup .swiperBox .swiper-container{ overflow: hidden;}
#episodes_view_popup .swiperBox .swiper-slide{ text-align: center;}
#episodes_view_popup .swiperBox .swiper-slide img{ width: 100%}
#episodes_view_popup .swiperBox .button{ position:absolute; top:50%; transform:translateY(-50%); width:24px; height:44px; background-position:center; background-repeat:no-repeat; background-size:contain; margin-top:0;}
#episodes_view_popup .swiperBox .button:after{ display:none !important}
#episodes_view_popup .swiperBox .swiper-button-prev{ left:50px; background-image:url(/img/new/prevBtn.png); }
#episodes_view_popup .swiperBox .swiper-button-next{ right:50px; background-image:url(/img/new/nextBtn.png);}
#episodes_view_popup .swiperBox .swiper-pagination{ position: absolute; bottom: auto; width: auto; top: 30px; left: 50px; font-size: 20px; color: #777; z-index: 10}
#episodes_view_popup .btnBox{ position: absolute; right: 120px; top: 25px; z-index: 10;}
#episodes_view_popup .btnBox a{ display: inline-flex; justify-content: center; align-items: center; border-radius: 0; width: 80px; height: 40px; line-height: 1; padding: 0; text-align: center; box-sizing: border-box; background-color: transparent; color: #fff !important; font-size: 12px; margin: 0; vertical-align: middle; background-color: #777}


@keyframes fadeInOut {
	0% {opacity:0;}
	50% {opacity:1;}
	100% {opacity:0;}
}


@media (max-width:1920px){
    nav .menu{ margin-top: 6.5vw;}
    nav .menu li a{ font-size: 4.5vw;}
    nav .menu li a span{ padding: 0 15px; font-size: 1.3vw;}
	nav .menuBox ul li a span{ left: -18px; padding: 0 10px 2px;}
    nav .sns{ margin-top: 5vw; padding-top: 3.5vw;}
	nav .sns li a img{ width: 24px}
	footer .logo img{ width: 180px;}
	footer .rightBox .infoBox ul li:first-of-type{ font-size:18px;}
	footer .rightBox .infoBox ul li a{ font-size:30px;}
	footer .rightBox .infoBox ul li a img{ width:18px;}
	footer .rightBox .infoBox ul li span{ font-size:30px;}
	footer .agreeBtn{ margin-top: 80px;}
	footer .bt_info{ letter-spacing: 0;}
	
	.popup_full .contents .slideBox .swiper-slide .text01{ left: 70px; bottom: 80px; font-size: 45px; }
	.popup_full .contents .slideBox .swiper-slide .text02{ right: 70px; bottom: 85px; font-size: 20px; }
	.popup_full .contents .formBox{ padding:70px;}
	.popup_full .contents .formBox .title{ font-size:28px; margin-bottom: 40px;}
	.popup_full .contents .formBox .form_list ul{ margin-bottom: 30px}
	.popup_full .contents .formBox .form_list ul li .form_title{ width:60px; font-size: 18px}
	.popup_full .contents .formBox .form_list ul li .form_title span{ width:5px; height: 5px;}
	.popup_full .contents .formBox .form_list ul li .inputBox,
	.popup_full .contents .formBox .form_list ul li .pyBox{ width: calc(100% - 60px); height: 35px;}
	.popup_full .contents .formBox .form_list ul li .inputBox input{ font-size:14px;}
	.popup_full .contents .formBox .form_list ul li.phone .form_title{ width:70px}
	.popup_full .contents .formBox .form_list ul li p{ font-size:16px;}
	.popup_full .contents .formBox .form_list ul li p.dash{ margin:0 10px;}
	.popup_full .contents .formBox .form_list ul li.phone .inputBox{ width: calc(50% - 83px);}
	.popup_full .contents .formBox .form_list ul li .pyBox input[type=radio] + label{ width:65px; line-height: 35px; font-size: 14px;}
	.popup_full .contents .formBox .form_list ul li .rootBox input[type=radio] + label{ line-height: 35px; font-size: 14px;}
	.popup_full .contents .formBox .form_list ul li.budget .form_title{ width:90px;}
	.popup_full .contents .formBox .form_list ul li.budget .inputBox{ width: calc(100% - 127px);}
	.popup_full .contents .formBox .form_list ul li .pyBox .inputBox{ width: calc(100% - 178px);}
	.popup_full .contents .formBox .form_list ul li,
	.popup_full .contents .formBox .form_list .halfBox2 .half2{ width: calc(50% - 20px);}
	.popup_full .contents .formBox .form_list .halfBox2{ margin-bottom:40px}
	.popup_full .contents .formBox .form_list ul li:first-child,
	.popup_full .contents .formBox .form_list .halfBox2 .half2:first-child{ margin-right: 40px;}
	.popup_full .contents .formBox .form_list .halfBox2 .half2 .form_title{ margin-bottom:10px;}
	.popup_full .contents .formBox .form_list ul li .textArea{ height:192px;}
	.popup_full .contents .formBox .form_list ul li .textArea textarea{ font-size:14px;}
	.popup_full .contents .formBox .form_list ul li .uploadBox label{ width:100px; height:100px;}
	.popup_full .contents .formBox .form_list ul li .uploadBox label i{ font-size:26px}
	.popup_full .contents .formBox .form_list ul li .uploadBox label p{ font-size:14px;}
	.popup_full .contents .formBox .form_list ul li .notice{ font-size:14px}
	.popup_full .contents .formBox .agreeBox img{ font-size:20px;}
	.popup_full .contents .formBox .agreeBox .agreeBtn{ font-size:20px;}
	.popup_full .contents .formBox .agreeBox span{ font-size:20px;}
	.popup_full .contents .formBox .requestBtn{ bottom: 70px; right: 70px; width: 240px; height: 55px; font-size: 20px;}
	
	main section h3{ font-size: 18px;}
	main section h4{ font-size: 18px}
	#service section.sec01 .textBox .visual_text{ font-size: 18px;}
	main section .triple li .moreBtn span{ font-size: 20px;}
	main section.secBt .halfBox .half .textBox a{ font-size: 18px}
	#main section .visualSwiper .explore{ bottom: 80px;}
	#main section .visualSwiper .explore .circle{ width: 180px; margin-left: -90px; top: -80px;}
	#main section .visualSwiper .explore p{ font-size: 18px;}
	#main section .visualSwiper .explore .arrow_down{ height: 26px; margin-top: 10px}
	#main section .visualSwiper .swiper-slide p{ font-size: 20px;}
	#main section .visual_video .explore{ bottom: 80px;}
	#main section .visual_video .explore .circle{ width: 180px; margin-left: -90px; top: -80px;}
	#main section .visual_video .explore p{ font-size: 18px;}
	#main section .visual_video .explore .arrow_down{ height: 26px; margin-top: 10px}
	#main section .midSwiper .textBox .moreBtn span,
	#main section.sec04 .moreBtn span,
	#main section.sec05 .textBox .moreBtn span{ font-size: 20px;}
	#about section.sec04{ padding: 100px 60px;}
	#about section.sec04-1{ padding-bottom: 150px;}
	#about section .halfBox .half .essentials li .text01,
	#about section.sec04 .organizations li .text01,
	#about section .halfBox .half .circle_title{ font-size: 50px}
	#about section.sec04 .organizations:before{ top: 28px; height: 438px;}
	#about section.sec04 figure{ margin-top: 100px;}
	#about section.sec04 figure.pc_only img{ display: inline-block; }
	#about section.sec04-1 figure.pc_only img{ max-width: 100%;}
	#service section{ padding: 100px 60px;}
	#service section.sec02 figure{ max-width: 1400px;}
	#service section.sec04 .swiper-container{}
	#service section.sec04 .swiper-slide img:first-child{ margin-right: 200px}
	#service section.sec05-1 .slideBox .phone_mocup img,
	#service section.sec05-1 .slideBox .swiper-slide img{ width:290px}
	#service section.sec05-1 .slide_text{ padding-left: 0}
	#service section.sec05-1 .slide_text li{ margin-bottom: 75px;}
	#service section.sec05-1 .slide_text h3{ margin-top: 20px;}
	#service section.sec05-1 .halfBox{ margin-top: 80px}
	#episodes #list_skin .circleBox figure{ max-width: 400px}
	#episodes #list_skin .circleBox .text{ font-size: 20px;}
	#episodes #list_skin .episodes_list li .subject{ font-size: 25px;}
	
}

@media (max-width:1600px){	
	footer{ padding:70px 0;}
	footer .logo img{ width: 160px;}
	footer .rightBox{ width:78%;}
	footer .rightBox .infoBox ul li:first-of-type{ font-size:16px;}
	footer .rightBox .infoBox ul li a{ font-size:25px;}
	footer .rightBox .infoBox ul li a img{ width:15px;}
	footer .rightBox .infoBox ul li a:hover img{ top: -3px}
	footer .rightBox .infoBox ul li span{ font-size:25px;}
	footer .agreeBtn{ margin-top: 70px;}
	footer .agreeBtn a{ font-size: 14px;}
	footer .bt_info,
	footer .copyright{ font-size: 12px;}
	
	main section.secBt .halfBox .half .textBox a{ font-size: 16px}
	#about section .visualSwiper{ height: 52vw}
	#about section .halfBox .half .essentials li{ margin-top: 60px;}
	#about section .halfBox .half .essentials li .text01,
	#about section.sec04 .organizations li .text01,
	#about section .halfBox .half .circle_title{ font-size: 40px}
	#about section.sec04 .organizations:before{ top: 24px; height: 396px;}
	#main section .visualSwiper{ height: 50vw}
	#main section .midSwiper{ height: 50vw}
}

@media (max-width:1400px){	
	#quickBtn{ right:40px; bottom: 40px;}
	.center{ padding: 0 40px;}
	header .logo{ left: 40px;}
	header .logo img{ width: 160px;}
	header .right a.btn_request{ font-size: 14px; line-height: 30px; padding: 0 15px; margin-right: 30px;}
	header .right a.btn_menu img{ width:30px;}
	
	.popup_full{ padding: 0 40px;}
	.popup_full .topBox{ padding: 32px 40px}
	.popup_full .topBox .logo img{ width: 160px;}
	.popup_full .topBox .xBtn{ right: 40px;}
	.popup_full .topBox .xBtn img{ width: 30px;}
	.popup_full .contents .slideBox .swiper-slide .text01{ left: 40px; bottom: 60px; font-size: 34px; }
	.popup_full .contents .slideBox .swiper-slide .text02{ right: 40px; bottom: 65px; font-size: 18px; }
	.popup_full .contents .formBox{ padding:50px; height: 100vh; box-sizing: border-box; overflow: auto;}
	.popup_full .contents .formBox .title{ font-size:24px; margin-bottom: 40px;}
	.popup_full .contents .formBox .form_list ul{ margin-bottom: 30px}
	.popup_full .contents .formBox .form_list ul li .form_title{ width:50px; font-size: 16px}
	.popup_full .contents .formBox .form_list ul li .form_title span{ width:4px; height: 4px;}
	.popup_full .contents .formBox .form_list ul li .inputBox,
	.popup_full .contents .formBox .form_list ul li .pyBox{ width: calc(100% - 50px); height: 30px;}
	.popup_full .contents .formBox .form_list ul li .inputBox input{ font-size:12px;}
	.popup_full .contents .formBox .form_list ul li.phone .form_title{ width:60px}
	.popup_full .contents .formBox .form_list ul li p{ font-size:14px;}
	.popup_full .contents .formBox .form_list ul li.phone .inputBox{ width: calc(50% - 67px);}
	.popup_full .contents .formBox .form_list ul li.phone .borderN{ width:22px !important}
	.popup_full .contents .formBox .form_list ul li .pyBox input[type=radio] + label{ width:40px; line-height: 30px; font-size: 12px; margin-right: 5px}
	.popup_full .contents .formBox .form_list ul li .rootBox input[type=radio] + label{ line-height: 30px; font-size: 12px; width:calc(33.33% - 6px); margin-right: 5px; margin-bottom: 5px;}
	.popup_full .contents .formBox .form_list ul li.budget .form_title{ width:80px;}
	.popup_full .contents .formBox .form_list ul li.budget .inputBox{ width: calc(100% - 114px);}
	.popup_full .contents .formBox .form_list ul li .pyBox .inputBox{ width: calc(100% - 117px);}
	.popup_full .contents .formBox .form_list ul li,
	.popup_full .contents .formBox .form_list .halfBox2 .half2{ width: calc(50% - 15px);}
	.popup_full .contents .formBox .form_list .halfBox2{ margin-bottom:40px}
	.popup_full .contents .formBox .form_list ul li:first-child,
	.popup_full .contents .formBox .form_list .halfBox2 .half2:first-child{ margin-right: 30px;}
	.popup_full .contents .formBox .form_list ul li .textArea{ height:162px;}
	.popup_full .contents .formBox .form_list ul li .textArea textarea{ font-size:12px;}
	.popup_full .contents .formBox .form_list ul li .uploadBox label{ width:80px; height:80px; padding:20px 0}
	.popup_full .contents .formBox .form_list ul li .uploadBox label i{ font-size:22px}
	.popup_full .contents .formBox .form_list ul li .uploadBox label p{ font-size:12px;}
	.popup_full .contents .formBox .form_list ul li .notice{ font-size:12px; line-height: 1.4;}
	.popup_full .contents .formBox .form_list ul li .img_list .imgBox{ width:80px; height:80px; margin-bottom: 5px; margin-right: 5px;}
	.popup_full .contents .formBox .agreeBox img{ font-size:18px;}
	.popup_full .contents .formBox .agreeBox .agreeBtn{ font-size:18px;}
	.popup_full .contents .formBox .agreeBox span{ font-size:18px;}
	.popup_full .contents .formBox .requestBtn{ position: static; float: right; margin-top: -45px; width: 200px; height: 45px; font-size: 16px;}
	
	nav .menu{ margin-top: 6.5vw;}
    nav .menu li a{ font-size: 4.5vw;}
    nav .menu li a span{ padding: 0 15px; font-size: 1.3vw;}
	nav .menuBox ul li a span{ left: -15px; top: -6px; padding: 1px 7px;}
    nav .sns{ margin-top: 5vw; padding-top: 3.5vw;}
	nav .sns li a img{ width: 20px}
	
	footer{ padding:60px 0;}
	footer .logo img{ width: 140px;}
	footer .rightBox{ width:78%;}
	footer .rightBox .infoBox ul li:first-of-type{ font-size:14px;}
	footer .rightBox .infoBox ul li a{ font-size:22px;}
	footer .rightBox .infoBox ul li a img{ width:14px;}
	footer .rightBox .infoBox ul li a:hover img{ top: -2px}
	footer .rightBox .infoBox ul li span{ font-size:22px;}
	footer .agreeBtn{ margin-top: 60px;}
	footer .agreeBtn a{ font-size: 12px;}
	footer .bt_info,
	footer .copyright{ font-size: 11px;}
	
	main section h2{ font-size: 30px;}
	main section h3{ font-size: 20px;}
	main section h4{ font-size: 16px;}	
	main section .triple{ padding: 50px 20px;}
	main section .triple li{ padding: 0 20px;}
	main section .triple li:last-child{ margin-top: 3vw}
	main section .triple li .moreBtn{margin-top: 40px;}
	main section .triple li .moreBtn span{ font-size: 18px; }
	main section.secBt .halfBox .half .textBox a{ font-size: 14px}
	#about section.sec03{ padding: 0 40px }
	#about section.sec03 .halfBox .half:last-child{ padding-right: 100px;}
	#about section .halfBox .half .essentials li{ margin-top: 50px;}
	#about section .halfBox .half .essentials li .text01,
	#about section.sec04 .organizations li .text01,
	#about section .halfBox .half .circle_title{ font-size: 35px}
	#about section.sec04 .organizations:before{ top: 20px; height: 350px;}
	#about section.sec04{ padding: 80px 40px;}
	#about section.sec04 .organizations li{ margin-bottom: 50px;}
	#service section{ padding: 5vw 40px;}
	#service section.sec05 .section_subTitle,
	#service section.sec05 .section_title{ left: 40px}
	#main section .visualSwiper .explore{ bottom: 60px;}
	#main section .visualSwiper .explore .circle{ width: 140px; margin-left: -70px; top: -60px;}
	#main section .visualSwiper .explore p{ font-size: 16px;}
	#main section .visualSwiper .explore .arrow_down{ height: 22px; }
	#main section .visual_video .explore{ bottom: 60px;}
	#main section .visual_video .explore .circle{ width: 140px; margin-left: -70px; top: -60px;}
	#main section .visual_video .explore p{ font-size: 16px;}
	#main section .visual_video .explore .arrow_down{ height: 22px; }
	#main section .visual_video .swiper-slide p{ left: 40px; bottom: 40px; font-size: 18px;}
	#main section.sec02{ padding: 80px 0 40px;}
	#main section.sec02 h1{ padding: 0 40px;}
	#main section .midSwiper .textBox .moreBtn,
	#main section.sec04 .moreBtn,
	#main section.sec05 .textBox .moreBtn{ margin-top: 30px;}
	#main section .midSwiper .textBox .moreBtn span,
	#main section.sec04 .moreBtn span,
	#main section.sec05 .textBox .moreBtn span{ font-size: 18px;}
	#main section .midSwiper .textBox,
	#main section.sec05 .textBox{ padding: 0 40px;}
	#main section.sec04{ padding: 80px 40px}
	#main section.sec04 .section_text{ margin-top: 40px}
	main section.sec06{ padding: 80px 40px 130px}
	main section.sec06 .tabBox{ margin-top: 30px;}
	main section.sec06 .tabBox a.on:before{ height: 8px; bottom: -16px;}
	main section.sec06 .moreBtn{ right: 40px; bottom: 80px;}
	main section.sec06 .moreBtn img{ margin-left: 10px}
	#service section h1{ font-size: 60px; margin-bottom: 40px;}
	#service section h4{ margin-top: 20px;}
	#service section .subTitle{ font-size: 35px;}
	#service section.sec01 .textBox{ left:40px;}
	#service section.sec02 figure{ padding-right: 0}
	#service section.sec03 .swiper-container{ padding-right: 0; margin-top: 0}
	#service section.sec05 .titleBox{ top: 80px; left: 40px;}
	#service section.sec05-1 .slideBox .phone_mocup img, 
	#service section.sec05-1 .slideBox .swiper-slide img{ width: 200px;}
	#service section.sec05-1 .slide_text li{ margin-bottom: 70px;}
	#service section.sec05-1 .slide_text li h2{ font-size: 30px;}
	#service section.sec05-1 .slide_text h3{ font-size: 18px;}
	#service section.sec05-1 .slide_text h3 br{ display: none}
	#service section.sec06{ padding: 80px 40px 130px}
	#service section.sec04-1 .titleBox{ width:45%}
	#service section.sec04-1 .videoBox iframe{ width:100%; height: 105%;}
	#service section.section_styling{ padding-right:40px}
	#service section.section_styling .styling_slide{ column-gap: 80px}
	
	#episodes #list_skin .circleBox figure{ max-width: 300px}
	#episodes #list_skin .circleBox .text{ font-size: 16px;}
	#episodes #list_skin .episodes_list li .subject{ font-size: 20px;}
	#portfolio .center{ padding:0 40px !important;}
}

@media (max-width:1240px){
	.t_only{ display: block !important}
	header{ padding: 20px 0;}
	.popup_full .topBox{ padding: 22px 40px}
	.popup_full .topBox .xBtn{ top: 20px;}
	nav .sns li a img{ width: 20px}
	footer .rightBox{ width:75%;}
	footer .bt_info{ line-height: 1.8;}
	
	main section h2{ font-size: 26px;}
	main section h3{ font-size: 18px;}
	main section.secBt .halfBox .half .textBox a{ font-size: 14px}
	#about section .halfBox .half .essentials li{ margin-top: 40px;}
	#about section .halfBox .half .essentials li .text01,
	#about section.sec04 .organizations li .text01,
	#about section .halfBox .half .circle_title{ font-size: 30px}
	#about section.sec04 .organizations:before{ top: 18px; height: 332px;}
}

@media (max-width:1024px){
	#quickBtn { right:20px; bottom: 20px}
	.center,
	header .center{ padding: 0 20px; }
	header .logo{ left: 20px;}
	header .logo img{ width: 120px;}
	header .right a.btn_request{ font-size: 13px; line-height: 28px; padding: 0 15px; margin-right: 20px;}
	header .right a.btn_menu img{ width:28px;}
	.popup_full{ padding: 0 20px; overflow: auto;}
	.popup_full .topBox{ padding: 24px 20px}
	.popup_full .topBox .logo img{ width: 120px;}
	.popup_full .topBox .xBtn{ right: 20px;}
	.popup_full .topBox .xBtn img{ width: 28px;}
	.popup_full .contents{ height:100vh; overflow: auto;}
	.popup_full .contents:before{ display:none;}
	.popup_full .contents .halfBox .half{ display:block; width:100%;}
	.popup_full .contents .formBox{ overflow: visible; padding: 50px 20px; height: auto;}
	
	nav .menuBox ul li a span{ left: -11px; top: -4px; padding: 1px 5px;}
	nav .sns li a img{ width: 16px}
	footer{ padding:50px 0;}
	footer .logo img{ width: 120px;}
	footer .rightBox{ width:78%;}
	footer .rightBox .infoBox ul li:first-of-type{ font-size:13px;}
	footer .rightBox .infoBox ul li a{ font-size:20px;}
	footer .rightBox .infoBox ul li a img{ width:13px;}
	footer .rightBox .infoBox ul li span{ font-size:20px;}
	footer .agreeBtn{ margin-top: 50px;}
	footer .bt_info{ margin: 10px 0}
	
	main section h2{ font-size: 24px; font-weight: 500;}
	main section h3{ font-size: 14px;}
	main section h4{ font-size: 14px;}	
	main section .triple{ padding: 50px 10px;}
	main section .triple li{ padding: 0 10px;}
	main section .triple li .moreBtn{ margin-top: 20px}
	main section .triple li .moreBtn span{ font-size: 14px;}
	main section.secBt .halfBox .half .textBox a{ font-size: 14px}
	main section.secBt .halfBox .half .textBox a{ margin-top: 20px}
	#main section .visualSwiper .explore{ bottom: 40px;}
	#main section .visualSwiper .explore .circle{ width: 110px; margin-left: -55px; top: -48px;}
	#main section .visualSwiper .explore p{ font-size: 13px;}
	#main section .visualSwiper .explore .arrow_down{ height: 18px; margin-top: 5px;}
	#main section .visualSwiper .swiper-slide p{ left: 20px; bottom: 20px; font-size: 16px;}
	#main section .visual_video .explore{ bottom: 40px;}
	#main section .visual_video .explore .circle{ width: 110px; margin-left: -55px; top: -48px;}
	#main section .visual_video .explore p{ font-size: 13px;}
	#main section .visual_video .explore .arrow_down{ height: 18px; margin-top: 5px;}
	#main section.sec02{ padding: 60px 0 20px;}
	#main section.sec02 h1{ padding: 0 20px;}
	#main section .midSwiper .textBox .moreBtn,
	#main section.sec04 .moreBtn,
	#main section.sec05 .textBox .moreBtn{ margin-top: 20px;}
	#main section .midSwiper .textBox .moreBtn span,
	#main section.sec04 .moreBtn span,
	#main section.sec05 .textBox .moreBtn span{ font-size: 14px;}
	#main section .midSwiper .textBox,
	#main section.sec05 .textBox{ padding: 0 20px;}
	#main section.sec04{ padding: 60px 20px}
	#main section.sec04 .section_text{ margin-top: 30px}
	main section.sec06{ padding: 60px 20px 100px}
	main section.sec06 .tabBox{ margin-top: 20px;}
	main section.sec06 .tabBox a.on:before{ height: 6px; bottom: -12px;}
	main section.sec06 .projects_list{ margin-top: 60px}
	main section.sec06 .projects_list li .textBox{ margin-top: 20px;}
	main section.sec06 .moreBtn{ right: 20px; bottom: 60px;}
	#about section .halfBox .half .essentials li .text01,
	#about section.sec04 .organizations li .text01,
	#about section .halfBox .half .circle_title{ font-size: 26px}
	#about section.sec04 .organizations:before{ top: 18px; height: 332px;}
	#about section.sec03{ padding: 0 20px;}
	#about section.sec04{ padding: 60px 20px;}
	#about section.sec04 .organizations{ margin-left: 30px; margin-top: 50px;}
	#about section.sec04 .organizations:before{ top: 16px; left: -30px; height: 311px;}
	#about section.sec04 .organizations li .text01:before{ width: 20px; left: -30px;}
	#service section{ padding: 60px 20px;}
	#service section h1{ font-size: 4vw;}
	#service section .subTitle{ font-size: 28px}
	#service section.sec01{ height: 52vw}
	#service section.sec01 .textBox{ left: 20px}
	#service section.sec01 .textBox .visual_text{ font-size:14px; line-height: 1.4;}
	#service section.sec05 .titleBox{ left: 20px; top: 60px; box-sizing: border-box}
	#service section.sec05-1 h1{ margin-bottom: 0}
	#service section.sec05-1 .halfBox{ margin-top: 60px;}
	#service section.sec05-1 .halfBox .half{ display: block; width: 100%;}
	#service section.sec05-1 .halfBox .half:last-child{ display: none}
	#service section.sec05-1 .slideBox{ max-width: 400px; margin: 0 auto; padding: 0;}
	#service section.sec05-1 .slideBox .swiper{ padding-bottom: 30px;}
	#service section.sec05-1 .slideBox .swiper-slide .text01{ display: block; font-size: 26px; font-weight: bold; color: #1f1f1f; margin-top: 40px; text-align: center;}
	#service section.sec05-1 .slideBox .swiper-slide .text02{ display: block; font-size: 16px; color: #1f1f1f; margin-top: 20px; line-height: 1.8; text-align: center;}
	#service section.sec05-1 .slideBox .swiper-pagination{ display: block; bottom: 0; left: 0; width: 100%;}
	#service section.sec05-1 .slideBox .swiper-pagination span{ width: 8px; height: 8px; opacity: 1; background-color: #cbcbcb;}
	#service section.sec05-1 .slideBox .swiper-pagination .swiper-pagination-bullet-active{ width: 20px; border-radius: 5px; background-color: #ef4e1b;}
	#service section.sec06{ padding: 60px 20px 100px}
	#service section.sec04-1 .videoBox iframe{ height: 113%;}
	#service section.section_styling{ padding-right:20px}
	#service section.section_styling .styling_slide{ column-gap: 50px}
	#episodes #list_skin{ padding-left: 0}
	#episodes #list_skin .leftBox{ position: static; transform: none; width: 100%; padding: 50px 0 100px;}
	#episodes #list_skin .circleBox .fixed{ position:fixed; top: -60px; left: -4px; width: 170px; z-index: 12; transition: 0.3s;}
	#episodes .circle_head{ display: block; position: fixed; top: -60px; left: -4px; width: 170px; z-index: 12; opacity: 0;}
	#episodes .btnBox{ display: none}
	#episodes_view_popup{ overflow: auto}
	#episodes_view_popup .btnBox{ display: none}
	#episodes_view_popup .xBtn{ top:20px; right: 20px;}
	#episodes_view_popup .xBtn img{ width: 20px;}
	#episodes_view_popup .swiperBox .button,
	#episodes_view_popup .swiperBox .swiper-pagination{ display: none;}
	#episodes_view_popup .swiperBox .swiper-wrapper{ display: block; transform:none !important}
	#portfolio .center{ padding:0 20px !important;}
	#portfolio #bo_gall{ width:100% !important;}
}

@media (max-width:768px){
	#quickBtn .requestBtn{ display: block; margin-bottom: 10px;}
	#quickBtn .requestBtn img{ width: 50px;}
	.pc_only{ display: none !important;}
	.m_only{ display: block !important;}
	header .logo{ top: 2px; transform: none}
	header .right a.btn_request{ display: none}
	header .right a.btn_menu img{ width: 20px;}
	.popup_full .topBox{ padding: 22px 20px}
	.popup_full .topBox .xBtn{ top: 22px;}
	.popup_full .topBox .xBtn img{ width: 20px;}
	.popup_full .contents .slideBox .swiper-slide{ height: auto; background:none;}
	.popup_full .contents .slideBox .swiper-slide img{ display:block; width: 100%;}
	.popup_full .contents .slideBox .swiper-slide .text01{ left: 20px; top: 100px; bottom: auto; font-size: 26px; line-height: 1.4;}
	.popup_full .contents .slideBox .swiper-slide .text02{ right: 20px; bottom: 30px; font-size: 16px; }
	.popup_full .contents .formBox{ padding:40px 20px 60px;}
	.popup_full .contents .formBox .form_list ul:after{ content:""; display: block; clear: both}
	.popup_full .contents .formBox .form_list ul li,
	.popup_full .contents .formBox .form_list .halfBox2 .half2{ display:block !important; width:100% !important; margin-right: 0 !important; margin-bottom: 30px;}
	.popup_full .contents .formBox .form_list ul li.address:first-child{ margin-bottom: 10px;}
	.popup_full .contents .formBox .form_list ul li.address:last-child{ float: right; width: calc(100% - 50px) !important; margin-bottom: 10px}
	.popup_full .contents .formBox .form_list ul li .pyBox input[type=radio] + label{ width: 60px;}
	.popup_full .contents .formBox .form_list ul li .pyBox .inputBox{ width: calc(100% - 157px);}
	.popup_full .contents .formBox .agreeBox img{ font-size:16px;}
	.popup_full .contents .formBox .agreeBox .agreeBtn{ font-size:16px;}
	.popup_full .contents .formBox .agreeBox span{ font-size:16px;}
	.popup_full .contents .formBox .requestBtn{ float:none; margin-top: 40px; width:100%; height:50px;}
	
	nav .menu{ margin-top: 90px;}
	nav .menu li{ display: block; width: 100%; padding: 14px 0;}
	nav .menu li a{ font-size: 40px;}
	nav .menu li a span{ left: -13px; top: -8px; padding: 2px 10px; font-size: 13px; line-height: 1.4;}
	nav .menuBox{ margin-top: 90px;}
	nav .menuBox ul{ display: block; width: 100%;}
	nav .menuBox ul li a{ font-size: 25px}
	nav .menuBox ul li a span{ left: -10px; top: -5px; padding: 2px 5px; font-size: 12px; line-height: 1.4;}
	nav .menuBox .menu1 li{ padding: 5px 0;}
	nav .menuBox .menu1 li a{ font-size: 40px}
	nav .menuBox .menu2{ margin-top: 20px;}
	nav .menuBox .menu2 li{ padding: 10px 0; margin: 0;}
	nav .menuBox .menu2 .half{ display: block; width: 100%;}
	nav .sns{ margin-top: 40px; padding-top: 30px;}
	nav .sns li{ margin-bottom: 20px;}
	nav .sns li a img{ width: 13px}
	nav .sns li a span{ font-size: 18px;}
	footer{ padding:60px 0 60px;}
	footer .rightBox{ display: block; width: 100%; float: none;}
	footer .logo{ display: block; width: 100%; float: none; margin-top: 20px;}
	footer .rightBox .infoBox ul{ display: inline-block; width: 50%;}
	footer .rightBox .infoBox ul:nth-of-type(3){ display: block; width: 100%; margin-top: 60px;}
	footer .rightBox .infoBox ul li{ margin-top: 5px;}
	footer .rightBox .infoBox ul li a{ font-size: 18px;}
	footer .rightBox .infoBox ul li:first-of-type{ font-size: 12px;}
	footer .rightBox .infoBox ul li span{ font-size: 18px; line-height: 1.8}
	footer .rightBox .logo_m{ margin-top: 20px; margin-bottom: 20px}
	footer .rightBox .logo_m img{ display: block; width: 100px;}	
	
	main section h1{ font-size: 38px;}
	main section .triple{ display: block; box-sizing: border-box; padding: 40px 20px;}
	main section .triple li{ display: block; width: 100%; padding: 0; margin-top: 40px;}
	main section .triple li:first-of-type{ margin-top: 0}
	main section .triple li .text br:last-of-type{ display: none}
	main section .triple li:nth-of-type(2) .swiper-container{ margin-left: -20px;}
	main section .triple li:nth-of-type(3){ display: flex; flex-direction: column-reverse;}
	main section .triple li:nth-of-type(3) .swiper-container{ margin-right: -20px;}
	main section .triple li:last-child{ margin-top: 40px;}
	main section .triple li h3{ margin-top: 10px;}
	main section.secBt .halfBox .half{ display: block; width: 100%;}
	main section.secBt .halfBox .half .textBox a{ font-size: 14px;}
	main section.secBt .halfBox .half .textBox a:before{ height: 1px;}
	main section.secBt .halfBox .half .textBox div{ font-size: 28px;}
	#main section .visual_title{ font-size: 30px; letter-spacing: 0.1em;}
	#main section .visualSwiper{ height: 100vh;}
	#main section .visualSwiper .swiper-slide p{ left: 0; bottom: 20px; width: 100%; font-size: 12px; font-weight: 400; text-align: center;}
	#main section .visualSwiper .swiper-slide .slide01{ background-image:url(/img/home/main_visual_01_m.jpg?3);}
	#main section .visualSwiper .swiper-slide .slide02{ background-image:url(/img/home/main_visual_02_m.jpg?3);}
	#main section .visualSwiper .swiper-slide .slide03{ background-image:url(/img/home/main_visual_03_m.jpg?3);}
	#main section .visualSwiper .explore{ bottom: 90px;}
	#main section .visualSwiper .explore .circle{ width: 140px; margin-left: -70px; top: -60px}
	#main section .visualSwiper .explore p{ font-size:14px; font-weight: 500; }
	#main section .visualSwiper .explore .arrow_down{ height: 16px;}
	#main section .visualSwiper .swiper-pagination span{ height: 3px; }
	#main section .visualSwiper .swiper-slide .slide02{ transform: scale(1.15);}
	#main section .visualSwiper .swiper-slide-active .slide01{ transform: scale(1.15);}
	#main section .visualSwiper .swiper-slide-active .slide02{ transform: scale(1);}
	#main section .visualSwiper .swiper-slide-active .slide03{ transform: scale(1.15);}
	#main section .visual_video{ height:auto;}
	#main section .visual_video .main_visual_video{	width: 100%; height: auto; aspect-ratio: 9 / 16;}
	#main section .visual_video .main_visual_video .main_visual_iframe,
	#main section .visual_video .main_visual_video .main_visual_poster{ top:0;	left:0;	width:100%;	height:100%; min-width:0; min-height:0;	transform:none;	}
	#main section .visual_video .main_visual_video .pc_main_iframe, 
	#main section .visual_video .main_visual_video .pc_main_poster{ display:none;	}
	#main section .visual_video .main_visual_video .mobile_main_iframe, 
	#main section .visual_video .main_visual_video .mobile_main_poster{ display:block; }
	#main section .visual_video .explore{ bottom: 90px;}
	#main section .visual_video .explore .circle{ width: 140px; margin-left: -70px; top: -60px}
	#main section .visual_video .explore p{ font-size:14px; font-weight: 500; }
	#main section .visual_video .explore .arrow_down{ height: 16px;}
	#main section.sec02{ padding: 50px 0 20px;}
	#main section.sec02 h1{ letter-spacing: 0}
	#main section .midSwiper{ height: 100vh;}
	#main section .midSwiper .slide01{ background-image:url(/img/home/main_middle_slide_01_m.jpg);}
	#main section .midSwiper .slide02{ background-image:url(/img/home/main_middle_slide_02_m.jpg);}
	#main section .midSwiper .slide03{ background-image:url(/img/home/main_middle_slide_03_m.jpg);}
	#main section .midSwiper .textBox{ bottom: auto; top: 50%; transform: translateY(-50%);}
	#main section .midSwiper .textBox .subject{ font-size: 24px; margin-top: 15px;}
	#main section .midSwiper .textBox .text{}
	#main section .midSwiper .swiper-pagination span{ height: 3px;}
	#main section.sec04 .makeSenseSwiper{ margin-top: 40px;}
	#main section.sec04 .makeSenseSwiper .swiper-slide{ padding: 0}
	#main section.sec05{ padding-bottom: 177.86666666666667%}
	#main section.sec05 .textBox{ left: 0; top: auto; transform: none; bottom: 50px;}
	#main section.sec05 .textBox .subject{ font-size: 24px; margin-top: 15px;}
	main section.sec06{ padding: 50px 20px;}
	main section.sec06 .moreBtn{ position: static;}
	main section.sec06 .moreBtn span{ font-size: 24px; }
	main section.sec06 .moreBtn img{ width: 20px;}
	main section.sec06 .listBox{ text-align: right}
	main section.sec06 .listBox:nth-child(1){ padding-bottom: 50px;}
	main section.sec06 .listBox:nth-child(2){ width: calc(100% + 40px); margin-left: -20px; padding: 50px 20px; background-color: #fff; margin-bottom: 50px;}
	main section.sec06 .listBox:nth-child(2) .moreBtn span{ color: #cbcbcb}
	main section.sec06 .projects{ font-size: 24px; text-align: left;}
	main section.sec06 .list_title{ font-size: 38px; font-weight: 600; color: #1f1f1f; text-align: left; font-family:'neue-haas-unica', sans-serif !important;}
	main section.sec06 .projects_list{ margin-top: 30px; margin-bottom: 20px;}
	main section.sec06 .projects_list li{ display: block; width: 100%; margin-right: 0; margin-bottom: 50px;}
	main section.sec06 .projects_list li:last-child{ margin-bottom: 0}
	main section.sec06 .projects_list li .textBox{ text-align: left; margin-top: 10px;}
	main section.sec06 .projects_list li .textBox .subject{ font-size: 24px; font-weight: 500; margin-top: 0}
	#about section .visual_title{ top: 120px; transform: none; text-align: left; font-size: 38px; padding: 0 20px; box-sizing: border-box; line-height: 1.5; letter-spacing: 0.08em;}
	#about section .visualSwiper{ height: 100vh;}
	#about section .visualSwiper .swiper-slide.slide01{ background-image:url(/img/home/about_visual_m_01.jpg)}
	#about section .visualSwiper .swiper-slide.slide02{ background-image:url(/img/home/about_visual_m_02.jpg)}
	#about section .triple{ padding-top: 50px; padding-bottom: 50px;}
	#about section.sec03{ display: block; height: auto; padding: 100px 20px 150px; text-align: center; background-image: url("/img/home/about_essentials_bg_m.jpg?1");}
	#about section.sec03 .halfBox{ margin-top: 100px}
	#about section .halfBox .half{ display: block; width: 100%;}
	#about section.sec03 .halfBox .half:last-child{ padding-right: 0}
	#about section .halfBox .half .essentials li{ margin-top: 50px}
	#about section .halfBox .half .essentials li .text01{ font-size: 24px;}
	#about section .halfBox .half .essentials li .text02{ line-height: 1.8;}
	#about section .halfBox .half .circle_title{ margin-top: 120px; margin-bottom: 40px;}
	#about section .halfBox .half .circleBox .circle{ width: 90%; max-width: 360px;}
	#about section .halfBox .half .circleBox .circle_lil{ width: 38%; max-width: 130px;}
	#about section.sec04{ padding: 80px 20px 40px;}
	#about section.sec04-1{ padding: 40px 20px 120px;}
	#about section.sec04 .section_subTitle{ line-height: 1.8;}
	#about section.sec04 .organizations{ display: block; margin-left: 20px; margin-top: 40px;}
	#about section.sec04 .organizations:before{ top:15px; left: -20px; height: 229px;}
	#about section.sec04 .organizations li{ margin-bottom: 30px;}
	#about section.sec04 .organizations li .text01{ font-size: 24px;}
	#about section.sec04 .organizations li .text01:before{ width: 10px; left: -20px;}
	#about section.sec04 .organizations li .text02{ margin-top: 5px;}
	#about section.sec04 figure{ display: block; width: 100%; padding: 0; margin-top: 40px}
	#about section.sec04 figure img{ width: calc(100% + 26px); max-width: 500px; margin-left: -14px;}
	#service section{ padding: 60px 20px;}
	#service section h1{ font-size: 35px;}
	#service section .subTitle{ font-size: 24px;}
	#service section .swiper-container{ margin-top: 40px;}
	#service section.sec01{ height: 100vh; background-image: url("/img/home/service_visual_m_260204.jpg");}
	#service section.sec01 .textBox{ left: 0; width: 100%; padding: 0 20px; box-sizing: border-box;}
	#service section.sec01 .textBox .visual_title{ font-size: 40px; line-height: 1.3;}
	#service section.sec01 .textBox .visual_text{ line-height: 1.6; margin-top: 50px;}
	#service section.sec02{ padding:80px 20px}
	#service section.sec02 figure{ margin-top: 40px; margin-bottom: 30px;}
	#service section.sec02 .service_process1_m{ display: block; max-width:90%; margin: 40px auto 0;}
	#service section.sec03 .swiper-container{ margin-top: 30px;}
	#service section.sec03 .swiper-slide img{ display: block; max-width: 100%;}
	#service section.sec03 figure{ margin-top: 40px;}
	#service section.sec03 figure img{ display: block; width:100%; margin: 0 auto;}
	#service section.sec04{ padding-bottom:80px;}
	#service section.sec04 .swiper-slide img{ display:block; max-width: 90% !important;}
	#service section.sec05 .section_subTitle{ top: 40px;}
	#service section.sec05 .section_title{ top: 65px;}
	#service section.sec05 .swiper-container{ margin-top: 0;}
	#service section.sec05 figure{}
	#service section.sec05 figure img{ position: relative; display: block; width: 150%; max-width: 150%; animation:moving 20s linear infinite;-webkit-animation:moving 20s linear infinite;-ms-animation:moving 20s linear infinite;}
	#service section.sec05 .titleBox{ left: 0; top: 30px; padding: 0 20px;}
	#service section.sec05 .titleBox h4 span.m_only{ display:inline !important;}
	#service section.sec05-1{}
	#service section.sec05-1 .slideBox .swiper-slide .text02{ font-size: 14px;}
	#service section.sec06{ padding: 50px 20px;}
	#service section.section_styling_view .swiper-container{ margin-top: 0;}
}

@keyframes moving {
	0% { left: 0;}
	50% { left: -50%;}
	100% { left: 0;}
}

.sub_page{ padding:130px 0 200px}

/* 릴스토리 */
#lilstory_m_only{ display:none}
#lilstory section{ padding:100px 0}
#lilstory .visual{ position:relative; height:39vw; text-align:center; background-image:url(/img/lilstory_visual.jpg); background-position:center; background-repeat:no-repeat; background-size:cover;}
#lilstory .visual .titleBox{ position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; z-index:3; text-align:center}
#lilstory .visual .titleBox .title{ font-size:90px; font-weight:bold; color:#fff; letter-spacing:30px; font-family: 'neue-haas-unica', sans-serif !important;}
#lilstory .visual .titleBox .title span{ color:transparent; -webkit-text-fill-color:transparent; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color:#fff;}
#lilstory .visual .titleBox .subTitle{ font-size:28px; color:#fff; line-height:1.6; margin-top:80px;}
#lilstory .slideBox{ position: relative}
#lilstory .slideBox .lilstory_swiper{}
#lilstory .slideBox .lilstory_swiper .swiper-slide{ position:relative; opacity:0.4; transform:scale(0.7); transition:0.3s;}
#lilstory .slideBox .lilstory_swiper .swiper-slide .modBtn{ display:none; position:absolute; top:10px; right:32px; width:40px; line-height:40px; border-radius:50%; font-size:12px; color:#fff; font-weight:bold; text-align:center; background-color:#ef4e1b; z-index:2}
#lilstory .slideBox .lilstory_swiper .swiper-slide .thumbnail{ display:block; width:900px; margin:0 auto; box-shadow:15px 15px 15px 0 rgba(0,0,0,0.15);}
#lilstory .slideBox .lilstory_swiper .swiper-slide .thumbnail img{ display:block; max-width:100%;}
#lilstory .slideBox .lilstory_swiper .swiper-slide .thumbnail:hover + .modBtn,
#lilstory .slideBox .lilstory_swiper .swiper-slide .modBtn:hover{ display:block !important}
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox{ width:900px; margin:40px auto 0;}
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox .text01{ font-size:44px; font-weight:bold; color:#1f1f1f;}
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox .text02{ font-size:17px; color:#777; line-height:1.6; margin-top:20px;}
#lilstory .slideBox .lilstory_swiper .swiper-slide-active{ opacity:1; transform:scale(1);}
#lilstory .slideBox .lilstory_swiper .button{ left:50%; right:auto; top:22vw; margin-top:0; width:24px; height:44px; background-position:center; background-repeat:no-repeat; background-size:contain;}
#lilstory .slideBox .lilstory_swiper .button:after{ display: none}
#lilstory .slideBox .lilstory_swiper .swiper-button-next{ margin-left:505px; background-image:url(/img/new/nextBtn.png)}
#lilstory .slideBox .lilstory_swiper .swiper-button-prev{ margin-left:-530px; background-image:url(/img/new/prevBtn.png)}
#lilstory .slideBox .btnBox{ margin-top:50px; text-align:center;}
#lilstory .slideBox .btnBox a{ display:inline-block; width:100px; line-height:45px; font-size:14px; color:#1f1f1f; text-align:center; border:1px solid #1f1f1f;}
#lilstory .slideBox .btnBox a:hover{ background-color:#1f1f1f; color:#fff;}
#lilstory .formBox{ padding:120px 0;}
#lilstory .formBox .title{ font-size:30px; font-weight:bold; color:#1f1f1f; text-align:center; margin-bottom:40px;}
#lilstory .formBox table{ width:100%; border-collapse:collapse;}
#lilstory .formBox table th{ width:100px; font-size:14px; color:#1f1f1f; text-align:center; background-color:#eee; vertical-align:middle; padding:10px 0; border:1px solid #ddd;}
#lilstory .formBox table td{ font-size:14px; color:#1f1f1f; text-align:left; vertical-align:middle; padding:10px; border:1px solid #ddd;}
#lilstory .formBox table td input[type=text]{ display:block; width:100%; height:30px; font-size:14px; color:#1f1f1f; box-sizing:border-box; border:none; outline:none; background-color:transparent;}
#lilstory .formBox table td input[type=file]{ font-size:14px;}
#lilstory .formBox table td textarea{ display:block; width:100%; height:150px; font-size:14px; color:#1f1f1f; box-sizing:border-box; border:none; background-color:transparent; resize:none; outline:none; line-height:1.4;}
#lilstory .formBox table td figure{ display:block; margin-top:10px; width:150px;}
#lilstory .formBox table td figure img{ display:block; max-width:100%;}
#lilstory .formBox .sound_only,
#lilstory .formBox .cke_sc{ display:none;}
#lilstory .formBox .btnBox{ margin-top:50px; text-align:center;}
#lilstory .formBox .btnBox a{ display:inline-block; width:100px; line-height:45px; font-size:14px; color:#1f1f1f; text-align:center; border:1px solid #1f1f1f; margin:0 5px;}
#lilstory .formBox .btnBox a.save{ background-color:#1f1f1f; color:#fff;}

#lilstory_popup{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:#fff; padding:80px 0; box-sizing:border-box; z-index:100; overflow:auto}
#lilstory_popup .xBtn{ position:absolute; top:30px; right:80px; width:30px; display:block;}
#lilstory_popup .xBtn img{ display:block; max-width:100%;}
#lilstory_popup .center{ width:1320px;}
#lilstory_popup .swiper-slide{ text-align:center;}
#lilstory_popup .swiper-slide img{ max-width:100%; max-height:100%;}
#lilstory_popup .gallery-thumbs-box{ width:100%;}
#lilstory_popup .gallery-thumbs-box .swiper-slide{ width:auto !important; height:95px; box-shadow:5px 5px 5px 0 rgba(0,0,0,0.15);}
#lilstory_popup .gallery_thumbs { display:inline-block; vertical-align:middle; width:100%; box-sizing: border-box; padding:10px 0 10px 1px; }
#lilstory_popup .gallery_thumbs .swiper-slide-thumb-active{ border:1px solid #ef4e1b; box-sizing:border-box}
#lilstory_popup .gallery-view-box{ position:relative; margin-top:40px; padding:0 100px; box-sizing:border-box; }
#lilstory_popup .gallery-view-box .swiper-slide{ position:relative; text-align:center}
#lilstory_popup .button{ position:absolute; top:50%; transform:translateY(-50%); width:24px; height:44px; background-position:center; background-repeat:no-repeat; background-size:contain; margin-top:0;}
#lilstory_popup .button:after{ display: none}
#lilstory_popup .swiper-button-prev{ left:0; background-image:url(/img/new/prevBtn.png); }
#lilstory_popup .swiper-button-next{ right:0; background-image:url(/img/new/nextBtn.png);}

.not_scroll{ position: fixed; overflow: hidden; width: 100%; height: 100%}

@media (min-width:1921px) and (min-height:1250px){
#lilstory_popup{ overflow:hidden}
}
@media (min-width:1921px){
#lilstory_popup{ padding:100px 0;}
#lilstory_popup .gallery-view-box{ margin-top:60px; padding:0;}
#lilstory_popup .gallery-view-box .swiper-slide > img{ width:1320px;}
#lilstory_popup .swiper-button-prev{ left:-60px;}
#lilstory_popup .swiper-button-next{ right:-60px}
#lilstory .visual .titleBox .title{ font-size:120px;}
#lilstory .visual .titleBox .subTitle{ font-size:30px; margin-top:100px}
#lilstory .slideBox .lilstory_swiper .swiper-slide .modBtn{ right:70px;}
#lilstory .slideBox .lilstory_swiper .button{ top:300px;}
}

@media (max-width:1800px){
#lilstory .slideBox .lilstory_swiper .swiper-slide .thumbnail,
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox{ width:auto;}
#lilstory .slideBox .lilstory_swiper .swiper-button-prev{ margin-left:-28.5%}
#lilstory .slideBox .lilstory_swiper .swiper-button-next{ margin-left:27%;}
}

@media (max-width:1500px){
#lilstory .visual .titleBox .title{ font-size:80px; letter-spacing:10px;}
#lilstory .visual .titleBox .subTitle{ font-size:24px; margin-top:70px}
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox .text01{ font-size:35px}
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox .text02{ font-size:15px;}
#lilstory .slideBox .lilstory_swiper .swiper-slide .modBtn{ right:12px;}
#lilstory .slideBox .lilstory_swiper .swiper-button-prev{ margin-left:-29%}
}

@media (max-width:1240px){
#lilstory .visual .titleBox .title{ font-size:70px;}
#lilstory .visual .titleBox .subTitle{ font-size:20px; margin-top:50px}
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox .text01{ font-size:28px}
#lilstory .slideBox .lilstory_swiper .swiper-slide .textBox .text02{ font-size:14px;}
}

@media (max-width:1024px){
#lilstory_m_only{ display:block !important; position:relative; width:100%; height:100vh;}
#lilstory_m_only span{ display:block; position:absolute; top:50%; left:0; width:100%; font-size:14px; color:#1f1f1f; text-align:center; transform:translateY(-50%);}
#lilstory{ display:none !important}
}

@media (max-height:938px){
#lilstory_popup{ padding:60px 0;}
#lilstory_popup .xBtn{ right:30px}
#lilstory_popup .center{ width:1150px;}
#lilstory_popup .gallery-thumbs-box .swiper-slide{ height:80px;}
}

@media (max-height:850px){
#lilstory_popup{ padding:50px 0;}
#lilstory_popup .center{ width:1050px;}
}



/* 브랜드 스토리 */
#brand section{ padding:100px 0}
#brand .visual{ position:relative; height:39vw; text-align:center; }
#brand .visual:before{ content:""; position:absolute; top:0; left:0; width:100%; height:100%; background-image:url(/img/new/brand_visual.png); background-position:center; background-repeat:no-repeat; background-size:cover;}
#brand .visual.on:before{ animation:fadeIn 3s both;-webkit-animation:fadeIn 3s both;-ms-animation:fadeIn 3s both;}
#brand .visual .titleBox{ position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; z-index:3; text-align:center}
#brand .visual .titleBox .title{ font-size:120px; font-weight:bold; color:#1f1f1f; letter-spacing:30px; font-family: 'neue-haas-unica', sans-serif !important;}
#brand .visual .titleBox .title span{ color:transparent; -webkit-text-fill-color:transparent; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color:#1f1f1f;}
#brand .visual .titleBox .subTitle{ font-size:30px; color:#1f1f1f; line-height:1.6; margin-top:100px;}
#brand .visual .titleBox .subTitle span{ color:#ef4e1b;}
#brand .estimate{ padding:100px 0; background-color:#f0f0f0; text-align:center}
#brand .estimate .box{ width:420px; background-color:#fff; box-shadow:0 0 10px 1px rgba(0,0,0,0.1); border-radius:10px; padding:50px 0; text-align:center; margin:0 auto 50px;}
#brand .estimate .box .text{ font-size:26px; color:#1f1f1f;}
#brand .estimate .box ul{ margin-top:50px;}
#brand .estimate .box ul li{ margin-bottom:15px; font-size:22px; color:#1f1f1f;}
#brand .estimate .box ul li:last-child{ margin-bottom:0}
#brand .estimate .box ul li span{ display:inline-block; vertical-align:middle; width:90px;}
#brand .estimate .box ul li span:first-child{ margin-right:20px;}
#brand section .halfBox{ width:1100px; margin:0 auto; font-size:0}
#brand section .halfBox:after{ content:""; display:block; clear:both}
#brand section .halfBox .left{ float:left}
#brand section .halfBox .right{ float:right}
#brand section .halfBox .half{ width:50%;}
#brand section .halfBox .half .textBox{ text-align:right; margin-top:50px}
#brand section .halfBox .half .textBox .text01{ display:inline-block; text-align:left; font-size:45px; color:#1f1f1f;}
#brand section .halfBox .half .textBox .text02{ display:inline-block; text-align:left; font-size:17px; color:#1f1f1f; line-height:1.5; margin-top:60px;}
#brand section .halfBox .half .chartSwiper{ text-align:center;}
#brand section .halfBox .half .chartSwiper .swiper-container .swiper-wrapper{ display:inline-block}
#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide{ position:relative; display:inline-block; vertical-align:bottom; width:190px; margin:0 40px; }
#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide figure{}
#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide figure img{ display:block; width:100%;}
#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide figure figcaption{ font-size:18px; color:#1f1f1f; text-align:center; margin-top:15px;}
#brand .service figure{ padding:0}
#brand .portfolio{ padding:0}
#brand .mypage .center figure{ left:-100px}
#brand .mypage .titleBox{ width:600px;}
#brand .mypage .center{ height:auto}
#brand .mypage figure img{ width:38vw; max-width:740px}
#brand .mypage2 figure{ position:relative}
#brand .mypage2 figure img{ width:770px; max-width:770px}
#brand .mypage2 figure a{ position:absolute; left:0; width:60%; height:125px; display:block; z-index:1}
#brand .mypage2 figure a.news_link01{ top:30px;}
#brand .mypage2 figure a.news_link02{ top:150px;}
#brand .mypage2 figure a.news_link03{ top:280px;}
#brand .mypage2 figure a.news_link04{ top:410px;}
#brand .mypage2 figure a.news_link05{ top:535px;}
#brand .mypage2 figure a.news_link06{ top:665px;}

#recruit{}
#recruit .visual{ position:relative; height:50vw; background-image:url(/img/new/bg_recruit.jpg); background-position:center; background-repeat:no-repeat; background-size:cover;}
#recruit .visual.on{ animation:fadeIn 3s both;-webkit-animation:fadeIn 3s both;-ms-animation:fadeIn 3s both;}
#recruit .visual .titleBox{ position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; text-align:center;}
#recruit .visual .titleBox .recruit_title{ font-size:110px; font-weight:bold; color:#fff; letter-spacing:25px; font-family: 'neue-haas-unica', sans-serif !important;}
#recruit .visual .titleBox .recruit_title span{ color:transparent; -webkit-text-fill-color:transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color:#fff; margin-right:50px}
#recruit .visual .titleBox .recruit_subTitle{ font-size:30px; color:#fff; margin-top:100px; line-height:1.8;}
#recruit .contents{ padding:100px 0; text-align:center}
#recruit .contents .title{ font-size:40px; font-weight:bold; color:#1f1f1f; letter-spacing:5px; font-family: 'neue-haas-unica', sans-serif !important;}
#recruit .contents .jobList{ margin-top:50px}
#recruit .contents .jobList a{ display:block; width:550px; line-height:60px; font-size:22px; color:#1f1f1f; text-align:center; border:1px solid #1f1f1f; box-sizing:border-box; margin:30px auto 0;}
#recruit .contents .jobList a:hover{ color:#fff; background-color:#ef4e1b; border-color:#ef4e1b}

.popup_new{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.86); z-index:1000;}
.popup_new .popup_main{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
.popup_new .popup_main .xBtn{ position:absolute; top:0; right:-50px; width:30px; height:30px; display:block; background-image:url(/img/new/xBtn_w.svg); background-position:center; background-repeat:no-repeat; background-size:contain;}
.popup_new .popup_main .contents{ width:650px; background-color:#fff; padding:40px; box-sizing:border-box;}
#location .title{ font-size:24px; font-weight:bold; color:#1f1f1f; font-family: 'neue-haas-unica', sans-serif !important; text-align:left; margin-bottom:10px;}
#location #map{ width:100%; height:300px;}
#location .way_list{}
#location .way_list li{ margin-top:30px; text-align:left}
#location .way_list li:last-child{ margin-bottom:0}
#location .way_list li .way_title{ font-size:22px; color:#1f1f1f; margin-bottom:10px; font-family: 'neue-haas-unica', sans-serif !important;}
#location .way_list li .text{font-size:18px; color:#777; margin-bottom:10px;}
#location .way_list li a{ display:block; width:100%; line-height:50px; font-size:18px; font-weight:bold; color:#1f1f1f; border:1px solid #1f1f1f; box-sizing:border-box; margin-bottom:30px; text-align:center;}
#location .way_list li a:hover{ color:#fff; background-color:#1f1f1f}
#location .way_list li:last-child a{ margin-bottom:0}

/* 상담/AS 신청 */
.request .popup_main .contents{ height:800px; overflow:auto;}
.request .subTitle{ font-size:20px; color:#1f1f1f; line-height:1.4; text-align:left; margin-bottom:30px;}
.request .title{ text-align:left;}
.request .title span{ font-size:24px; font-weight:600; color:#1f1f1f;}
.request .formArea{ margin-top:30px;}
.request .formArea .reward_notice{ font-size:18px; font-weight:300; color:#1f1f1f; margin-bottom:20px; line-height:1.6;}
.request .formArea .reward_notice b{ position:relative; padding:0 3px; font-weight:800}
.request .formArea .reward_notice b:before{ position:absolute; content:""; top:50%; left:0; width:100%; height:80%; transform:translateY(-50%); background-color:rgba(255,240,0,0.3);}
.request .formArea .form_list{ text-align:left;}
.request .formArea .form_list li{ margin-top:20px; padding-top:30px }
.request .formArea .form_list li .form_title{ font-size:18px; font-weight:600; color:#333; margin-bottom:10px;}
.request .formArea .form_list li .form_title span{ display:inline-block; vertical-align:top; width:5px; height:5px; border-radius:50%; background-color:#ef4e1b; margin-left:5px;}
.request .formArea .form_list li .form_title font{ font-size:14px}
.request .formArea .form_list li .floatBox{ overflow:hidden; padding:1px}
.request .formArea .form_list li .floatBox:after{ content:""; display:block; clear:both}
.request .formArea .form_list li .inputBox{ width:100%; height:40px; border-bottom:2px solid #1f1f1f; box-sizing:border-box; margin-bottom:10px}
.request .formArea .form_list li .inputBox input{ display:block; width:100%; height:100%; font-size:16px; color:#333; padding-left:10px; box-sizing:border-box; border:none; background-color:transparent; outline:none;}
.request .formArea .form_list li .textArea{ width:100%; height:200px; border-left:2px solid #1f1f1f; border-right:2px solid #1f1f1f; border-top:none; border-bottom:none; box-sizing:border-box}
.request .formArea .form_list li .textArea textarea{ display:block; width:100%; height:100%; font-size:14px; color:#333; padding:10px; box-sizing:border-box; border:none; background-color:transparent; outline:none; resize:none;}
.request .formArea .form_list li .radioStyle{ display:none}
.request .formArea .form_list li .radioStyle + label{ display:block; float:left; width:33.33%; height:45px; line-height:45px; font-size:16px; color:#1f1f1f; text-align:center; border:1px solid #ddd; box-sizing:border-box; margin-left:-1px; margin-top:-1px; cursor:pointer}
.request .formArea .form_list li .radioStyle + label:nth-of-type(3n){ margin-right:0}
.request .formArea .form_list li .radioStyle:checked + label{ color:#fff; background-color:#1f1f1f;}
.request .formArea .form_list li .radioStyle2{ display:none}
.request .formArea .form_list li .radioStyle2 + label{ display:block; float:left; width:32%; height:45px; line-height:45px; font-size:16px; color:#1f1f1f; text-align:center; border:1px solid #ddd; box-sizing:border-box; margin-right:2%; margin-bottom:10px; cursor:pointer}
.request .formArea .form_list li .radioStyle2 + label:nth-of-type(3n){ margin-right:0}
.request .formArea .form_list li .radioStyle2:checked + label{ color:#fff; background-color:#1f1f1f;}
.request .formArea .form_list li .pyBox{ font-size:0}
.request .formArea .form_list li .pyBox .py_type{ display:none;}
.request .formArea .form_list li .pyBox .py_type + label{ display:inline-block; vertical-align:middle; width:120px; height:45px; line-height:45px; font-size:16px; color:#1f1f1f; text-align:center; border:1px solid #ddd; box-sizing:border-box; cursor:pointer}
.request .formArea .form_list li .pyBox .py_type:checked + label{ color:#fff; background-color:#1f1f1f;}
.request .formArea .form_list li .pyBox .py_type + label:last-of-type{ margin-left:-1px}
.request .formArea .form_list li .pyBox .inputBox{ display:inline-block; vertical-align:middle; width:262px; height:45px; border-bottom:2px solid #1f1f1f; box-sizing:border-box; margin-left:30px}
.request .formArea .form_list li .pyBox .inputBox input{ display:block; width:100%; height:100%; padding:10px; box-sizing:border-box; border:none; background-color:transparent; font-size:16px; color:#1f1f1f; outline:none;}
.request .formArea .form_list li .pyBox p{ display:inline-block; vertical-align:middle; font-size:16px; font-weight:500; color:#1f1f1f; margin-left:5px}
.request .formArea .form_list li .selectBox{ width:100%; height:45px; border-bottom:2px solid #1f1f1f; box-sizing:border-box; background-image:url(/img/down.png); background-position:right 10px center; background-repeat:no-repeat; background-size:17px;}
.request .formArea .form_list li .selectBox select{ display:block; width:100%; height:100%; padding:10px; box-sizing:border-box; border:none; background-color:transparent; font-size:14px; color:#1f1f1f; outline:none; cursor:pointer}
.request .formArea .form_list li .uploadBox{ display:inline-block; vertical-align:middle}
.request .formArea .form_list li .uploadBox input{ display:none;}
.request .formArea .form_list li .uploadBox label{ display:inline-block; vertical-align:middle; width:110px; height:110px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; padding:25px 0; text-align:center; cursor:pointer}
.request .formArea .form_list li .uploadBox label i{ font-size:30px; color:#1f1f1f;}
.request .formArea .form_list li .uploadBox label p{ font-size:14px; color:#1f1f1f; margin-top:10px;}
.request .formArea .form_list li .notice{ font-size:14px; color:#1f1f1f; line-height:1.6; margin-bottom:10px;}
.request .formArea .form_list li .notice br{ display:none}
.request .formArea .form_list li .img_list{ display:inline-block; vertical-align:middle}
.request .formArea .form_list li .img_list .imgBox{ position:relative; display:inline-block; vertical-align:middle; width:110px; height:110px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; text-align:center; margin-right:5px; margin-bottom:5px;}
.request .formArea .form_list li .img_list .imgBox > img{ width:100%; height:100%; border-radius:5px; z-index:1}
.request .formArea .form_list li .img_list .imgBox .img_delete{ position:absolute; top:2px; right:2px; display:block; padding:5px 5px 6px; border-radius:50%; background-color:rgba(0,0,0,0.3); z-index:2;}
.request .formArea .form_list li .img_list .imgBox .img_delete img{ display:block; width:8px;}
.request .formArea .form_list li .budget{ font-size:0}
.request .formArea .form_list li .budget .inputBox{ display:inline-block; vertical-align:middle; width:517px; height:45px; border-bottom:2px solid #1f1f1f; box-sizing:border-box;}
.request .formArea .form_list li .budget .inputBox input{ display:block; width:100%; height:100%; padding:0 10px; box-sizing:border-box; border:none; background-color:transparent; font-size:16px; color:#1f1f1f; outline:none;}
.request .formArea .form_list li .budget p{ display:inline-block; vertical-align:middle; font-size:16px; font-weight:500; color:#1f1f1f; margin-left:5px; margin-bottom:5px;}
.request .formArea .form_list li.phone .inputBox{ display:inline-block; vertical-align:middle; width:160px;}
.request .formArea .form_list li.phone p{ display:inline-block; vertical-align:middle; font-size:18px; color:#333; margin:0 10px; }
.request .formArea .form_list li.recommend{ display:none; margin-top:10px;}
.request .formArea .agreeBox{ margin-top:50px;}
.request .formArea .agreeBox input{ display:none;}
.request .formArea .agreeBox input + label{ display:inline-block; vertical-align:middle; width:19px; height:19px; background-image:url(/img/renewal/check_off.png?1); background-position:center; background-repeat:no-repeat; background-size:19px; margin-right:5px; cursor:pointer}
.request .formArea .agreeBox input:checked + label{ background-image:url(/img/renewal/check_on.png?1);}
.request .formArea .agreeBox .agreeBtn{ display:inline-block; vertical-align:middle; font-size:18px; font-weight:600; color:#333; text-decoration:underline;}
.request .formArea .agreeBox span{ display:inline-block; vertical-align:middle; font-size:17px; color:#333;}
.request .formArea .request_btn{ margin-top:50px}
.request .formArea .request_btn a{ display: flex; align-items: center; justify-content: center; width:100%; height:60px; font-size:16px; color:#fff; text-align:center; background-color:#ef4e1b; border-radius: 30px;}

/* 개인정보취급방침 (팝업)*/
#personal_info {}
#personal_info .popup_main .contents .title{ text-align:center; margin-bottom:30px;}
#personal_info .popup_main .contents .title span{ display:inline-block; font-size:24px; font-weight:bold; color:#333; text-align:center; padding-bottom:5px; border-bottom:2px solid #333;}
#personal_info .popup_main .contents .subTitle{ font-size:14px; font-weight:bold; color:#333; margin-top:30px; margin-bottom:10px;}
#personal_info .popup_main .contents .textBox{ width:100%; height:650px; overflow-y:scroll; padding-right:10px}
#personal_info .popup_main .contents .text01{ font-size:12px; color:#333; line-height:24px;}
#personal_info .popup_main .contents .text02{ font-size:12px; color:#333; line-height:24px;}

#terms{ position: relative; padding:200px 0}
#terms .xBtn{ position: absolute; top: 20px; right: 20px;}
#terms .xBtn img{ display: block; width: 20px;}
#terms .center{}
#terms .center .title{ text-align:center; margin-bottom:30px;}
#terms .center .title span{ display:inline-block; font-size:24px; font-weight:bold; color:#333; text-align:center; padding-bottom:5px; border-bottom:2px solid #333;}
#terms .center .subTitle{ font-size:14px; font-weight:bold; color:#333; margin-top:30px; margin-bottom:10px;}
#terms .center .textBox{ padding:40px; border:1px solid #ddd;}
#terms .center .text01{ font-size:14px; color:#333; line-height:24px;}
#terms .center .text02{ font-size:14px; color:#333; line-height:24px;}

/* 어바웃 */
#about{}
#about .subTitle{ font-size:24px; font-weight:500; color:#333; margin-bottom:50px;}
#about .brandBox{ text-align:left; margin-bottom:100px}
#about .brandBox .ciBox{ display:inline-block; vertical-align:top; margin-right:100px}
#about .brandBox .ciBox img{ width:220px;}
#about .brandBox .ciBox p{ display:block; width:100%; font-size:18px; color:#838383; text-align:center; margin-top:18px;}
#about .brandBox .brand_text{ display:inline-block; vertical-align:top; padding-top:16px;}
#about .brandBox .brand_text .text01{ font-size:18px; font-weight:500; color:#333; margin-bottom:15px}
#about .brandBox .brand_text .text02{ font-size:16px; font-weight:300; color:#838383; margin-bottom:60px; line-height:1.6;}
#about .brandBox .brand_text .color_list{ margin-bottom:60px}
#about .brandBox .brand_text .color_list li{ margin-bottom:20px;}
#about .brandBox .brand_text .color_list li img{ display:inline-block; vertical-align:middle; width:40px; margin-right:30px;}
#about .brandBox .brand_text .color_list li span{ display:inline-block; vertical-align:middle; font-size:16px; color:#838383; }
#about .brandBox .brand_text .img_text{}
#about .brandBox .brand_text .img_text img{ display:inline-block; vertical-align:middle; width:420px; margin-right:70px;}
#about .brandBox .brand_text .img_text .btn{ display:inline-block; vertical-align:middle; width:150px; line-height:30px; font-size:14px; color:#333; text-align:center; border:1px solid #333; transition:0.5s}
#about .brandBox .brand_text .img_text .btn:hover{ background-color:#333; color:#fff;}

#recruit_form{ padding:0 0 50px}
#recruit_form .titleBox{ width:800px; margin:0 auto; padding:30px 0;}
#recruit_form .titleBox .recruit_title{ font-size:34px; font-weight:bold; color:#333; margin-bottom:30px; text-align:center}
#recruit_form .titleBox .recruit_subTitle{ font-size:16px; font-weight:300; color:#888; line-height:1.4;}
#recruit_form .imgBox{ width:800px; margin:0 auto;}
#recruit_form .imgBox img{ max-width:100%}
#recruit_form .formArea{ width:700px; margin:0 auto; padding:20px 0 50px; }
#recruit_form .formArea .form_title{ font-size:18px; font-weight:600; color:#333; margin-bottom:10px; margin-top:50px;}
#recruit_form .formArea .form_title span{ display:inline-block; vertical-align:top; width:5px; height:5px; border-radius:50%; background-color:#ef4e1b; margin-left:5px;}
#recruit_form .formArea .form_title p{ display:inline-block; font-size:16px;}
#recruit_form .formArea .form_subTitle{ font-size:14px; color:#888; margin-bottom:10px; margin-top:-10px;}
#recruit_form .formArea .floatBox{ overflow:hidden}
#recruit_form .formArea .floatBox:after{ content:""; display:block; clear:both}
#recruit_form .formArea .wd50{ float:left; width:49%; margin-right:2%;}
#recruit_form .formArea .wd50:last-child{ margin-right:0;}
#recruit_form .formArea .inputBox{ width:100%; height:45px; border-bottom:2px solid #1f1f1f; box-sizing:border-box;}
#recruit_form .formArea .inputBox input{ display:block; width:100%; height:100%; padding-left:10px; box-sizing:border-box; border:none; background-color:transparent; font-size:14px; color:#333;outline:none;}
#recruit_form .formArea .radioStyle{ display:none}
#recruit_form .formArea .radioStyle + label{ display:block; float:left; width:23.5%; height:45px; line-height:45px; font-size:17px; font-weight:bold; color:#333; text-align:center; border:1px solid #ddd; box-sizing:border-box; margin-right:2%; cursor:pointer}
#recruit_form .formArea .radioStyle + label:last-of-type{ margin-right:0}
#recruit_form .formArea .radioStyle:checked + label{ color:#fff; background-color:#1f1f1f; }
#recruit_form .formArea .uploadBox{ display:inline-block; vertical-align:middle}
#recruit_form .formArea .uploadBox input{ font-size:14px;}
#recruit_form .formArea .uploadBox label{ display:inline-block; vertical-align:middle; width:120px; font-size:16px; color:#333;}
#recruit_form .formArea .uploadBox label span{ display:inline-block; vertical-align:top; width:5px; height:5px; border-radius:50%; background-color:#ef4e1b; margin-left:5px;}
#recruit_form .formArea .uploadBox p{ display:block; width:100%; margin-top:10px;}
#recruit_form .formArea .notice{ font-size:17px; color:#aaa; line-height:1.6; margin-top:10px;}
#recruit_form .formArea .agreeBox{ margin-top:50px;}
#recruit_form .formArea .agreeBox input{ display:none;}
#recruit_form .formArea .agreeBox input + label{ display:inline-block; vertical-align:middle; width:19px; height:19px; background-image:url(/img/renewal/check_off.png?1); background-position:center; background-repeat:no-repeat; background-size:19px; margin-right:5px; cursor:pointer}
#recruit_form .formArea .agreeBox input:checked + label{ background-image:url(/img/renewal/check_on.png?1);}
#recruit_form .formArea .agreeBox .agreeBtn{ display:inline-block; vertical-align:middle; font-size:17px; font-weight:800; color:#333; text-decoration:underline;}
#recruit_form .formArea .agreeBox span{ display:inline-block; vertical-align:middle; font-size:17px; color:#333;}
#recruit_form .formArea .request_btn{ display:block; width:100%; line-height:60px; font-size:18px; color:#fff; text-align:center; background-color:#ef4e1b; margin-top:50px}
#recruit_form .formArea .check{}
#recruit_form .formArea .check input{ display:none;}
#recruit_form .formArea .check input + label{ display:block; width:100%; background-image:url(/img/radio_btn_off.png); background-position:left center; background-repeat:no-repeat; background-size:19px; margin-right:5px; font-size:16px; color:#333; padding:5px 0 5px 25px; box-sizing:border-box; cursor:pointer; margin-bottom:5px;}
#recruit_form .formArea .check input:checked + label{ background-image:url(/img/radio_btn_on.png);}
#recruit_form .formArea .check input[type=checkbox] + label{ background-image:url(/img/renewal/check_off.png?1);}
#recruit_form .formArea .check input[type=checkbox]:checked + label{ background-image:url(/img/renewal/check_on.png?1);}
#recruit_form .formArea .textArea{}
#recruit_form .formArea .textArea textarea{ display:block; width:100%; height:100px; padding:10px; box-sizing:border-box; font-size:14px; color:#333; text-align:left; border:1px solid #ddd; outline:none; resize:none; line-height:1.4;}

#recruit_recommend{ width:100%; max-width:400px; margin:0 auto; box-sizing:border-box; padding:30px 20px;}
#recruit_recommend .title{ font-size:24px; font-weight:600; color:#333; text-align:center;}
#recruit_recommend .subTitle{ font-size:14px; color:#888; font-weight:300; margin-top:20px; line-height:1.4; text-align:center}
#recruit_recommend .formArea{ margin-top:30px}
#recruit_recommend .formArea .textArea{}
#recruit_recommend .formArea .textArea textarea{ display:block; width:100%; height:200px; padding:10px; box-sizing:border-box; font-size:14px; color:#333; text-align:left; border:1px solid #ddd; outline:none; resize:none; line-height:1.4;}
#recruit_recommend .request_btn{ display:block; width:100%; line-height:45px; font-size:14px; color:#fff; text-align:center; background-color:#1f1f1f; margin-top:20px}

/* 파트너스 */
#partners .center .partner_list{ overflow:hidden; margin-top:100px}
#partners .center .partner_list:after{ content:""; display:block; clear:both}
#partners .center .partner_list li{ width:32%; float:left; margin-right:2%; box-sizing:border-box; margin-bottom:40px}
#partners .center .partner_list li:nth-child(3n){ margin-right:0}
#partners .center .partner_list li a{ display:block;}
#partners .center .partner_list li a img{ display:block; width:100%}

/* 파트너스 신청 */
#partners_form .formArea{ width:100%; padding:20px 20px 50px; box-sizing:border-box}
#partners_form .formArea .form_title span{ font-size:20px; font-weight:600; color:#1f1f1f; padding-bottom:5px; border-bottom:2px solid #1f1f1f;}
#partners_form .formArea form{ margin-top:50px}
#partners_form .formArea .form_subTitle{ font-size:14px; font-weight:600; color:#333; margin-bottom:5px; margin-top:30px;}
#partners_form .formArea .form_subTitle span{ vertical-align:top; color:red; font-weight:bold; font-size:16px}
#partners_form .formArea .floatBox{ overflow:hidden}
#partners_form .formArea .floatBox:after{ content:""; display:block; clear:both}
#partners_form .formArea .inputBox{ width:100%; height:35px; border:1px solid #ddd; box-sizing:border-box;}
#partners_form .formArea .inputBox input{ display:block; width:100%; height:100%; padding-left:10px; box-sizing:border-box; border:none; background-color:transparent; font-size:12px; color:#333;outline:none;}
#partners_form .formArea .radioStyle{ display:none}
#partners_form .formArea .radioStyle + label{ display:block; float:left; width:23.5%; height:35px; line-height:35px; font-size:12px; color:#555; text-align:center; border:1px solid #ddd; box-sizing:border-box; margin-right:2%; margin-bottom:10px; cursor:pointer}
#partners_form .formArea .radioStyle + label:nth-of-type(4n){ margin-right:0}
#partners_form .formArea .radioStyle:checked + label{ color:#fff; background-color:#555;}
#partners_form .formArea .img_list{ display:inline-block; vertical-align:middle}
#partners_form .formArea .img_list .imgBox{ position:relative; display:inline-block; vertical-align:middle; width:115px; height:120px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; text-align:center; margin-right:5px;}
#partners_form .formArea .img_list .imgBox > img{ width:100%; height:100%; border-radius:5px; z-index:1}
#partners_form .formArea .img_list .imgBox .img_delete{ position:absolute; top:2px; right:2px; display:block; padding:5px 5px 6px; border-radius:50%; background-color:rgba(0,0,0,0.3); z-index:2;}
#partners_form .formArea .img_list .imgBox .img_delete img{ display:block; width:8px;}
#partners_form .formArea .uploadBox{ display:inline-block; vertical-align:middle}
#partners_form .formArea .uploadBox input{ display:none;}
#partners_form .formArea .uploadBox label{ display:inline-block; vertical-align:middle; width:85px; height:80px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; padding:20px 0; text-align:center; cursor:pointer}
#partners_form .formArea .uploadBox label i{ font-size:20px; color:#aaa}
#partners_form .formArea .uploadBox label p{ font-size:11px; color:#aaa; margin-top:5px;}
#partners_form .formArea .agreeBox{ margin-top:30px;}
#partners_form .formArea .agreeBox input{ display:none;}
#partners_form .formArea .agreeBox input + label{ display:inline-block; vertical-align:middle; width:16px; height:16px; background-image:url(/img/renewal/check_off.png?1); background-position:center; background-repeat:no-repeat; background-size:16px; margin-right:5px; cursor:pointer}
#partners_form .formArea .agreeBox input:checked + label{ background-image:url(/img/renewal/check_on.png?1);}
#partners_form .formArea .agreeBox .agreeBtn{ display:inline-block; vertical-align:middle; font-size:14px; font-weight:600; color:#333; text-decoration:underline;}
#partners_form .formArea .agreeBox span{ display:inline-block; vertical-align:middle; font-size:14px; color:#333;}
#partners_form .formArea .request_btn{ display:block; width:100%; line-height:46px; font-size:14px; font-weight:600; color:#fff; text-align:center; background-color:#1f1f1f; margin-top:50px}

/* 포트폴리오 */
#portfolio .center{ width:100%; padding:0 60px;}
#portfolio .title{ font-size:32px; font-weight:bold; color:#1f1f1f; font-family: 'neue-haas-unica', sans-serif !important;}
#portfolio .subTitle{ font-size:24px; color:#1f1f1f; margin:20px 0 50px;}
#portfolio .cate_title{ font-size:22px; font-weight:bold; color:#1f1f1f;}
#portfolio .cate_title .reset{ font-size:14px; color:#cbcbcb; text-decoration:underline; margin-left:15px;}
#portfolio .cate_title .reset:hover{ color:#ef4e1b}
#portfolio #bo_cate .tabBox{ margin-top:70px;}
#portfolio #bo_cate .tabBox a{ display:inline-block; vertical-align:middle; font-size:24px; color:#cbcbcb; padding:5px 0; margin-right:30px;}
#portfolio #bo_cate .tabBox a.on{ color:#1f1f1f; border-bottom:3px solid #1f1f1f; font-weight:bold;}
#portfolio #bo_cate ul {margin-top:30px; margin-bottom:100px}
#portfolio #bo_cate ul:after{ content:""; display:block; clear:both}
#portfolio #bo_cate li { float:left; margin-right:10px;}
#portfolio #bo_cate li input{ display:none}
#portfolio #bo_cate li a,
#portfolio #bo_cate li input + label { display:block; font-size:18px; font-weight:500; color:#cbcbcb; margin-right:20px; padding-right:25px; cursor:pointer}
#portfolio #bo_cate #bo_cate_on,
#portfolio #bo_cate li a.on,
#portfolio #bo_cate li input:checked + label{ color:#ef4e1b; font-weight:bold}
#portfolio #bo_cate #bo_cate_on,
#portfolio #bo_cate li a.on,
#portfolio #bo_cate li input:checked + label{ background-image:url(/img/new/icon_check.png); background-position:right center; background-repeat:no-repeat; background-size:16px; color:#ef4e1b;}
#portfolio .img_list{}
#portfolio .img_list:after{ content:""; display:block; clear:both}
#portfolio .img_list li{ position:relative; float:left; width:32%; margin-right:2%; margin-bottom:30px; cursor:pointer; overflow:hidden}
#portfolio .img_list li div{ height:384px; background-position:center; background-repeat:no-repeat; background-size:cover; transition:0.2s;}
#portfolio .img_list li:nth-child(3n){ margin-right:0}
#portfolio .img_list li div:hover{ transform:scale(1.1);}
#portfolio #img_view{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:#1f1f1f; z-index:1000;}
#portfolio #img_view .link{ position:absolute; top:30px; left:50px; width:160px; font-size:16px; color:#fff; border: 1px solid #fff; border-radius: 7px; padding: 10px 0; text-align: center;z-index:10}
#portfolio #img_view .xBtn{ position:absolute; top:30px; right:50px; display:block; z-index:10}
#portfolio #img_view .xBtn img{ display:block; width:30px;}
#portfolio #img_view .view_main{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height: calc(100vh - 60px); text-align: center;}
#portfolio #img_view .view_main img{ max-width:100%; max-height:100%;}
#portfolio #bo_gall .gall_con li a{ position:relative; width:100%;}
#portfolio #bo_gall .gall_con li a figure{display:none; position:absolute; top:0; right:0; padding:15px; width:100%; box-sizing:border-box; text-align:right; z-index:1}
#portfolio #bo_gall .gall_con li a figure img{ display:inline-block; vertical-align:middle; height:40px; margin-left:10px}
#portfolio #bo_gall .gall_con li a figure p{ position:relative; display:inline-block; vertical-align:middle; width:40px; height:40px; margin-left:10px}
#portfolio #bo_gall .gall_con li a figure p img{ position:absolute; top:0; left:0; margin-left:0}
#portfolio #bo_gall .gall_con li a figure p img.arrow{ animation: rotate_image 2s linear infinite; transform-origin: 50% 50%;}

#portfolio_view #bo_v_atc .title{ font-size:34px; font-weight:bold; color:#1f1f1f; font-family: 'neue-haas-unica', sans-serif !important;}
#portfolio_view #bo_v_atc .subject{ position:relative; font-size:24px; font-weight:bold; color:#1f1f1f; }
#portfolio_view #bo_v_atc .description{ font-size:18px; font-weight:300; color:#838383; margin-top:10px}
#portfolio_view #bo_v_atc .subject .num{ position: relative; margin-right: 20px;}
#portfolio_view #bo_v_atc .subject .num:before{ content: "|"; position: absolute; top: 50%; transform: translateY(-50%); right: -15px;}
#portfolio_view #bo_v_atc .infoArea{ width:100%; margin-top:50px;}
#portfolio_view #bo_v_atc .infoArea .cons_info{}
#portfolio_view #bo_v_atc .infoArea .cons_info .info_list{}
#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul{}
#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul li{ display:inline-block; vertical-align:middle; width:30%; padding-bottom:15px; font-size:17px; color:#cbcbcb; text-align:left}
#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul li p{ display:inline-block; vertical-align:top; margin-left:20px; font-weight:bold; color:#1f1f1f;}
#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul li p span{ position:relative; margin-right:10px;}
#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul li p span:before{ content:","; position:absolute; bottom:0; right:-6px; font-size:17px; font-weight:bold; color:#1f1f1f;}
#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul li p span:last-child:before{ display:none}
#portfolio_view #bo_v_atc .cate{ margin-top:70px;}
#portfolio_view #bo_v_atc .cate a{ display:inline-block; vertical-align:middle; font-size:17px; color:#cbcbcb; line-height:30px; padding:0 20px; margin-right:10px; border-radius:5px;}
#portfolio_view #bo_v_atc .cate a.on{ color:#ef4e1b; border:1px solid #ef4e1b;}
#portfolio_view #bo_v_atc .galleryBox{ margin-top:40px; margin-bottom:70px}
#portfolio_view #bo_v_atc .galleryBox .swiper-container{ overflow: hidden}
#portfolio_view #bo_v_atc .galleryBox .swiper-slide{ text-align:center;}
#portfolio_view #bo_v_atc .galleryBox .swiper-slide img{ max-width:100%; max-height:100%; object-fit: contain; object-position: center}
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box{ width:100%;}
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .swiper-slide{ width:auto !important; height:90px;}
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox{ margin-top: 20px}
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_01,
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_02{ display:inline-block; vertical-align:middle; width: 180px; line-height: 50px; font-size: 16px; color: #fff; text-align: center; background-color: #1f1f1f; border-radius: 30px; transform: skew(-0.1deg)}
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_01{ background-color:#ef4e1b;}
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_sns{ display:inline-block; vertical-align:middle; margin-right:10px;}
#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_sns img{ display: block; width: 50px}
#portfolio_view #bo_v_atc .galleryBox .gallery_thumbs { display:inline-block; vertical-align:middle; width:100%; box-sizing: border-box; padding-left:1px;}
#portfolio_view #bo_v_atc .galleryBox .gallery_thumbs .swiper-slide-thumb-active{ border:1px solid #ef4e1b; box-sizing:border-box}

#portfolio_view #bo_v_atc .galleryBox .gallery-view-box{ position:relative; margin-top:70px; padding:0 100px; box-sizing:border-box; }
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide{ position:relative; height:670px; text-align:center}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .imgBox{ position:relative; display:inline-block; vertical-align:middle; height:inherit; background-color:#fff;}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .imgBox img{ display:block}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox{ position:absolute; top:15px; right:15px; z-index:2}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a{ display:block; width:50px; height:50px; background-position:center; background-repeat:no-repeat; background-size:contain; z-index:2}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.planBtn,
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.planBtn3{ background-image:url(/img/btn_plan.png?2);}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.beforeBtn,
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.beforeBtn2{ background-image:url(/img/new/btn_before.png);}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.afterBtn,
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.afterBtn2,
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.afterBtn3{ background-image:url(/img/new/btn_after.png);}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.btn360{ display: none !important; position:relative;}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.btn360 img{ position:absolute; display:block; top:0; left:0;}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a.btn360 img.arrow{ animation: rotate_image 2s linear infinite; transform-origin: 50% 50%;}
#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a:first-child{ margin-bottom:10px}
#portfolio_view #bo_v_atc .galleryBox .button{ position:absolute; top:50%; transform:translateY(-50%); width:24px; height:44px; background-position:center; background-repeat:no-repeat; background-size:contain; margin-top:0;}
#portfolio_view #bo_v_atc .galleryBox .button:after{ display:none !important}
#portfolio_view #bo_v_atc .galleryBox .swiper-button-prev{ left:0; background-image:url(/img/new/prevBtn.png); }
#portfolio_view #bo_v_atc .galleryBox .swiper-button-next{ right:0; background-image:url(/img/new/nextBtn.png);}
#portfolio_view.layoutDesign .linkBtn{ position:fixed; display:block; top:130px; right:40px; width:77px; height:77px; line-height:77px; font-size:14px; font-weight:bold; color:#1f1f1f; background-color:#cbcbcb; text-align:center; border-radius:50%; transform: skew(-0.1deg);}
#portfolio_view.layoutDesign #bo_v_atc{ position:relative;}
#portfolio_view.layoutDesign #bo_v_atc .subject{ margin-top:0;}
#portfolio_view.layoutDesign #bo_v_atc .subject span{ font-size:17px; color:#999;}
#portfolio_view.layoutDesign #bo_v_atc .cate_main{ margin-top:40px;}
#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide figure{ position:relative; height:160px; border:1px solid #1f1f1f;}
#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide figure img{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:block; max-width:100%; max-height:100%; z-index:-1}
#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide figure .modify{ position:absolute; top:0; right:0; font-size:12px; color:#fff; padding:5px 7px; background-color:rgba(0,0,0,0.8); z-index:1;}
#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide figure .add{ position:absolute; top:0; left:0; width:100%; height:100%; line-height:2; display:block; font-size:80px; font-weight:300; color:#1f1f1f; text-align:center; z-index:1}
#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide figcaption{ font-size:17px; font-weight:bold; color:#1f1f1f; text-align:center; margin-top:10px;}
#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide.active figure{ border:1px solid #ef4e1b}
#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide.active figcaption{ color:#ef4e1b}
#portfolio_view.layoutDesign #bo_v_atc .galleryBox{ margin-top:60px;}
#portfolio_view.layoutDesign #bo_v_atc .galleryBox .gallery-view-box{ margin-top:0}
#portfolio_view.layoutDesign #bo_v_atc .galleryBox .gallery-view-box .swiper-slide{ height:600px;}
#portfolio_view.layoutDesign #bo_v_atc .galleryBox .gallery-thumbs-box{ margin-top:30px}
#portfolio_view.layoutDesign #bo_v_atc .cate{ margin-top:60px;}
#portfolio_view.layoutDesign .notice{ font-size:14px; color: #aaa; text-align: left;}


#view_img{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:#1f1f1f; z-index:100;}
#view_img .portfolio_pagination{ position: absolute; top: 30px; left: 50px; bottom: auto; width:auto; font-size:18px; color:#cbcbcb !important;}
#view_img .portfolio_pagination span{ font-size:18px; color:#cbcbcb !important; background-color: transparent !important;}
#view_img .xBtn{ position:absolute; top:30px; right:50px; display:block; z-index:10}
#view_img .xBtn img{ display:block; width:30px;}
#view_img .view_img_swiper{ position:absolute; top:50%; left:50%; width:100%; max-width:2000px; transform:translate(-50%,-50%);}
#view_img .view_img_swiper .swiper-container{ overflow: hidden}
#view_img .view_img_swiper .swiper-container .swiper-slide{ position:relative; height:calc(100vh - 60px); cursor:all-scroll; background-position:center; background-repeat:no-repeat; background-size:contain; transform: none}
#view_img .view_img_swiper .swiper-container .swiper-slide figure{ position:absolute; top:0; left:0; width:100%; height:100%;}
#view_img .view_img_swiper .swiper-container .swiper-slide figure img{ display: block; width:100%; height:100%; object-fit: contain; margin: 0 auto;}
#view_img .view_img_swiper .swiper-container .swiper-slide input{ display:none}
#view_img .view_img_swiper .swiper-container .swiper-slide input + label{ position:absolute; top:0; right:100px; width:80px; line-height:30px; font-size:14px; color:#fff; text-align:center; background-color:#1f1f1f; border:1px solid #fff; cursor:pointer; z-index:1}
#view_img .view_img_swiper .swiper-container .swiper-slide input:checked + label + figure{ -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH";}
#view_img .button{ position:absolute; top:50%; transform:translateY(-50%); width:24px; height:44px; background-position:center; background-repeat:no-repeat; background-size:contain; margin-top:0; z-index:10}
#view_img .swiper-button-prev:after,
#view_img .swiper-button-next:after{ display:none}
#view_img .swiper-button-prev{ left:50px; background-image:url(/img/new/prevBtn_w.png); }
#view_img .swiper-button-next{ right:50px; background-image:url(/img/new/nextBtn_w.png);}
#view_img .swiper-pagination{ bottom: 5%}
#view_img .swiper-pagination span{ background-color: #fff}
#view_img .swiper-pagination .swiper-pagination-bullet-active{ background-color: #ef4e1b}


@media (max-width:1920px){
	#brand .visual .titleBox .title{ font-size:90px;}
	#brand .visual .titleBox .subTitle{ font-size:28px; margin-top:80px;}
	.popup_new .popup_main .contents{ height:800px; overflow:auto;}
}

@media (max-width:1500px){
	#brand .visual .titleBox .title{ font-size:80px; letter-spacing:10px;}
	#brand .visual .titleBox .subTitle{ font-size:24px; margin-top:70px;}
	#brand .mypage .center figure{ left:0}
	#brand .mypage2 figure img{ width:540px}
	#brand .mypage2 figure a{ width:540px; height:85px}
	#brand .mypage2 figure a.news_link01{ top:20px;}
	#brand .mypage2 figure a.news_link02{ top:110px;}
	#brand .mypage2 figure a.news_link03{ top:200px;}
	#brand .mypage2 figure a.news_link04{ top:288px;}
	#brand .mypage2 figure a.news_link05{ top:377px;}
	#brand .mypage2 figure a.news_link06{ top:465px;}
}

@media (max-width:1250px){
	#brand .visual .titleBox .title{ font-size:70px;}
	#brand .visual .titleBox .subTitle{ font-size:20px; margin-top:50px;}
	#brand .estimate .box{ width:320px; padding:30px 0;}
	#brand .estimate .box .text{ font-size:22px;}
	#brand .estimate .box ul{ margin-top:30px}
	#brand .estimate .box ul li{ font-size:18px;}
	#brand .estimate .box ul li span{ width:75px;}
	#brand section{ padding:80px 0}
	#brand section .halfBox{ width:900px; text-align:center}
	#brand section .halfBox .half{}
	#brand section .halfBox .half .textBox .text01{ font-size:34px}
	#brand section .halfBox .half .textBox .text02{ font-size:14px; margin-top:40px;}
	#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide{ width:180px; margin:0 20px;}
	#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide figure figcaption{ font-size:14px}
	#brand .mypage .titleBox{ width:460px;}
	#brand .mypage2 figure img{ width:380px}
	#brand .mypage2 figure a{ width:380px; height:60px}
	#brand .mypage2 figure a.news_link01{ top:12px;}
	#brand .mypage2 figure a.news_link02{ top:75px;}
	#brand .mypage2 figure a.news_link03{ top:140px;}
	#brand .mypage2 figure a.news_link04{ top:202px;}
	#brand .mypage2 figure a.news_link05{ top:265px;}
	#brand .mypage2 figure a.news_link06{ top:327px;}
	#brand .service .subTitle2{ font-size:30px; margin:50px 0 0;}

	#recruit .visual .titleBox .recruit_title{ font-size:60px}
	#recruit .visual .titleBox .recruit_subTitle{ font-size:18px; margin-top:50px}
	#recruit .contents .title{ font-size:30px}
	#recruit .contents .jobList a{ width:400px; line-height:50px; font-size:18px;}

	#portfolio .title{ font-size:30px}
	#portfolio .subTitle{ font-size:24px}
	#portfolio #bo_cate .tabBox{ margin-top:50px}
	#portfolio #bo_cate .tabBox a{ font-size:20px}
	#portfolio #bo_cate li a, 
	#portfolio #bo_cate li input + label{ font-size:16px; margin-right:20px}
	#portfolio #bo_cate li{ margin-right:0; padding-right:0}
	#portfolio .img_list li{ height:320px;}
	#portfolio .img_list li div{ height:inherit}

	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide{ height:535px}
}

@media (max-width:1023px){
	#brand section .halfBox{ width:750px}
	#brand .visual .titleBox .title{ font-size:60px;}
	#brand .visual .titleBox .subTitle{ font-size:18px;}
	#brand .mypage .titleBox{ width:55%;}
	#brand .service figure img.kosca{ width:150px;}
	#brand .service .subTitle2{ font-size:24px;}
	#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide{ width:145px}

	#recruit .visual .titleBox .recruit_title{ font-size:50px; letter-spacing:20px;}
	#recruit .visual .titleBox .recruit_subTitle{ font-size:16px; margin-top:30px}
	#recruit .contents{ padding:70px 0}
	#recruit .contents .title{ font-size:24px}
	#recruit .contents .jobList{ margin-top:30px}
	#recruit .contents .jobList a{ width:350px; font-size:16px; margin-top:20px}

	#partners .center .partner_list{ margin-top:50px}

	#portfolio #bo_cate li a, 
	#portfolio #bo_cate li input + label{ font-size:14px; margin-right:10px}
	#portfolio .img_list li{ height:240px;}
	#portfolio_view #bo_v_atc .title{ font-size:30px}
	#portfolio_view #bo_v_atc .subject{ font-size:20px;}
	
	#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul li{ font-size:14px;}
	#portfolio_view #bo_v_atc .cate{ margin-top:50px}
	#portfolio_view #bo_v_atc .cate a{ font-size:14px; padding:0 15px}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .swiper-slide{ height:80px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box{ margin-top:50px; padding:0 80px}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide{ height:400px}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a,
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox input + label{ width:40px; height:40px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_01,
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_02{ width:140px; line-height: 45px; font-size:14px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_sns{ margin-right: 5px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_sns img{ width: 45px}

	.popup_new .popup_main .contents{ width:550px; height:650px; padding:30px}
	#location .title{ font-size:20px;}
	#location #map{ height:250px}
	#location .way_list li .way_title{ font-size:16px}
	#location .way_list li .text{ font-size:14px}
	#location .way_list li a{ line-height:45px; font-size:14px; margin-bottom:20px;}
	.request .popup_main .contents{ height:700px}
	.request .subTitle{ font-size:18px; margin-bottom:20px}
	.request .title span{ font-size:20px;}
	.request .formArea .form_list li{ margin-top:10px; padding-top:20px}
	.request .formArea .form_list li .form_title{ font-size:16px;}
}

@media (max-width:800px){
	.sub_page{ padding:80px 0;}
	#personal_info{ width:96%; height:98%}
	#personal_info .pop-container{ padding:20px 10px}
	#personal_info .popup_main .contents .title span{ font-size:20px;}
	#personal_info .popup_main .contents .textBox{ padding:0; height:calc(100vh - 150px);}
	#brand .visual .titleBox .title{ letter-spacing:5px;}
}

@media (max-width:768px){
	.pc{ display:none !important}
	.mobile{ display:block !important;}
	.request_btn_fixed{ display:none}

	#bottomAD_m{ display:block; position:fixed; width:100%; left:0; bottom:-100px; transition:0.3s; background-color:#1f1f1f; z-index:11}
	#bottomAD_m > a{ position:relative; display:block; float:left; width:54%; height:50px; line-height:50px; text-align:center; font-size:15px; font-weight:bold; color:#fff; background:#1f1f1f; border:none; padding:0;}
	#bottomAD_m > a.btn02{ width:23%;}
	#bottomAD_m > a:before{ content:""; position:absolute; top:50%; transform:translateY(-50%); right:0; width:1px; height:16px; background-color:#3c3c3b;}
	#bottomAD_m > a.btn01:before{ right:auto; left:0;}
	#bottomAD_m > a img{ display:inline-block; vertical-align:middle; height:18px;}
	#bottomAD_m > a span{ display:inline-block; vertical-align:middle; font-size:15px; color:#fcf896; font-weight:bold;}

	#brand{ padding-top:0}
	#brand section{ padding:50px 0}
	#brand section .title{ font-size:24px; line-height:1.4;}
	#brand section .title2{ font-size:20px; margin-bottom:50px;}
	#brand section .subTitle{ font-size:14px; line-height:1.6; letter-spacing:-0.05em}
	#brand section .halfBox{ width:100%; position:sticky; top:0;}
	#brand section .halfBox .half{ display:block; float:none; width:100%;}
	#brand section .halfBox .half .textBox .text01{ display:block; font-size:24px; text-align:center}
	#brand section .halfBox .half .textBox .text02{ display:block; font-size:14px; text-align:center; margin-top:20px; }
	#brand section .halfBox .half .chartSwiper .swiper-container .swiper-wrapper{ display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-end;}
	#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide{ width:100%; margin:0;}
	#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide figure img{ width:180px; margin:0 auto;}
	#brand section .halfBox .half .chartSwiper .swiper-container .swiper-slide figure figcaption{}
	#brand section .halfBox .half .chartSwiper .swiper-pagination{ position:relative; width:100%; margin-top:20px;}
	#brand section .halfBox .half .chartSwiper .swiper-pagination span{ display:inline-block; vertical-align:middle; width:20px; height:4px; border-radius:2px; background-color:#cbcbcb; margin:0 2px; opacity:1}
	#brand section .halfBox .half .chartSwiper .swiper-pagination .swiper-pagination-bullet-active{ background-color:#ef4e1b}
	#brand section .halfBox .half .chartSwiper .text{ font-size:16px; margin-bottom:30px; padding:0;}
	#brand .visual{ height:auto; padding:180px 0;}
	#brand .visual:before{ background-image:url(/img/new/brand_visual_m.png?1);}
	#brand .visual .titleBox{ position:relative; top:auto; left:auto; transform:none; padding:0 20px; box-sizing:border-box; text-align:left;}
	#brand .visual .titleBox .title{ font-size:60px; letter-spacing:12px; line-height:1.2;}
	#brand .visual .titleBox .title span{ display:block}
	#brand .visual .titleBox .subTitle{ font-size:14px; line-height:1.8; margin-top:30px;}
	#brand .estimate{ padding:50px 20px; box-sizing:border-box}
	#brand .estimate .box{ width:270px;}
	#brand .estimate .box .text{ font-size:18px}
	#brand .estimate .box ul li{ font-size:14px; margin-bottom:10px}
	#brand .estimate .box ul li span{ width:60px}
	#brand .mypage .center{ height:auto}
	#brand .mypage figure img{ width:90%; margin-left:30px;}
	#brand .mypage .titleBox{ width:100%; margin-top:30px; padding:0 20px; box-sizing:border-box}
	#brand .mypage .link{ margin:30px auto 50px;}
	#brand .mypage2 .center figure{ margin-top:0; padding-left:30px; padding-right:20px;}
	#brand .mypage2 figure img{ width:100%; margin:0 auto;}
	#brand .mypage2 figure a{ width:100%; height:50px}
	#brand .mypage2 figure a.news_link01{ top:12px;}
	#brand .mypage2 figure a.news_link02{ top:18%;}
	#brand .mypage2 figure a.news_link03{ top:33%;}
	#brand .mypage2 figure a.news_link04{ top:48%;}
	#brand .mypage2 figure a.news_link05{ top:63%;}
	#brand .mypage2 figure a.news_link06{ top:79%;}
	#brand .service figure{ padding:0 20px 0 30px; margin-top:0}
	#brand .service figure img.kosca{ width:120px;}
	#brand .service .subTitle2{ font-size:16px}
	#brand .review .review_number,
	#brand .review .review_number2{ display:none}

	#portfolio .title{ font-size:20px}
	#portfolio .subTitle{ font-size:16px; line-height:1.6;}
	#portfolio #bo_cate .tabBox{ font-size:0}
	#portfolio #bo_cate .tabBox a{ width:50%; font-size:16px; margin-right:0; text-align:center}
	#portfolio #bo_cate .m_scroll{ width:100%; overflow:auto;}
	
	#portfolio #bo_cate ul{ font-size:0; margin-bottom:0; padding-bottom:10px;}
	#portfolio #bo_cate li a, 
	#portfolio #bo_cate li input + label{ margin-right:15px; padding-right:20px; font-size:14px; background-size:14px}
	#portfolio #bo_cate li:last-child a,
	#portfolio #bo_cate li:last-child input + label{ margin-right:0;}
	#portfolio #bo_gall #gall_ul{ margin-top:30px}
	#portfolio .img_list{ margin-top:30px;}
	#portfolio .img_list li{ width:48%; height:42vw; margin-right:0; margin-bottom:20px;}
	#portfolio .img_list li:nth-child(odd){ margin-right:4% !important;}
	#portfolio #img_view .link{ top:15px; left: 20px; width:120px; font-size:14px; padding: 7px 0; border-radius: 5px;}
	#portfolio #img_view .view_main{ width:100%; height: 100vh; text-align:center}
	#portfolio #img_view .view_main img{ position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
	#portfolio #img_view .xBtn{ top:20px; right:20px;}
	#portfolio #img_view .xBtn img{ width:25px}
	#portfolio #bo_cate .m_scroll::-webkit-scrollbar {width: 2px; height: 2px; border: 2px solid #fff; }
	#portfolio #bo_cate .m_scroll::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {display: block; height: 0; width:0;}
	#portfolio #bo_cate .m_scroll::-webkit-scrollbar-track {background: #ddd; -webkit-border-radius: 10px; border-radius:10px; padding:0}
	#portfolio #bo_cate .m_scroll::-webkit-scrollbar-thumb { background: #ef4e1b; -webkit-border-radius: 10px; border-radius: 10px; padding:0}
	#portfolio_view #bo_v_atc .title{ font-size:24px}
	#portfolio_view #bo_v_atc .subject{ font-size:16px; margin-top:10px; line-height:1.6;}
	#portfolio_view #bo_v_atc .subject font{ font-size:12px}
	#portfolio_view #bo_v_atc .subject .btnBox{ position:static; top:auto; right:auto; transform:none; margin-top:30px; overflow:hidden;}
	#portfolio_view #bo_v_atc .subject .btnBox:after{ content:""; display:block; clear:both}
	#portfolio_view #bo_v_atc .infoArea{ margin-top:30px; padding:0}
	#portfolio_view #bo_v_atc .infoArea .cons_info{ width:100%;}
	#portfolio_view #bo_v_atc .infoArea .cons_info .info_list{ margin:0}
	#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul{ padding:0; margin:0;}
	#portfolio_view #bo_v_atc .infoArea .cons_info .info_list ul li{ display:block; width:100%;}
	#portfolio_view #bo_v_atc .m_scroll{ width:100%; overflow:auto; font-size:0; padding-bottom:10px;}
	#portfolio_view #bo_v_atc .cate{ margin-top:50px}
	#portfolio_view #bo_v_atc .cate a{ font-size:14px; padding:0 15px}
	#portfolio_view #bo_v_atc .galleryBox{ margin-top:20px; margin-bottom:50px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .swiper-slide{ height:60px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .infoArea .cons_info .info_list ul li{ width:100% !important;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_01,
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_02{ width:120px; line-height: 40px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_01{}
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_sns{ }
	#portfolio_view #bo_v_atc .galleryBox .gallery-thumbs-box .btnBox a.btn_sns img{ width:40px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box{ margin-top:40px; padding:0}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide{ height:auto}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox{ top:10px; right:10px;}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox a, 
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .btnBox input + label{ width:35px; height:35px; margin-bottom:10px}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .imgBox{ width:100%}
	#portfolio_view #bo_v_atc .galleryBox .gallery-view-box .swiper-slide .imgBox img{ width:100%;}
	
	#portfolio_view #bo_v_atc .galleryBox .button,
	#view_img .button{ display:none}
	#view_img .xBtn{ top:15px; right:20px;}
	#view_img .xBtn img{ width:22px;}
	#view_img .portfolio_pagination{ top: 18px; left: 20px; bottom: auto !important; font-size:14px; }
	#view_img .portfolio_pagination span{ font-size:14px;}
	#view_img .swiper-pagination{ bottom: 13%}
	a.btn_admin, a.btn_b02, #bo_v a.btn_b01, #bo_v a.btn_b02{ width:70px !important; font-size:12px !important; padding:8px 0 !important;}

	#recruit .visual{ height:660px;}
	#recruit .visual .titleBox{ text-align:left; padding:0 20px;}
	#recruit .visual .titleBox .recruit_title{ font-size:60px; letter-spacing:10px;}
	#recruit .visual .titleBox .recruit_title span{ display:block;}
	#recruit .visual .titleBox .recruit_subTitle{ font-size:14px;}
	#recruit .contents{ padding:70px 20px; box-sizing:border-box}
	#recruit .contents .title{ font-size:24px; letter-spacing:1px}
	#recruit .contents .jobList a{ width:100%; font-size:14px; line-height:45px;}

	.popup_new .popup_main{ top:0; left:0; width:100%; transform:none; }
	.popup_new .popup_main .contents{ width:100%; height:100vh; padding:50px 20px 30px; overflow:auto}
	.popup_new .popup_main .xBtn{ top:20px; right:20px; width:20px; height:20px; background-image:url(/img/new/xBtn.svg);}
	#location .title{ font-size:18px;}
	#location #map{ height:190px}
	#location .way_list li{ margin-top:20px}
	#location .way_list li .way_title{ font-size:14px}
	#location .way_list li a{ line-height:40px;}
	.request .popup_main .contents{ height:100vh;}
	.request .subTitle{ font-size:16px}
	.request .title span{ font-size:18px}
	.request .formArea{ margin-top:20px}
	.request .formArea .reward_notice{ font-size:14px; text-align:center}
	.request .formArea .form_list{ margin-top:50px}
	.request .formArea .form_list li.phone{ float:none !important; width:100% !important; display:block !important; margin-left:0; margin-right:0; font-size:0}
	.request .formArea .form_list li.phone .inputBox{ width:30%;}
	.request .formArea .form_list li.phone p{ width:5%; margin:0; text-align:center;}
	.request .formArea .form_list li .radioStyle + label{ font-size:12px; height:35px; line-height:35px;}
	.request .formArea .form_list li .radioStyle2 + label{ font-size:12px; height:35px; line-height:35px; margin-bottom:5px;}
	.request .formArea .form_list li .pyBox .py_type + label{ width:70px; height:35px; line-height:35px; font-size:12px;}
	.request .formArea .form_list li .pyBox .inputBox{ width:calc(100% - 180px); height:35px; margin-left:20px}
	.request .formArea .form_list li .pyBox .inputBox input{ font-size:12px;}
	.request .formArea .form_list li .pyBox p{ font-size:14px;}
	.request .formArea .form_list li .selectBox{ height:35px; background-size:10px;}
	.request .formArea .form_list li .selectBox select{ font-size:12px;}
	.request .formArea .form_list li .form_title{ font-size:14px}
	.request .formArea .form_list li .inputBox{ height:35px;}
	.request .formArea .form_list li .inputBox input{ font-size:12px;}
	.request .formArea .form_list li .budget .inputBox{ width:calc(100% - 32px); height:35px;}
	.request .formArea .form_list li .budget .inputBox input{ font-size:12px;}
	.request .formArea .form_list li .budget p{ font-size:14px;}
	.request .formArea .form_list li .textArea{ height:150px; }
	.request .formArea .form_list li .textArea textarea{ font-size:12px;}
	.request .formArea .form_list li .uploadBox label{ width:85px; height:85px; padding:20px 0;}
	.request .formArea .form_list li .uploadBox label i{ font-size:20px;}
	.request .formArea .form_list li .uploadBox label p{ font-size:11px; margin-top:5px}
	.request .formArea .form_list li .notice{ font-size:12px}
	.request .formArea .form_list li .img_list .imgBox{ width:85px; height:85px; margin-bottom:5px;}
	.request .formArea .agreeBox{ margin-top:30px;}
	.request .formArea .agreeBox input + label{ width:14px; height:14px; background-size:14px;}
	.request .formArea .agreeBox .agreeBtn,
	.request .formArea .agreeBox span{ font-size:14px;}
	.request .formArea .request_btn a{ height:50px; font-weight:bold;}
	.request .formArea .form_list li .notice br{ display:block}

	#review{ padding:100px 10px;}
	#review .subTitle{ padding-left:10px; box-sizing:border-box}
	#review .titleBox .title_text{ padding-left:10px}
	#review .titleBox .totalBox .text01{ font-size:14px; font-weight:bold;}

	#recruit_form .titleBox{ width:100%; padding:30px 20px; box-sizing:border-box}
	#recruit_form .titleBox .recruit_title{ font-size:24px;}
	#recruit_form .titleBox .recruit_subTitle{ font-size:12px; text-align:left;}
	#recruit_form .imgBox{ width:100%}
	#recruit_form .formArea{ width:100%; padding:20px 20px 50px; box-sizing:border-box}
	#recruit_form .formArea .check input + label{ background-size:14px; padding:5px 0 5px 20px; font-size:12px; letter-spacing:-0.03em;}
	#recruit_form .formArea .textArea textarea{ font-size:12px;}
	#recruit_form .formArea .form_subTitle{ font-size:12px;}

	#terms{ padding:50px 0; box-sizing:border-box}
	#terms .center .title span{ font-size:18px;}
	#terms .center .textBox{ padding:20px;}
	#terms .center .text01{ font-size:12px;}
	#terms .center .text02{ font-size:12px;}

	#portfolio #bo_cate li{}
	#bo_gall #gall_ul .gall_li{ margin-bottom:50px !important}
	#bo_gall .gall_con li.gall_href a{ height:auto !important;}
	#bo_gall .gall_con li a img{ position:static !important; transform:none !important;}
	#bo_gall .gall_text_href a{ height:auto !important}
	#portfolio_view.layoutDesign #bo_v_atc .galleryBox{ margin-top:40px;}
	#portfolio_view.layoutDesign #bo_v_atc .subject span{ font-size:12px;}
	#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide figure{ height:40px !important}
	#portfolio_view.layoutDesign #bo_v_atc .cate_main .swiper-slide figcaption{ font-size:11px;}
	#portfolio_view.layoutDesign #bo_v_atc .galleryBox .gallery-view-box .swiper-slide{ height:auto;}
	#portfolio_view.layoutDesign #bo_v_atc .cate{ width:100% !important; margin-top:40px;}
	#portfolio_view #bo_v_atc .cate a{ font-size:12px; padding:0 10px; margin-right:0}
	#portfolio_view.layoutDesign #bo_v_atc .galleryBox .gallery-thumbs-box{ margin-top:10px;}
	#view_img .view_img_swiper .swiper-container .swiper-slide.zoom-in1{ width:calc(200% + 10px) !important; max-width: 210%; height: 100vh; max-height: 100%;}
	#view_img .view_img_swiper .swiper-container .swiper-slide.zoom-in2{ width:calc(300% + 10px) !important; max-width: 320%; height: 100vh; max-height: 100%;}
	#view_img .view_img_swiper .swiper-container .swiper-slide input + label{ right:20px; top: 15px; }
	#portfolio_view.layoutDesign .notice{ font-size:12px; margin-bottom: 20px;}
	#portfolio_view.layoutDesign .linkBtn{ display:none;}
	#portfolio_view #bo_v_atc .description{ font-size: 14px; margin-top: 5px; line-height: 1}
	
	#service section.sec04-1{ padding-top:60px}
	#service section.sec04-1 .titleBox{ width:100%}
	#service section.sec04-1 .swiper-container{ width:100%}
	#service section.sec04-1 .swiper-slide img{ max-width:100%;}
	#service section.sec04-1 .videoBox{ position:static; width:calc(100% + 40px); height:auto; margin-left: -20px;}
	#service section.sec04-1 .videoBox iframe{ position:static; height:117vw;}
	#service section.section_styling{ padding-bottom: 0;}
	#service section.section_styling .swiper-slide{ background-color:#fff; padding-bottom: 60px;}
	#service section.section_styling .swiper-slide img{ width:100%;}
}

@media (max-width:600px){
	#recruit_form .imgBox{ width:100%}
	#recruit_form .formArea{ width:100%; padding:0 10px; box-sizing:border-box}
	#recruit_form .formArea .form_title{ font-size:14px; margin-top:30px}
	#recruit_form .formArea .form_title span{ font-size:16px;}
	#recruit_form .formArea .form_title p{ font-size:12px;}
	#recruit_form .formArea .radioStyle + label{ width:49%; height:40px; line-height:40px; font-size:12px;}
	#recruit_form .formArea .radioStyle + label:nth-of-type(2){ float:right}
	#recruit_form .formArea .inputBox{ height:40px;}
	#recruit_form .formArea .inputBox input{ font-size:12px;}
	#recruit_form .formArea .uploadBox label{ width:90px; font-size:12px;}
	#recruit_form .formArea .uploadBox input{ font-size:11px;}
	#recruit_form .formArea .agreeBox input + label{ background-size:16px;}
	#recruit_form .formArea .agreeBox .agreeBtn{ font-size:14px;}
	#recruit_form .formArea .agreeBox span{ font-size:14px;}
	#recruit_form .formArea .request_btn{ line-height:46px; font-size:14px; font-weight:600;}
	#partners .center .partner_list li{ width:49%; margin-right:2% !important}
	#partners .center .partner_list li:nth-child(2n){ margin-right:0 !important}
}

#keyword_hidden{ font-size:0}