@charset "utf-8";

.brandkeeper_btn1 {display:flex; justify-content:space-between; align-items:center; width:220px; height:60px; border:2px solid #00b1ec; border-radius:30px; font-size:0.875em; color:#00b1ec; font-weight:600; font-family:'Poppins', 'Pretendard'; text-align:left; padding:0 20px 0 40px; transition:all 0.5s; transition-property:background, border, color;}
.brandkeeper_btn1:after {content:'\f105'; display:inline-block; width:32px; line-height:32px; background:#00b1ec; border-radius:50%; font-size:1em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'; text-align:center; transition:all 0.5s; transition-property:background, color;}
.brandkeeper_btn1:hover {background:#00b1ec; color:#fff;}
.brandkeeper_btn1:hover:after {background:#fff; color:#00b1ec}

@media screen and (max-width:1024px){
    .brandkeeper_btn1 {width:180px; height:50px; padding:0 10px 0 15px;}
    .brandkeeper_btn1:after {width:28px; line-height:28px;}
}

@media screen and (max-width:767px){
    .brandkeeper_btn1 {width:150px; height:40px; padding:0 7px 0 13px;}
    .brandkeeper_btn1:after {width:24px; line-height:24px;}
}


/* header */
#brandkeeper_header {width:100%; height:145px; position:fixed; left:0; top:0; z-index:300; padding:0 50px; transition:all 0.5s; transition-property:background, height;}
#brandkeeper_header .h_util {float:right; display:flex; align-items:center; height:100%;}
#brandkeeper_header .h_member {overflow:hidden; margin-right:30px;}
#brandkeeper_header .h_member li {float:left; padding:0 15px; position:relative;}
#brandkeeper_header .h_member li:before {content:''; display:block; width:1px; height:13px; background:rgba(255,255,255,0.8); position:absolute; left:0; top:50%; transform:translateY(-50%);}
#brandkeeper_header .h_member li:first-child:before {display:none;}
#brandkeeper_header .h_member li a {display:block; font-size:1em; color:#fff;}

#brandkeeper_logo {float:left; width:287px; height:75px; background:url(../images/logo_w.svg) no-repeat center center; background-size:287px 75px; margin-top:35px; position:relative; z-index:10; transition:margin 0.5s;}
#brandkeeper_logo a {display:block; width:100%; height:100%;}

#brandkeeper_gnb {width:100%; position:absolute; left:0; top:0;}
#brandkeeper_gnb > ul {display:flex; justify-content:center;}
#brandkeeper_gnb > ul > li > a {display:block; font-size:1.125em; color:#fff; line-height:145px; font-weight:700; padding:0 30px; transition:line-height 0.5s;}
#brandkeeper_gnb > ul > li > a > span {position:relative;}
#brandkeeper_gnb > ul > li > a > span:after {content:''; display:block; width:0; height:3px; background:#fff; position:absolute; left:0; bottom:-15px; opacity:0; transition:all 0.4s; transition-property:width, opacity;}
#brandkeeper_gnb > ul > li:hover > a > span:after {width:100%; opacity:1;}

#all_gnb {display:flex; justify-content:center; align-items:center; width:100%; height:100vh; background:#fff; color:#191919; position:absolute; left:0; top:0; z-index:9; opacity:0; visibility:hidden; transition:all 0.5s; transition-property:opacity, visibility;}
#all_gnb .inner {display:flex;}
#all_gnb .inner > ul {width:50%;}
#all_gnb .inner > ul > li {margin-bottom:20px;}
#all_gnb .inner > ul > li:last-child {margin-bottom:0;}
#all_gnb .inner > ul > li > a {display:inline-block; font-size:4.06em; color:#fff; line-height:1.2em; font-weight:1.5em; font-weight:900; -webkit-text-stroke:1px #191919; position:relative;}
#all_gnb .inner > ul > li > a:after {content:''; display:block; width:0; height:12px; background:#191919; position:absolute; left:100%; top:50%; transform:translateY(-50%); margin-left:15px; transition:width 0.2s;}
#all_gnb .inner > ul > li:hover > a {color:#191919; -webkit-text-stroke:unset;}
#all_gnb .inner > ul > li:hover > a:after {width:30px;}
#all_gnb .inner > div {width:50%; position:relative;}
#all_gnb .inner > div .txt {font-size:1.5em; line-height:1.6em; font-weight:200; text-align:right;}
#all_gnb .inner > div .txt strong {font-weight:700;}
#all_gnb .inner > div .sns_box {position:absolute; right:0; bottom:0;}
#all_gnb .inner > div .sns_box a {float:left; display:block; font-size:1.25em; color:#191919; margin-left:20px;}

#menuToggle {width:20px; height:19px; position:relative; z-index:10;}
#menuToggle span {display:block; width:100%; height:3px; background:#fff; position:absolute; right:0; transition:all 0.5s;}
#menuToggle span:nth-child(1) {top:0;}
#menuToggle span:nth-child(2) {top:50%; margin-top:-1.5px;}
#menuToggle span:nth-child(3) {width:50%; bottom:0;}
#menuToggle:hover span:nth-child(3) {width:100%;}

#brandkeeper_header.scroll_on, #brandkeeper_header.sub_header {background:rgba(25,25,25,0.8)}

#brandkeeper_header.on #brandkeeper_logo {background-image:url(../images/logo.svg)}
#brandkeeper_header.on #all_gnb {opacity:1; visibility:visible;}
#brandkeeper_header.on #menuToggle span {background:#000;}
#brandkeeper_header.on #menuToggle span:nth-child(1) {transform:translateY(8px) rotate(45deg);}
#brandkeeper_header.on #menuToggle span:nth-child(2) {width:0;}
#brandkeeper_header.on #menuToggle span:nth-child(3) {width:100%; transform:translateY(-8px) rotate(-45deg);}

@media screen and (min-width:1025px){
    #brandkeeper_header.scroll_on, #brandkeeper_header.sub_header {height:100px;}
    #brandkeeper_header.scroll_on #brandkeeper_logo, #brandkeeper_header.sub_header #brandkeeper_logo {margin-top:12.5px;}
    #brandkeeper_header.scroll_on #brandkeeper_gnb > ul > li > a, #brandkeeper_header.sub_header #brandkeeper_gnb > ul > li > a {line-height:100px;}
}

@media screen and (max-width:1220px){
    #brandkeeper_header {padding:0 6%;}
	
	#brandkeeper_header .h_member {margin-right:10px;}
	#brandkeeper_header .h_member li {padding:0 10px;}
	#brandkeeper_header .h_member li a {font-size:0.875em;}

	#brandkeeper_logo {width:190px; height:50px; background-size:190px 50px; margin-top:43px;}

    #brandkeeper_gnb > ul > li > a {font-size:0.875em; padding:0 10px;}

	#brandkeeper_header.scroll_on #brandkeeper_logo, #brandkeeper_header.sub_header #brandkeeper_logo {margin-top:23px;}
}

@media screen and (max-width:1024px){
    #brandkeeper_header {height:60px;}
	#brandkeeper_header .h_member {margin-right:20px}
	#brandkeeper_header .h_member li {padding:0 10px;}
	#brandkeeper_header .h_member li:before {height:10px;}
	#brandkeeper_header .h_member li a {font-size:0.875em;}

    #brandkeeper_logo {width:160px; height:42px; background-size:160px 42px; margin-top:9px;}

    #brandkeeper_gnb {display:none;}
    #all_gnb .inner > ul > li > a {font-size:3em;}
    #all_gnb .inner > div .txt {font-size:1.3em;}
    #all_gnb .inner > div .sns_box a {margin-left:15px;}

    #menuToggle {height:16px;}
    #menuToggle span {height:2px;}
    #menuToggle span:nth-child(2) {margin-top:-1px;}
    #brandkeeper_header.on #menuToggle span:nth-child(1) {transform:translateY(7px) rotate(45deg);}
    #brandkeeper_header.on #menuToggle span:nth-child(3) {transform:translateY(-7px) rotate(-45deg);}
	

	#brandkeeper_header.scroll_on #brandkeeper_logo, #brandkeeper_header.sub_header #brandkeeper_logo {margin-top:7px;}
}

@media screen and (max-width:767px){
	#brandkeeper_header .h_member {margin-right:10px}
	#brandkeeper_header .h_member li {padding:0 6px;}
	#brandkeeper_header .h_member li:before {height:10px;}
	#brandkeeper_header .h_member li a span {display:none;}

    #all_gnb .inner {height:100%; align-items:center;}
    #all_gnb .inner > ul {width:100%;}
    #all_gnb .inner > ul > li > a {font-size:2.5em;}
    #all_gnb .inner > ul > li > a:after {height:7px;}
    #all_gnb .inner > ul > li:hover > a:after {width:20px;}
    #all_gnb .inner > div {width:100%; position:absolute; right:0; bottom:30px;}
    #all_gnb .inner > div .txt {display:none;}
}


/* footer */
#brandkeeper_footer {width:100%; background:#111; padding:50px 0 90px;}
#brandkeeper_footer .f_info {width:100%; overflow:hidden;}
#brandkeeper_footer .f_info li {float:left; font-size:1em; color:#a4a4a4; line-height:1.9em; margin-right:30px;}
#brandkeeper_footer .f_info li:nth-child(2n) + li {clear:both;}
#brandkeeper_footer .f_info li a {color:#a4a4a4;}
#brandkeeper_footer .f_info li strong {font-weight:700; margin-right:5px;}
#brandkeeper_footer .copy {font-size:1em; color:#dcdcdc; font-weight:700; text-transform:uppercase; margin-top:30px;}
#brandkeeper_footer .f_member {display:inline-block; font-size:0.75em; color:#a4a4a4; font-weight:500; line-height:28px; font-family:'Poppins', 'Pretendard'; border:1px solid #a4a4a4; padding:0 10px; margin-top:10px;}

@media screen and (max-width:1024px){
    #brandkeeper_footer {padding:5% 0;}
    #brandkeeper_footer .f_info li {margin-right:15px;}
    #brandkeeper_footer .f_info li:nth-child(2n) + li {clear:none;}
    #brandkeeper_footer .copy {margin-top:3%;}
}

@media screen and (max-width:767px){
	#brandkeeper_footer .f_member {line-height:20px;}
}


#Quick {position:fixed; right:28px; bottom:90px; z-index:200;}
#Quick .quick_btn {display:block; width:50px; height:50px; position:relative; margin-bottom:10px;}
#Quick .quick_btn:last-child {margin-bottom:0;}
#Quick .quick_btn i {display:block; width:50px; height:50px; background:#00b1ec; border-radius:50%; font-size:1em; color:#fff; line-height:50px; text-align:center; position:absolute; right:0; top:0; z-index:10;}
#Quick .quick_btn p {width:50px; line-height:50px; background:#00b1ec; border-radius:25px; color:rgba(0,0,0,0); text-indent:20px; position:absolute; right:0px; top:0; transition:width 0.5s; overflow:hidden;}
#Quick .quick_btn:hover p {width:140px; color:#fff;}

@media screen and (max-width:1220px){
    /*#Quick {right:6%;}*/
}

@media screen and (max-width:1024px){
    #Quick {right:33px;}
    #Quick .quick_btn {width:40px; height:40px; margin-bottom:5px;}
    #Quick .quick_btn i {width:40px; height:40px; line-height:40px;}
    #Quick .quick_btn p {width:40px; line-height:40px; text-indent:15px;}
    #Quick .quick_btn:hover p {width:120px;}
}

@media screen and (max-width:767px){
    #Quick {right:35px;}
    #Quick .quick_btn {width:35px; height:35px; margin-bottom:5px;}
    #Quick .quick_btn i {width:35px; height:35px; line-height:35px;}
    #Quick .quick_btn p {width:35px; line-height:35px; text-indent:10px;}
    #Quick .quick_btn:hover p {width:95px;}
}


/* main */
#mVisu {display:flex; justify-content:center; align-items:center; width:100%; height:100vh; position:relative}
#mVisu .txt_box {position:relative; z-index:5;}
#mVisu .txt_box .tit {font-size:7.5em; line-height:1em; font-weight:600; font-family:'Poppins';}
#mVisu .txt_box .txt {font-size:1.5em; line-height:1.66em; margin-top:20px;}
#mVisu .lottie_box {width:800px; height:800px; position:absolute; left:50%; top:50%; transform:translateY(-50%)}
#mVisu .scroll_box {width:100%; text-align:center; position:absolute; left:0; bottom:50px;}
#mVisu .scroll_box p {font-size:0.75em; margin-bottom:10px; font-family:'Poppins';}
#mVisu .scroll_box .icon {display:block; width:20px; height:32px; border:2px solid #fff; border-radius:10px; margin:0 auto; position:relative;}
#mVisu .scroll_box .icon:before {content:''; display:block; width:4px; height:4px; background:#fff; border-radius:50%; position:absolute; left:50%; top:2px; transform:translateX(-50%); animation:mVisuscroll 2s infinite;}

#mVisu .motion1 span {animation:mVisuMotion1 1.0s; animation-fill-mode:both;}
#mVisu .motion2 {overflow:hidden;}
#mVisu .motion2 span {display:block; animation:mVisuMotion2 1.2s 0.6s forwards; transform:translate3d(-100%, 0, 0); opacity:0;}
#mVisu .tit .motion2 span {animation-delay:0.3s;}

@keyframes mVisuscroll {
    0% { transform:translate(-50%, 0); opacity:0; }
    40% { opacity:1; }
    80% { transform:translate(-50%, 22px); opacity:0; }
    100% { opacity:0; }
}

@keyframes mVisuMotion1 {
	0% { filter:blur(10px); opacity:0; }
	100% { filter:blur(0); opacity:1; }
}

@keyframes mVisuMotion2 {
    from {transform:translate3d(-100%, 0, 0); opacity:0;}
    to {transform:translate3d(0, 0, 0); opacity:1;}
}

@media screen and (max-width:1220px){
    #mVisu .lottie_box {width:60vw; height:60vw;}
}

@media screen and (max-width:1024px){
    #mVisu .txt_box .tit {font-size:5em;}
    #mVisu .txt_box .txt {font-size:1.3em;}
    #mVisu .lottie_box {width:70vw; height:70vw; left:45%;}
    #mVisu .scroll_box {bottom:20px;}
}

@media screen and (max-width:767px){
    #mVisu .txt_box .tit {font-size:3em;}
    #mVisu .txt_box .txt {font-size:1em;}
	#mVisu .lottie_box {width:80vw; height:80vw;}
}

.main_title span {display:block; font-size:1.25em; color:#00b1ec; line-height:1.5em; font-weight:600; font-family:'Poppins'; text-transform:uppercase; margin-bottom:10px;}
.main_title p {font-size:3.75em; line-height:1.16em; font-weight:600; font-family:'Poppins';}

@media screen and (max-width:1024px){
    .main_title span {font-size:1.125em; margin-bottom:5px;}
    .main_title p {font-size:3em;}
}

@media screen and (max-width:767px){
    .main_title p {font-size:2.5em;}
}


#mWho {margin-top:200px;}
#mWho .tit_box {width:100%; overflow:hidden;}
#mWho .tit_box > div {float:left; width:50%;}
#mWho .tit_box .txt {font-size:1.125em; line-height:1.9em; margin:30px 0 40px;}
#mWho ul {display:flex; justify-content:space-between; flex-wrap:wrap; width:100%; margin-top:100px;}
#mWho ul li {display:flex; justify-content:center; align-items:center; width:380px; height:380px; border:2px solid #fff; border-radius:50%; font-size:1.875em; line-height:1.5em; font-weight:600; text-align:center;}

@media screen and (max-width:1220px){
    #mWho ul li {width:27.5vw; height:27.5vw;}
}

@media screen and (max-width:1024px){
    #mWho {margin-top:25%;}
    #mWho .tit_box .txt {font-size:1em; margin:20px 0 30px;}
    #mWho ul {margin-top:10%;}
    #mWho ul li {font-size:1.4em;}
}

@media screen and (max-width:767px){
    #mWho .tit_box > div {float:none; width:100%;}
    #mWho .tit_box .txt {margin:2% 0 4%;}
    #mWho ul {justify-content:center;}
    #mWho ul li {width:40vw; height:40vw; max-width:200px; max-height:200px; font-size:1.125em; margin-right:10px;}
    #mWho ul li:nth-child(even), #mWho ul li:last-child {margin-right:0;}
}


#mPartner {margin-top:250px;}
#mPartner ul {width:100%; margin-top:100px;}
#mPartner ul li {position:relative;}
#mPartner ul li:last-child {padding-bottom:0;}
#mPartner ul li:nth-child(odd) {width:calc(50% - 20px)}
#mPartner ul li:nth-child(even) {width:calc(50% - 45px); margin-left:calc(50% + 55px)}
#mPartner ul li a {display:block;}
#mPartner ul li .img_wrap {position:relative; padding-bottom:40px;}
#mPartner ul li .img_wrap .sticker {width:300px; position:absolute; right:-100px; top:50%; transform:translateY(-50%);}
#mPartner ul li .img_box {overflow:hidden;}
#mPartner ul li .img_box img {width:100%; transition:transform 0.4s}
#mPartner ul li:hover .img_box img {transform:scale(1.1)}
#mPartner ul li dl {position:absolute; left:0; top:100%;}
#mPartner ul li:last-child dl {position:relative; top:0;}
#mPartner ul li dl dt {font-size:1.5em; line-height:1.4em; font-weight:700;}
#mPartner ul li dl dd {font-size:1.125em; color:#a4a4a4; line-height:1.9em; margin-top:15px;}
#mPartner ul li:nth-child(2) {padding-left:85px; padding-right:70px; margin-top:-290px;}
#mPartner ul li:nth-child(2) dl {padding-left:85px; padding-right:70px;}

@media screen and (max-width:1220px){
    #mPartner ul li .img_wrap .sticker {width:60%; right:-7vw;}
    #mPartner ul li dl dd .mo_br {display:none;}
    #mPartner ul li:nth-child(2) {padding-left:20px; padding-right:20px; margin-top:-23vw;}
    #mPartner ul li:nth-child(2) dl {padding-left:20px; padding-right:20px;}
}

@media screen and (max-width:1024px){
    #mPartner {margin-top:25%;}
    #mPartner ul {margin-top:10%;}
    #mPartner ul li:nth-child(odd) {width:calc(50% - 5px)}
    #mPartner ul li:nth-child(even) {width:calc(50% - 20px); margin-left:calc(50% + 20px)}
    #mPartner ul li .img_wrap {padding-bottom:20px;}
    #mPartner ul li dl dt {font-size:1.3em;}
    #mPartner ul li dl dd {font-size:1em; line-height:1.6em; margin-top:10px;}
}

@media screen and (max-width:767px){
    #mPartner ul:after {content:''; display:block; width:100%; clear:both;}
    #mPartner ul li {width:100% !important; margin-bottom:15%;}
	#mPartner ul li:last-child {margin-bottom:0;}
    #mPartner ul li:nth-child(even) {margin-left:0;}
    #mPartner ul li .img_wrap {padding-bottom:15px;}
    #mPartner ul li .img_wrap .sticker {right:-10vw;}
    #mPartner ul li dl {position:relative; top:0;}
    #mPartner ul li dl dt {font-size:1.2em;}
    #mPartner ul li dl dd {margin-top:5px;}
    #mPartner ul li:nth-child(2) {padding-left:0; padding-right:0; margin-top:30px;}
    #mPartner ul li:nth-child(2) dl {padding-left:0; padding-right:0;}
}


#mTrend {padding-top:250px; position:relative;}
#mTrend:before {content:''; display:block; width:650px; height:650px; background:url(../images/mTrend_img2.svg) no-repeat center center; background-size:650px 650px; position:absolute; left:35px; top:-75px; animation:mTrend 50s linear infinite;}
#mTrend .inner {display:flex; justify-content:space-between; align-items:center; height:500px; position:relative;}
#mTrend .inner:before {content:''; display:block; width:100%; height:100%; background:url(../images/mTrend_img1.jpg) no-repeat center center; background-size:cover; position:absolute; left:50%; top:0; transform:translateX(-50%); z-index:0; transition:width 0.8s;}
#mTrend .inner .main_title, #mTrend .inner .txt {position:relative; z-index:10;}
#mTrend .inner .main_title span {color:rgba(255,255,255,0.5)}
#mTrend .inner .txt {font-size:1.125em; color:#fff; line-height:1.9em; font-weight:600;}
#mTrend.active .inner:before {width:100vw;}

@keyframes mTrend {
    0% {transform:rotate(0)}
    100% {transform:rotate(360deg)}
}

@media screen and (max-width:1220px){
    #mTrend:before {left:-5%;}
}

@media screen and (max-width:1024px){
    #mTrend {padding-top:25%;}
    #mTrend:before {width:60vw; height:60vw; background-size:60vw 60vw; left:-10vw; top:-60px;}
    #mTrend .inner {height:40vw;}
    #mTrend .inner .txt {font-size:1em;}
}

@media screen and (max-width:767px){
    #mTrend .inner {display:block; height:auto; text-align:center; padding:25% 0;}
    #mTrend .inner .txt {line-height:1.6em; margin-top:15px;}
}


#mContent {margin:250px auto 100px;}
#mContent:after {content:''; display:block; width:100%; clear:both;}
#mContent .form_box {display:flex; justify-content:space-between; flex-wrap:wrap; width:100%; margin-top:100px; overflow:hidden;}
#mContent .form_box li {width:calc(50% - 25px); margin-bottom:50px;}
#mContent .form_box li.w_100 {width:100%;}
#mContent .form_box li label {display:block; font-size:1.125em; line-height:1.5em; font-weight:700;}
#mContent .form_box li .form_txt {display:block; width:100%; height:50px; background:none; border:0; border-bottom:1px solid #a4a4a4; border-radius:0; font-size:1.125em; color:#fff; font-family:'Pretendard'; text-align:right; padding:0 20px;}
#mContent .form_box li .form_textarea {display:block; width:100%; height:150px; background:none; border:0; border-bottom:1px solid #a4a4a4; border-radius:0; font-size:1.125em; color:#fff; font-family:'Pretendard'; padding:5px 20px; resize:none;}
#mContent .form_box li .form_txt:focus, #mContent .form_box li .form_textarea:focus {outline:none; box-shadow:none !important; border:0 !important; border-bottom:3px solid #00b1ec !important;}
#mContent .form_box li .select_box {width:100%; position:relative;}
#mContent .form_box li .select_box:after {content:'\f107'; font-size:0.875em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'; position:absolute; right:20px; top:50%; transform:translateY(-50%)}
#mContent .form_box li .select_box select {display:block; width:100%; height:50px; background:none; border:0; border-bottom:1px solid #a4a4a4; border-radius:0; font-size:1.125em; color:#fff; font-family:'Pretendard'; text-align:right; padding:0 60px 0 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none; position:relative; z-index:5;}
#mContent .form_box li .select_box.non_select select {color:#666;}
#mContent .form_box li .select_box select option {color:#191919; text-align:left;}
#mContent .form_box li .select_box select:focus {outline:none; box-shadow:none !important; border:0 !important; border-bottom:3px solid #00b1ec !important;}
#mContent .privacy_box {width:100%; background:rgba(255,255,255,0.1); padding:35px 40px;; margin-bottom:30px;}
#mContent .privacy_box p {height:80px; font-size:1em; color:#a4a4a4; line-height:1.8em; overflow-y:scroll; padding-right:70px;}
#mContent .privacy_box p::-webkit-scrollbar {width:5px;}
#mContent .privacy_box p::-webkit-scrollbar-thumb {background:#666; border-radius:2.5px;}
#mContent .privacy_box p::-webkit-scrollbar-track {background:rgba(255,255,255,0);}
#mContent .check_box {display:block;}
#mContent .check_box input {display:none;}
#mContent .check_box p {font-size:1em; color:#a4a4a4; line-height:30px; font-weight:600; padding-left:40px; position:relative;}
#mContent .check_box p:before {content:''; display:block; width:30px; height:30px; border:1px solid #666; border-radius:50%; font-size:0.875em; color:#fff; line-height:28px; font-weight:400; font-family:'Font Awesome 6 Pro'; text-align:center; position:absolute; left:0; top:0;}
#mContent .check_box input:checked + p:before {content:'\f00c'; background:#00b1ec; border-color:#00b1ec;}
#mContent .brandkeeper_btn1 {float:right;}

@media screen and (max-width:1024px){
    #mContent {margin:25% auto 15%;}
    #mContent .form_box {margin-top:10%;}
    #mContent .form_box li {width:calc(50% - 10px); margin-bottom:20px;}
    #mContent .form_box li label {font-size:1em;}
    #mContent .form_box li .form_txt {height:40px; padding:0 15px;}
    #mContent .form_box li .form_textarea {height:100px; padding:5px 15px;}
    #mContent .form_box li .select_box:after {right:15px;}
    #mContent .form_box li .select_box select {height:40px; padding:0 50px 0 15px;}
    #mContent .privacy_box {padding:25px; margin-bottom:15px;}
    #mContent .privacy_box p {height:60px;}
	#mContent .check_box {margin-bottom:30px;}
}

@media screen and (max-width:767px){
    #mContent .form_box li {width:100%;}
    #mContent .form_box li .form_txt {height:38px;}
    #mContent .form_box li .form_textarea {height:80px;}
    #mContent .form_box li .select_box select {height:38px;}
    #mContent .privacy_box {padding:15px;}
    #mContent .check_box p {line-height:22px; padding-left:30px;}
    #mContent .check_box p:before {width:22px; height:22px; line-height:20px;}
}


/* sub */
#sVisu {display:flex; justify-content:center; align-items:center; width:100%; height:100vh; background:#000; overflow:hidden; position:relative;}
#sVisu .img_box {width:100%; height:100%; position:absolute; left:0; top:0; z-index:0; clip-path:polygon(40% 100%, 60% 100%, 60% 100%, 40% 100%); animation:sVisuImg1 2.4s 1.2s ease forwards;}
#sVisu .img_box:before {content:''; display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transform:scale(0.8); animation:sVisuImg2 1.5s 2.4s ease forwards;}
#sVisu .img_box:after {content:''; display:block; width:100%; height:100%; background:rgba(25,25,25,0.5); position:absolute; left:0; top:0; z-index:1;}
#sVisu .txt_box ul {overflow:hidden;}
#sVisu .txt_box ul li {float:left; font-size:1em; color:#fff; font-weight:700; transform:translateY(100%); animation:sVisuTxt 1s 3.6s ease forwards;}
#sVisu .txt_box ul li:after {content:'\f105'; display:inline-block; font-size:1em; color:rgba(255,255,255,0.5); font-weight:400; font-family:'Font Awesome 6 Pro'; margin:0 15px;}
#sVisu .txt_box ul li:last-child:after {display:none;}
#sVisu .txt_box ul li .home {display:inline-block; font-size:0.875em; color:#fff; opacity:0.5; transition:opacity 0.5s;}
#sVisu .txt_box ul li .home:before {content:'\f015'; font-size:1em; font-weight:900; font-family:'Font Awesome 6 Pro'}
#sVisu .txt_box ul li .home:hover {opacity:1;}
#sVisu .txt_box .tit {font-size:6.25em; color:#fff; line-height:1.3em; font-weight:600; font-family:'Poppins'; margin-top:5px;}
#sVisu .txt_box .tit p {overflow:hidden;}
#sVisu .txt_box .tit p span {display:block; transform:translateY(100%); animation:sVisuTxt 1s 3.6s ease forwards;}
#sVisu .txt_box .tit p:nth-child(2) span {animation-delay:4s;}

.sVisu1 .img_box:before {background-image:url(../images/sVisu_img1.jpg)}
.sVisu2 .img_box:before {background-image:url(../images/sVisu_img2.jpg)}
.sVisu3 .img_box:before {background-image:url(../images/sVisu_img3.jpg)}
.sVisu4 .img_box:before {background-image:url(../images/sVisu_img4.jpg)}
.sVisu5 .img_box:before {background-image:url(../images/sVisu_img5.jpg)}
.sVisu6 .img_box:before {background-image:url(../images/sVisu_img6.jpg)}

@keyframes sVisuImg1 {
    0% {clip-path:polygon(40% 100%, 60% 100%, 60% 100%, 40% 100%)}
    50% {clip-path:polygon(40% 35%, 60% 35%, 60% 65%, 40% 65%)}
    100% {clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)}
}

@keyframes sVisuImg2 {
    0% {transform:scale(0.8)}
    100% {transform:scale(1)}
}

@keyframes sVisuTxt {
    0% {transform:translateY(100%)}
    100% {transform:translateY(0)}
}

@media screen and (max-width:1024px){
    #sVisu .img_box {clip-path:polygon(20% 100%, 80% 100%, 80% 100%, 20% 100%);}
    #sVisu .txt_box .tit {font-size:5em; margin-top:10px;}

    @keyframes sVisuImg1 {
        0% {clip-path:polygon(20% 100%, 80% 100%, 80% 100%, 20% 100%)}
        50% {clip-path:polygon(20% 35%, 80% 35%, 80% 65%, 20% 65%)}
        100% {clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)}
    }
}

@media screen and (max-width:767px){
    #sVisu .txt_box ul li:after {margin:0 10px;}
    #sVisu .txt_box .tit {font-size:3.3em;}
}



#sub_content {margin:150px 0}
#sub_content.case2 {min-height:100vh; margin-top:200px;}
#sub_content h3 {font-size:1.5em; line-height:1.5em; font-weight:700; margin-bottom:40px;}

.sub_section {padding:100px 0;}
.sub_section.bg1 {background:#f8f9fc;}

.s_tit1 {font-size:2.5em; line-height:1.25em; font-weight:700;}
.s_tit2 {font-size:1.875em; line-height:1.6em; font-weight:700; font-family:'Poppins', 'Pretendard'}
.s_tit3 {font-size:1.5em; line-height:1.45em; font-weight:700;}

.s_txt1 {font-size:1.125em; color:#666; line-height:1.6em;}

@media screen and (max-width:1024px){
    #sub_content {margin:15% 0;}
	#sub_content.case2 {margin-top:20%;}
    #sub_content h3 {font-size:1.3em; margin-bottom:20px;}

    .sub_section {padding:10% 0;}

    .s_tit1 {font-size:2em;}
    .s_tit2 {font-size:1.5em;}
    .s_tit3 {font-size:1.3em;}

    .s_txt1 {font-size:1em;}
}

@media screen and (max-width:767px){
    .s_tit1 {font-size:1.7em;}
    .s_tit2 {font-size:1.4em;}
}



.sub_coming_box {text-align:center;}
.sub_coming_box:before {content:'\e417'; font-size:4.375em; color:#00b1ec; line-height:1.1em; font-weight:900; font-family:'Font Awesome 6 Pro';}
.sub_coming_box dl {margin-top:20px;}
.sub_coming_box dl dt {font-size:2.5em; line-height:1.5em; font-weight:700;}
.sub_coming_box dl dd {font-size:1.125em; color:#666; line-height:1.6em; margin-top:15px;}

@media screen and (max-width:1024px){
    .sub_coming_box:before {font-size:3.5em;}
    .sub_coming_box dl {margin-top:2%;}
    .sub_coming_box dl dt {font-size:2em;}
    .sub_coming_box dl dd {font-size:1em; margin-top:1%;}
}

@media screen and (max-width:767px){
    .sub_coming_box:before {font-size:3em;}
    .sub_coming_box dl dt {font-size:1.7em;}
}


.sub_board_box {width:100%; overflow:hidden;}
.sub_board_box > div {float:left; width:calc(20% - 40px); margin-right:50px; text-align:center;}
.sub_board_box > div:nth-child(5n) {margin-right:0;}
.sub_board_box > div:nth-child(5) ~ div {margin-top:50px;}
.sub_board_box > div a {display:block; width:100%; height:100%;}
.sub_board_box > div .img_box {width:100%; height:200px; overflow:hidden; position:relative;}
.sub_board_box > div .img_box div {width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transition:transform 1.5s;}
.sub_board_box > div .img_box:hover div {transform:scale(1.1);}
.sub_board_box > div p {font-size:1em; line-height:1.5em; font-weight:600; font-family:'Poppins', 'Pretendard'; margin-top:20px;}
.sub_board_box > div .view {display:flex; justify-content:center; align-items:center; flex-direction:column; width:100%; height:100%; background:rgba(0,177,236,0.9); font-size:0.875em; color:#fff; font-weight:500; font-family:'Poppins'; text-transform:uppercase; position:absolute; left:0; top:0; opacity:0; visibility:hidden; transition:all 0.5s; transition-property:opacity, visibiliy;}
.sub_board_box > div .view:before {content:'\f002'; display:block; font-size:1.71em; font-weight:300; font-family:'Font Awesome 6 Pro'; margin-bottom:10px;}
.sub_board_box > div.active .view {opacity:1; visibility:visible;}

.sub_portfolio_box {width:100%; overflow:hidden;}
.sub_portfolio_box > div {float:left; width:calc(50% - 25px); margin-right:50px; }
.sub_portfolio_box > div:nth-child(even) {margin:50px 0 70px;}
.sub_portfolio_box > div:nth-child(even) + div {clear:both;}
.sub_portfolio_box > div:nth-child(4) ~ div {margin-bottom:0;}
.sub_portfolio_box > div .img_box {width:100%; height:360px; border:1px solid #dcdcdc; overflow:hidden;}
.sub_portfolio_box.case2 > div .img_box {height:320px;}
.sub_portfolio_box > div .img_box div {width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transition:transform 1.5s;}
.sub_portfolio_box > div .img_box:hover div {transform:scale(1.1)}
.sub_portfolio_box > div .subject {font-size:1.25em; font-weight:700; margin:30px 0 20px; white-space:nowrap; text-overflow:hidden; overflow:hidden;}
.sub_portfolio_box > div .s_txt1 {white-space:nowrap; text-overflow:hidden; overflow:hidden;}

.board_cursor {display:flex; justify-content:center; align-items:center; width:0; height:0; background:rgba(0,177,236,0.8); border-radius:50%; position:fixed; left:0; top:0; transform:translate(-50%, -50%); z-index:250; overflow:hidden; opacity:0; transition:all 0.4s; transition-property:width, height, opacity; pointer-events:none;}
.board_cursor p {width:100%; font-size:1em; color:#fff; font-weight:600; text-align:center; white-space:nowrap;}
.board_cursor p:after {content:'\f105'; font-size:1em; font-weight:400; font-family:'Font Awesome 6 Pro'; margin-left:10px;}
.board_cursor.on {width:170px; height:170px; opacity:1;}

.paging_box {display:flex; justify-content:center; align-items:center; width:100%; margin-top:70px;}
.paging_box button {display:block; font-size:1.875em;}
.paging_box button:before {font-size:1em; font-weight:300; font-family:'Font Awesome 6 Pro'}
.paging_box button.prev_btn:before {content:'\f053'}
.paging_box button.next_btn:before {content:'\f054'}
.paging_box ul {display:flex; justify-content:center; align-items:center; margin:0 20px;}
.paging_box ul li a {display:block; font-size:1.125em; color:#a4a4a4; line-height:1.6em; padding:0 9px; transition:color 0.4s;}
.paging_box ul li a:hover {color:#191919;}
.paging_box ul li.active a {color:#191919; font-weight:700;}

@media screen and (max-width:1220px){
    .sub_board_box > div .img_box {height:14vw;}

    .sub_portfolio_box > div .img_box {height:27vw;}
	.sub_portfolio_box.case2 > div .img_box {height:23vw;}
}

@media screen and (max-width:1024px){
    .sub_board_box > div {width:calc(20% - 8px); margin-right:10px;}
    .sub_board_box > div:nth-child(5) ~ div {margin-top:5%;}
    .sub_board_box > div .img_box {height:17vw;}
    .sub_board_box > div p {margin-top:10px;}

    .sub_portfolio_box > div {width:calc(50% - 5px); margin-right:10px;}
    .sub_portfolio_box > div:nth-child(even) {margin:25px 0 30px;}
	.sub_portfolio_box.case2 > div .img_box {height:24vw;}
    .sub_portfolio_box > div .subject {font-size:1.125em; margin:10px 0 5px;}

    .board_cursor.on {width:140px; height:140px;}

    .paging_box {margin-top:5%;}
    .paging_box button {font-size:1.5em;}
    .paging_box ul {margin:0 10px;}
    .paging_box ul li a {font-size:1em;}
}

@media screen and (max-width:767px){
    .sub_board_box > div {width:calc(50% - 5px);}
    .sub_board_box > div:nth-child(5n) {margin-right:10px;}
    .sub_board_box > div:nth-child(even) {margin-right:0;}
    .sub_board_box > div:nth-child(2) ~ div {margin-top:5%;}
    .sub_board_box > div .img_box {height:42vw;}

	.sub_portfolio_box > div {width:100%; margin-right:0; margin-bottom:30px;}
	.sub_portfolio_box > div:last-child {margin-bottom:0;}
    .sub_portfolio_box > div:nth-child(even) {margin-top:0;}
	.sub_portfolio_box > div .img_box {height:53vw;}
	.sub_portfolio_box.case2 > div .img_box {height:48vw;}
}


.sub_process_box1 {width:100%; overflow:hidden;}
.sub_process_box1 > li {float:left; width:calc(25% - 22.5px); margin-right:30px;}
.sub_process_box1 > li:nth-child(4n) {margin-right:0;}
.sub_process_box1 > li:nth-child(4) ~ li {margin-top:40px;}
.sub_process_box1 > li .img_box {width:100%; height:170px; background-repeat:no-repeat; background-position:center center; background-size:cover;}
.sub_process_box1 > li p {font-size:1.125em; color:#666; margin-top:20px;}

@media screen and (max-width:1220px){
    .sub_process_box1 > li .img_box {height:13vw;}
}

@media screen and (max-width:1024px){
    .sub_process_box1 > li {width:calc(25% - 7.5px); margin-right:10px;}
    .sub_process_box1 > li p {font-size:1em; margin-top:10px;}
}

@media screen and (max-width:767px){
    .sub_process_box1 > li {width:calc(50% - 5px)}
    .sub_process_box1 > li:nth-child(even) {margin-right:0;}
    .sub_process_box1 > li:nth-child(2) ~ li {margin-top:30px;}
    .sub_process_box1 > li .img_box {height:25vw;}
}



.sub_process_slide_wrap {position:relative;}
.sub_process_slide {width:100%;}
.sub_process_slide .swiper-slide {display:flex; justify-content:center; align-items:center; flex-direction:column; width:180px; height:180px; background:#fff; border:2px solid #dcdcdc; border-radius:50%; text-align:center;}
.sub_process_slide .swiper-slide i {display:block; font-size:2.5em; line-height:1.3em; margin-bottom:10px;}
.sub_process_slide .swiper-slide p {font-size:1.125em; line-height:1.6em; font-weight:500;}
.sub_process_slide .swiper-button-next, .sub_process_slide .swiper-button-prev {width:auto; height:auto; font-size:1.875em; line-height:1.2em; top:0; margin-top:0;}
.sub_process_slide .swiper-button-next {right:0;}
.sub_process_slide .swiper-button-prev {left:auto; right:50px;}
.sub_process_slide .swiper-button-next:after, .sub_process_slide .swiper-button-prev:after {font-size:1em; color:#191919; font-weight:300; font-family:'Font Awesome 6 Pro'}
.sub_process_slide .swiper-button-next:after {content:'\f054'}
.sub_process_slide .swiper-button-prev:after {content:'\f053'}

@media screen and (max-width:1024px){
    .sub_process_slide .swiper-slide {width:160px; height:160px;}
    .sub_process_slide .swiper-slide i {font-size:2em; margin-bottom:5px;}
    .sub_process_slide .swiper-slide p {font-size:1em;}
    .sub_process_slide .swiper-button-next, .sub_process_slide .swiper-button-prev {font-size:1.5em;}
    .sub_process_slide .swiper-button-prev {right:30px;}
}

@media screen and (max-width:767px){
    .sub_process_slide .swiper-slide {width:120px; height:120px;}
    .sub_process_slide .swiper-slide i {font-size:1.8em; margin-bottom:0;}
}


.sub_list_box1 {width:100%; overflow:hidden;}
.sub_list_box1 > li {float:left; width:205px; font-size:1.125em; color:#666; line-height:1.9em; position:relative; padding-left:20px;}
.sub_list_box1 > li:nth-child(4n) + li {clear:both;}
.sub_list_box1 > li:before {content:''; display:block; width:4px; height:4px; background:#191919; border-radius:50%; position:absolute; left:0; top:15px;}

@media screen and (max-width:1024px){
    .sub_list_box1 > li {width:25%; font-size:1em; padding-left:15px;}
    .sub_list_box1 > li:before {top:11px;}
}

@media screen and (max-width:767px){
    .sub_list_box1 > li {width:50%; padding-left:10px;}
    .sub_list_box1 > li:nth-child(even) + li {clear:both;}
    .sub_list_box1 > li:before {width:3px; height:3px; top:10px;}
}


.sub_img_box1 {display:flex; align-items:center; flex-wrap:wrap; width:100%;}
.sub_img_box1 .img_box {width:50%; height:438px; background-repeat:no-repeat; background-position:center center; background-size:cover;}
.sub_img_box1 .txt_box {width:50%; padding-left:100px;}
.sub_img_box1 .txt_box .sub_list_box1 > li {float:none; width:100%;}

@media screen and (max-width:1220px){
    .sub_img_box1 .img_box {height:28vw;}
    .sub_img_box1 .txt_box {padding-left:50px;}
}

@media screen and (max-width:1024px){
    .sub_img_box1 .txt_box {padding-left:25px;}
}

@media screen and (max-width:767px){
    .sub_img_box1 .img_box {width:100%; height:50vw;}
    .sub_img_box1 .txt_box {width:100%; padding-left:0; margin-top:5%;}
}



.sCompany_case1 .en {font-size:6.25em; color:#f2f4f9; line-height:1.2em; font-weight:600; font-family:'Poppins'; white-space:nowrap; transition:transform 0.1s;}
.sCompany_case1 > div {width:100%; margin-top:100px; position:relative;}
.sCompany_case1 > div.box1 {height:550px;}
.sCompany_case1 > div.box2 {height:400px;}
.sCompany_case1 > div .img_box {height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; position:absolute; top:0;}
.sCompany_case1 > div.box1 .img_box {width:50vw; right:50%;}
.sCompany_case1 > div.box2 .img_box {width:50%; left:50%;}
.sCompany_case1 > div .txt_box {display:flex; justify-content:center; flex-direction:column; width:50%; height:100%;}
.sCompany_case1 > div .txt_box span {display:block; font-size:1.5em; color:#00b1ec; line-height:1.4em; font-family:'Poppins'; margin-bottom:30px;}
.sCompany_case1 > div .txt_box dl dt {font-size:1.875em; line-height:1.4em; font-weight:700;}
.sCompany_case1 > div .txt_box dl dd {font-size:1.125em; color:#666; line-height:1.6em; margin-top:20px;}
.sCompany_case1 > div.box1 .txt_box {margin-left:50%; padding-left:100px;}
.sCompany_case1 > div.box2 .txt_box {padding-right:100px;}

.sCompany_case2 {width:100%; background:url(../images/sCompany_img2.jpg) no-repeat center center; background-size:cover; background-attachment:fixed; padding:100px 0 160px; position:relative}
.sCompany_case2:before {content:''; display:block; width:100%; height:100%; background:rgba(25,25,25,0.5); position:absolute; left:0; top:0; z-index:0;}
.sCompany_case2 > div {position:relative; z-index:10;}
.sCompany_case2 ul {display:flex; justify-content:center; flex-wrap:wrap; width:100%;}
.sCompany_case2 ul li {display:flex; justify-content:center; align-items:center; width:300px; height:300px; border:2px solid #fff; border-radius:50%; font-size:1.5em; color:#fff; line-height:1.45em; font-weight:700; text-align:center; margin-right:30px;}
.sCompany_case2 ul li:last-child {margin-right:0;}

.sCompany_case3 .info .add {font-size:1.875em; line-height:1.6em; font-weight:700;}
.sCompany_case3 .info dl {width:100%; margin-top:30px; overflow:hidden;}
.sCompany_case3 .info dl dt {float:left; width:50px; font-size:1.125em; line-height:1.6em; font-weight:600; clear:both;}
.sCompany_case3 .info dl dd {float:left; width:calc(100% - 50px); font-size:1.125em; color:#666; line-height:1.6em;}
.sCompany_case3 .info dl dd a {color:#666;}
.sCompany_case3 .map_box {width:100%; height:450px; background:#f8f9fc; margin-top:70px;}
.sCompany_case3 .map_box .root_daum_roughmap .wrap_map {height:100% !important;}

@media screen and (max-width:1220px){
    .sCompany_case1 > div.box1 {height:35vw;}
    .sCompany_case1 > div.box2 {height:30vw;}
    .sCompany_case1 > div.box1 .txt_box {padding-left:50px;}
    .sCompany_case1 > div.box2 .txt_box {padding-right:50px;}

    .sCompany_case2 ul li {width:27vw; height:27vw;}
}

@media screen and (max-width:1024px){
    .sCompany_case1 .en {font-size:5em;}
    .sCompany_case1 > div {margin-top:10%;}
    .sCompany_case1 > div .txt_box span {font-size:1.3em; margin-bottom:15px;}
    .sCompany_case1 > div .txt_box dl dt {font-size:1.5em;}
    .sCompany_case1 > div .txt_box dl dd {font-size:1em; margin-top:10px;}
    .sCompany_case1 > div.box1 .txt_box {padding-left:30px;}
    .sCompany_case1 > div.box2 .txt_box {padding-right:30px;}

    .sCompany_case2 {background-attachment:unset; padding:13% 0;}
    .sCompany_case2 ul li {width:24vw; height:24vw; font-size:1.3em; margin-right:15px;}

    .sCompany_case3 .info .add {font-size:1.5em;}
    .sCompany_case3 .info dl {margin-top:2%;}
    .sCompany_case3 .info dl dt {width:40px; font-size:1em;}
    .sCompany_case3 .info dl dd {width:calc(100% - 40px); font-size:1em;}
    .sCompany_case3 .map_box {height:350px; margin-top:7%;}
}

@media screen and (max-width:767px){
    .sCompany_case1 .en {font-size:3.5em;}
    .sCompany_case1 > div.box1 {height:auto;}
    .sCompany_case1 > div.box2 {height:auto;}
    .sCompany_case1 > div .img_box {position:relative;}
    .sCompany_case1 > div.box1 .img_box {width:100%; height:55vw; right:0;}
    .sCompany_case1 > div.box2 .img_box {width:100%; height:50vw; left:0;}
    .sCompany_case1 > div .txt_box {width:100%; margin-top:3%;}
    .sCompany_case1 > div .txt_box span {margin-bottom:10px;}
    .sCompany_case1 > div .txt_box dl dd {margin-top:5px;}
    .sCompany_case1 > div.box1 .txt_box {margin-left:0; padding-left:0;}
    .sCompany_case1 > div.box2 .txt_box {padding-right:0;}

    .sCompany_case2 ul li {width:35vw; height:35vw; font-size:1.2em; margin-right:10px;}
    .sCompany_case2 ul li:nth-child(2) {margin-right:0;}

    .sCompany_case3 .info .add {font-size:1.3em;}
    .sCompany_case3 .map_box {height:200px;}
}



.sHologram_case1 .box {overflow:hidden; position:relative;}
.sHologram_case1 .box .tab_box {float:left; width:200px;}
.sHologram_case1 .box .tab_box li {margin-bottom:10px;}
.sHologram_case1 .box .tab_box li:last-child {margin-bottom:0;}
.sHologram_case1 .box .tab_box li a {display:flex; justify-content:center; align-items:center; width:100%; height:60px; background:#f8f9fc; border-radius:30px; font-size:1em; color:#666; line-height:1.6em; text-align:center; transition:background 0.5s;}
.sHologram_case1 .box .tab_box li:hover a {color:#00b1ec;}
.sHologram_case1 .box .tab_box li.active a {background:#00b1ec; font-size:1.125em; color:#fff; font-weight:700;}
.sHologram_case1 .box .content_box {float:right; width:800px;}
.sHologram_case1 .box .content_box > div {padding-top:70px;}
.sHologram_case1 .box .content_box > div:first-child {padding-top:0;}
.sHologram_case1 .box .content_box > div dl dt {font-size:1.25em; line-height:1.5em ;font-weight:600;}
.sHologram_case1 .box .content_box > div dl dd {font-size:1.125em; color:#666; line-height:1.6em; margin-top:20px;}
.sHologram_case1 .box .content_box > div ul {width:100%; overflow:hidden; margin-top:40px;}
.sHologram_case1 .box .content_box > div ul li {float:left; width:calc(33.33% - 6.66px); margin-right:10px;}
.sHologram_case1 .box .content_box > div ul li:nth-child(3n) {margin-right:0;}
.sHologram_case1 .box .content_box > div ul li:nth-child(3) ~ li {margin-top:30px;}
.sHologram_case1 .box .content_box > div ul li img {width:100%; border:1px solid #dcdcdc;}
.sHologram_case1 .box .content_box > div ul li p {font-size:1em; font-weight:500; text-align:center; margin-top:20px;}

.sHologram_case1 .box .tab_box.scroll_on {position:fixed; left:50%; top:120px; margin-left:-600px;}
.sHologram_case1 .box .tab_box.scroll_end {position:absolute; left:0; top:auto; bottom:0; margin-left:0;}

@media screen and (max-width:1220px){
    .sHologram_case1 .box .content_box {width:calc(100% - 250px)}
}

@media screen and (max-width:1024px){
    .sHologram_case1 .box .tab_box {width:160px;}
    .sHologram_case1 .box .tab_box li a {height:50px;}
    .sHologram_case1 .box .tab_box li.active a {font-size:1em;}
    .sHologram_case1 .box .content_box {width:calc(100% - 190px)}
    .sHologram_case1 .box .content_box > div dl dt {font-size:1.125em;}
    .sHologram_case1 .box .content_box > div dl dd {font-size:1em; margin-top:2%;}
    .sHologram_case1 .box .content_box > div ul {margin-top:4%;}
    .sHologram_case1 .box .content_box > div ul li {width:calc(33.33% - 3.33px); margin-right:5px;}
    .sHologram_case1 .box .content_box > div ul li:nth-child(3) ~ li {margin-top:20px;}
    .sHologram_case1 .box .content_box > div ul li p {margin-top:5px;}

    .sHologram_case1 .box .tab_box.scroll_on {position:fixed; left:6%; top:120px; margin-left:0;}
    .sHologram_case1 .box .tab_box.scroll_end {position:absolute; left:0; top:auto; bottom:0; margin-left:0;}
}

@media screen and (max-width:767px){
    .sHologram_case1 .box .tab_box {float:none; width:100%;}
    .sHologram_case1 .box .tab_box ul {display:flex; justify-content:space-between; flex-wrap:wrap; width:100%;}
    .sHologram_case1 .box .tab_box li {width:calc(33.33% - 3.33px); margin-bottom:5px;}
    .sHologram_case1 .box .tab_box li:nth-child(3) ~ li {width:calc(50% - 2.5px)}
    .sHologram_case1 .box .tab_box li a {height:40px;}
    .sHologram_case1 .box .content_box {float:none; width:100%;}
    .sHologram_case1 .box .content_box > div {padding-top:7%;}
    .sHologram_case1 .box .content_box > div:first-child {padding-top:7%;}

    .sHologram_case1 .box .tab_box.scroll_on {position:relative; left:0; top:0; margin-left:0;}
    .sHologram_case1 .box .tab_box.scroll_end {position:relative; left:0; top:auto; bottom:0; margin-left:0;}
}

.sCertified_case1 {display:flex; flex-wrap:wrap; width:100%;}
.sCertified_case1 > div {width:50%; position:relative;}
.sCertified_case1 > div:first-child {border-right:1px solid #dcdcdc; padding-right:100px;}
.sCertified_case1 > div:first-child:after {content:'\2b'; display:block; width:60px; line-height:60px; background:#00b1ec; border-radius:50%; font-size:1.25em; color:#fff; font-weight:300; font-family:'Font Awesome 6 Pro'; text-align:center; position:absolute; right:0; top:50%; transform:translate(50%, -50%)}
.sCertified_case1 > div:last-child {padding-left:100px;}
.sCertified_case1 > div .icon {display:block; width:120px; height:120px; background-repeat:no-repeat; background-position:center center; background-size:contain; margin-bottom:40px;}

.sCertified_case1 > div .icon1 {background-image:url(../images/sCertified_icon1.png)}
.sCertified_case1 > div .icon2 {background-image:url(../images/sCertified_icon2.png)}
.sCertified_case1 > div dl dt {font-size:1.25em; color:#00b1ec; font-weight:700;}
.sCertified_case1 > div dl dd {margin-top:15px;}

.sCertified_case2 {display:flex; justify-content:center; align-items:center; width:100%; height:500px; background:url(../images/sCertified_img1.jpg) no-repeat center center; background-size:cover; background-attachment:fixed; position:relative;}
.sCertified_case2:before {content:''; display:block; width:100%; height:100%; background:rgba(25,25,25,0.3); position:absolute; left:0; top:0; z-index:0;}
.sCertified_case2 > div {position:relative; z-index:5; text-align:center;}

.sCertified_case3 {display:flex; flex-wrap:wrap; width:100%;}
.sCertified_case3 > div {width:calc(25% - 22.5px); background:#f8f9fc; padding:40px 35px; margin-right:30px; overflow:hidden; transition:all 0.5s; transition-property:background, transform, color;}
.sCertified_case3 > div:last-child {margin-right:0;}
.sCertified_case3 > div i {float:right; font-size:3.125em; line-height:1.2em; margin-bottom:40px;}
.sCertified_case3 > div dl {clear:both;}
.sCertified_case3 > div dl dt {font-size:1.25em; line-height:1.3em; font-weight:600;}
.sCertified_case3 > div dl dd {font-size:1.125em; color:#666; line-height:1.6em; margin-top:10px; word-break:normal; transition:color 0.5s;}
.sCertified_case3 > div:hover {background:#00b1ec; box-shadow:10px 10px 30px rgba(0,177,236,0.2); transform:translateY(-10px); color:#fff;}
.sCertified_case3 > div:hover dl dd {color:#fff;}

.sCertified_case4 {display:flex; flex-wrap:wrap; width:100%;}
.sCertified_case4 > div {width:calc(25% - 66px); margin-right:88px; text-align:center;}
.sCertified_case4 > div:last-child {margin-right:0;}
.sCertified_case4 > div .img {border-radius:30px; box-shadow:5px 5px 20px rgba(25,25,25,0.1); position:relative;}
.sCertified_case4 > div .img:after {content:'\f105'; display:block; width:40px; line-height:40px; background:rgba(25,25,25,0.2); border-radius:50%; font-size:1.125em; color:#fff; font-weight:300; font-family:'Font Awesome 6 Pro'; text-align:center; position:absolute; left:100%; top:50%; transform:translateY(-50%); margin-left:24px;}
.sCertified_case4 > div:last-child .img:after {display:none;}
.sCertified_case4 > div .img img {width:100%;}
.sCertified_case4 > div p {font-size:1.125em; font-weight:500; margin-top:20px;}

@media screen and (max-width:1220px){
    .sCertified_case1 > div:first-child {padding-right:50px;}
    .sCertified_case1 > div:last-child {padding-left:50px;}

    .sCertified_case3 > div {width:calc(25% - 15px); margin-right:20px;}
}

@media screen and (max-width:1024px){
    .sCertified_case1 > div:first-child:after {width:40px; line-height:40px; font-size:1.125em;}
    .sCertified_case1 > div .icon {width:90px; height:90px; margin-bottom:20px;}
    .sCertified_case1 > div dl dt {font-size:1.125em;}
    .sCertified_case1 > div dl dd {margin-top:10px;}

    .sCertified_case2 {height:350px; background-attachment:unset;}

    .sCertified_case3 > div {width:calc(25% - 7.5px); margin-right:10px; padding:25px 20px;}
    .sCertified_case3 > div i {font-size:2.5em; margin-bottom:20px;}
    .sCertified_case3 > div dl dt {font-size:1.125em;}
    .sCertified_case3 > div dl dd {font-size:1em; margin-top:5px;}

    .sCertified_case4 > div {width:calc(25% - 37.5px); margin-right:50px;}
    .sCertified_case4 > div .img:after {width:28px; line-height:28px; font-size:1em; margin-left:11px;}
    .sCertified_case4 > div p {font-size:1em; margin-top:10px;}
}

@media screen and (max-width:767px){
    .sCertified_case1 > div {width:100%;}
    .sCertified_case1 > div:first-child {border-right:0; border-bottom:1px solid #dcdcdc; padding-bottom:40px; padding:0 0 30px;}
    .sCertified_case1 > div:first-child:after {width:32px; line-height:32px; font-size:1em; right:50%; top:100%;}
    .sCertified_case1 > div:last-child {padding:30px 0 0;}
    .sCertified_case1 > div .icon {width:55px; height:55px; margin-bottom:15px;}

    .sCertified_case2 {height:280px;}

    .sCertified_case3 > div {width:calc(50% - 5px); padding:20px 15px;}
    .sCertified_case3 > div:nth-child(even) {margin-right:0;}
    .sCertified_case3 > div:nth-child(2) ~ div {margin-top:10px;}

    .sCertified_case4 > div {width:calc(50% - 25px)}
    .sCertified_case4 > div:nth-child(even) {margin-right:0;}
    .sCertified_case4 > div:nth-child(2) ~ div {margin-top:30px;}
    .sCertified_case4 > div:nth-child(even) .img:after {display:none;}
}


.sMedia_slide_wrap {position:relative;}
.sMedia_slide {width:100%;}
.sMedia_slide .swiper-slide {width:450px;}
.sMedia_slide .img_box {width:100%; height:280px; background-repeat:no-repeat; background-position:center center; background-size:cover;}
.sMedia_slide p {font-size:1.125em; color:#666; line-height:1.6em; margin-top:20px;}
.sMedia_slide .swiper-button-next, .sMedia_slide .swiper-button-prev {width:auto; height:auto; font-size:1.875em; line-height:1.2em; top:0; margin-top:0;}
.sMedia_slide .swiper-button-next {right:0;}
.sMedia_slide .swiper-button-prev {left:auto; right:50px;}
.sMedia_slide .swiper-button-next:after, .sMedia_slide .swiper-button-prev:after {font-size:1em; color:#191919; font-weight:300; font-family:'Font Awesome 6 Pro'}
.sMedia_slide .swiper-button-next:after {content:'\f054'}
.sMedia_slide .swiper-button-prev:after {content:'\f053'}

@media screen and (max-width:1024px){
    .sMedia_slide .swiper-slide {width:calc(50% - 5px)}
    .sMedia_slide .img_box {height:27vw;}
    .sMedia_slide p {font-size:1em; margin-top:10px;}
    .sMedia_slide .swiper-button-next, .sMedia_slide .swiper-button-prev {font-size:1.5em;}
    .sMedia_slide .swiper-button-prev {right:30px;}
}



.sContact_case1:after {content:''; display:block; width:100%; clear:both;}
.sContact_case1 .form_box {display:flex; justify-content:space-between; flex-wrap:wrap; width:100%; margin-top:100px; overflow:hidden;}
.sContact_case1 .form_box li {width:calc(50% - 25px); margin-bottom:50px;}
.sContact_case1 .form_box li.w_100 {width:100%;}
.sContact_case1 .form_box li label {display:block; font-size:1em; line-height:1.5em; font-weight:700;}
.sContact_case1 .form_box li .form_txt {display:block; width:100%; height:50px; background:none; border:0; border-bottom:1px solid #a4a4a4; border-radius:0; font-size:1.125em; color:#666; font-family:'Pretendard'; padding:0 20px;}
.sContact_case1 .form_box li .form_textarea {display:block; width:100%; height:150px; background:none; border:0; border-bottom:1px solid #a4a4a4; border-radius:0; font-size:1.125em; color:#666; font-family:'Pretendard'; padding:5px 20px; resize:none;}
.sContact_case1 .form_box li .form_txt:focus, .sContact_case1 .form_box li .form_textarea:focus {outline:none; box-shadow:none !important; border:0 !important; border-bottom:3px solid #00b1ec !important;}
.sContact_case1 .form_box li .select_box {width:100%; position:relative;}
.sContact_case1 .form_box li .select_box:after {content:'\f107'; font-size:0.875em; color:#666; font-weight:400; font-family:'Font Awesome 6 Pro'; position:absolute; right:20px; top:50%; transform:translateY(-50%)}
.sContact_case1 .form_box li .select_box select {display:block; width:100%; height:50px; background:none; border:0; border-bottom:1px solid #a4a4a4; border-radius:0; font-size:1.125em; color:#666; font-family:'Pretendard'; padding:0 60px 0 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none; position:relative; z-index:5;}
.sContact_case1 .form_box li .select_box.non_select select {color:#666;}
.sContact_case1 .form_box li .select_box select option {color:#191919; text-align:left;}
.sContact_case1 .form_box li .select_box select:focus {outline:none; box-shadow:none !important; border:0 !important; border-bottom:3px solid #00b1ec !important;}
.sContact_case1 .form_box li .form_file {display:block; width:100%; margin-top:15px;}
.sContact_case1 .privacy_box {width:100%; background:#f8f9fc; padding:35px 40px;; margin-bottom:30px;}
.sContact_case1 .privacy_box p {height:80px; font-size:1em; color:#a4a4a4; line-height:1.8em; overflow-y:scroll; padding-right:70px;}
.sContact_case1 .privacy_box p::-webkit-scrollbar {width:5px;}
.sContact_case1 .privacy_box p::-webkit-scrollbar-thumb {background:#dcdcdc; border-radius:2.5px;}
.sContact_case1 .privacy_box p::-webkit-scrollbar-track {background:rgba(255,255,255,0);}
.sContact_case1 .check_box {display:block;}
.sContact_case1 .check_box input {display:none;}
.sContact_case1 .check_box p {font-size:1em; color:#a4a4a4; line-height:30px; font-weight:600; padding-left:40px; position:relative;}
.sContact_case1 .check_box p:before {content:''; display:block; width:30px; height:30px; border:1px solid #a4a4a4; border-radius:50%; font-size:0.875em; color:#fff; line-height:28px; font-weight:400; font-family:'Font Awesome 6 Pro'; text-align:center; position:absolute; left:0; top:0;}
.sContact_case1 .check_box input:checked + p:before {content:'\f00c'; background:#00b1ec; border-color:#00b1ec;}
.sContact_case1 .brandkeeper_btn1 {float:right;}
.sContact_case1 .detail_box.hide {display:none;}
.sContact_case1 .radio_wrap1 {display:flex; justify-content:space-between; width:100%; margin-top:10px;}
.sContact_case1 .radio_wrap1 .radio_box {width:calc(33.33% - 3.33px); height:60px; position:relative;}
.sContact_case1 .radio_wrap1 .radio_box input {width:100%; height:100%; opacity:0; position:absolute; left:0; top:0; cursor:pointer;}
.sContact_case1 .radio_wrap1 .radio_box label {display:flex; justify-content:center; align-items:center; width:100%; height:100%; border:2px solid #00b1ec; font-size:1em; font-weight:400;}
.sContact_case1 .radio_wrap1 .radio_box input:checked + label {background:#00b1ec; color:#fff;}
.sContact_case1 .radio_wrap2 {display:flex; align-items:center; width:100%; height:50px;}
.sContact_case1 .radio_wrap2 .radio_box {width:33.33%;}
.sContact_case1 .radio_wrap2 .radio_box input {display:none;}
.sContact_case1 .radio_wrap2 .radio_box label {display:inline-block; font-size:1em; font-weight:400; position:relative;}
.sContact_case1 .radio_wrap2 .radio_box label:before {content:''; display:inline-block; width:20px; height:20px; border:1px solid #ccc; border-radius:50%; vertical-align:middle;}
.sContact_case1 .radio_wrap2 .radio_box label p {display:inline-block; vertical-align:middle; margin-left:5px;}
.sContact_case1 .radio_wrap2 .radio_box input:checked + label:before {border-color:#00b1ec;}
.sContact_case1 .radio_wrap2 .radio_box input:checked + label:after {content:''; display:block; width:12px; height:12px; background:#00b1ec; border-radius:50%; position:absolute; left:4px; top:7px;}

.sContact_case1 .size_box {display:flex; align-items:center; width:100%;}
.sContact_case1 .size_box > div {width:calc(50% - 15px); position:relative;}
.sContact_case1 .size_box > div .form_txt {padding-right:40px;}
.sContact_case1 .size_box > div > span {position:absolute; top:50%; right:10px; transform:translateY(-50%)}
.sContact_case1 .size_box > span {display:block; width:30px; text-align:center;}

.sContact_info {width:100%; background:#f8f9fc; padding:30px 15px; text-align:center; margin-top:30px;}
.sContact_info p {font-size:1.125em; line-height:1.5em; font-weight:500; margin-bottom:10px;}
.sContact_info a {margin:0 5px;}

@media screen and (max-width:1024px){
    .sContact_case1 .form_box {margin-top:10%;}
    .sContact_case1 .form_box li {width:calc(50% - 10px); margin-bottom:20px;}
    .sContact_case1 .form_box li .form_txt {height:40px; padding:0 15px;}
    .sContact_case1 .form_box li .form_textarea {height:100px; padding:5px 15px;}
    .sContact_case1 .form_box li .select_box:after {right:15px;}
    .sContact_case1 .form_box li .select_box select {height:40px; padding:0 50px 0 15px;}
	.sContact_case1 .form_box li .form_file {margin-top:10px;}
    .sContact_case1 .privacy_box {padding:25px; margin-bottom:15px;}
    .sContact_case1 .privacy_box p {height:60px;}
	.sContact_case1 .check_box {margin-bottom:30px;}
	.sContact_case1 .radio_wrap1 .radio_box {height:50px;}
	.sContact_case1 .radio_wrap2 {height:40px;}
	.sContact_case1 .radio_wrap2 .radio_box input:checked + label:after {top:6px;}
	
	.sContact_case1 .size_box > div {width:calc(50% - 10px);}
	.sContact_case1 .size_box > div .form_txt {padding-right:35px;}
	.sContact_case1 .size_box > span {width:20px;}
}

@media screen and (max-width:767px){
    .sContact_case1 .form_box li {width:100%;}
    .sContact_case1 .form_box li .form_txt {height:38px;}
    .sContact_case1 .form_box li .form_textarea {height:80px;}
    .sContact_case1 .form_box li .select_box select {height:38px;}
    .sContact_case1 .privacy_box {padding:15px;}
    .sContact_case1 .check_box p {line-height:22px; padding-left:30px;}
    .sContact_case1 .check_box p:before {width:22px; height:22px; line-height:20px;}
	.sContact_case1 .radio_wrap1 .radio_box {height:38px;}
	.sContact_case1 .radio_wrap2 {height:38px;}
	.sContact_case1 .radio_wrap2 .radio_box label:before {width:18px; height:18px;}
	.sContact_case1 .radio_wrap2 .radio_box input:checked + label:after {width:10px; height:10px;}
}


.board_list_box {width:100%; border-top:2px solid #191919;}
.board_list_box thead th {font-size:1em; line-height:1.5em; font-weight:500; text-align:center; padding:15px 0; border-bottom:1px solid #dcdcdc;}
.board_list_box thead th.num {width:90px;}
.board_list_box thead th.writer {width:150px;}
.board_list_box thead th.date {width:140px;}
.board_list_box tbody td {font-size:1em; color:#666; line-height:1.7em; padding:20px 0; border-bottom:1px solid #dcdcdc; text-align:center; position:relative;}
.board_list_box tbody td.empty {color:#191919; font-weight:500; padding:100px 0;}
.board_list_box tbody td.subject {text-align:left; padding-left:30px;}
.board_list_box tbody td.subject.reply:before {content:''; display:inline-block; width:13px; height:17px; background:url(../images/icon_reply.png) no-repeat center center; margin-right:10px;}
.board_list_box tbody tr:hover {background:#fcfcfc;}
.board_list_box tbody tr:hover td.num:before {content:''; display:block; width:3px; height:100%; background:#0377bf; position:absolute; left:0; top:0;}
.board_list_box tbody tr:hover td.subject {color:#191919; font-weight:500;}

.board_view_box .subject {display:block; font-size:1.5em; line-height:1.5em; font-weight:400; margin-bottom:20px;}
.board_view_box .info {overflow:hidden; border-bottom:1px solid #dcdcdc; padding-bottom:15px;}
.board_view_box .info li {float:left; font-size:0.875em; color:#666; line-height:1.5em; font-weight:500; font-family:'Lato', 'Noto Sans KR'; margin-right:30px;}
.board_view_box .info li:last-child {margin-right:0;}
.board_view_box .info li:before {font-size:1em;  font-weight:300; font-family:'Font Awesome 5 Pro'; margin-right:10px;}
.board_view_box .info li.name:before {content:'\f007'}
.board_view_box .info li.date:before {content:'\f017'}
.board_view_box .info li.date .time {margin-left:8px;}
.board_view_box .content {padding:50px 0; border-bottom:1px solid #dcdcdc;}
.board_view_box .content .state {overflow:hidden; margin-bottom:15px;}
.board_view_box .content .state li {float:left; background:#f8f9fc; border-radius:3px; font-size:0.75em; color:#666; padding:5px 13px; margin-right:3px;}
.board_view_box .content .state li:last-child {margin-right:0;}
.board_view_box .content .state li.active {background:#00b1ec; color:#fff; font-weight:600;}
.board_view_box .content p {font-size:1em; color:#666; line-height:1.7em;}
.board_view_box .content table {width:100%; border-top:2px solid #326e79}
.board_view_box .content table th {font-size:1em; padding:10px 0; background:#f7f8f9; border-bottom:1px solid #ddd;}
.board_view_box .content table td {font-size:1em; padding:10px; border-bottom:1px solid #ddd; text-align:left;}
.board_view_box .file {background:#fcfcfc; padding:20px;}
.board_view_box .file > li {margin-bottom:5px;}
.board_view_box .file > li:last-child {margin-bottom:0;}
.board_view_box .brandkeeper_btn1 {margin:100px auto 0;}

.board_b_box {display:flex; justify-content:space-between; align-items:flex-start;}
.board_b_box.right {justify-content:right;}
.board_b_box a {display:block; width:90px; line-height:36px; text-align:center; border-radius:5px; font-size:0.875em; font-weight:500; margin-right:5px;}
.board_b_box a.w_150 {width:150px;}
.board_b_box a:last-child {margin-right:0;}
.board_b_box a.case1 {border:2px solid #191919; background:#191919; color:#fff;}
.board_b_box a.case2 {border:2px solid #a4a4a4; color:#a4a4a4;}
.board_b_box a.case3 {border:2px solid #0377bf; background:#0377bf; color:#fff;}
.board_b_box .myip_btn3 {display:flex;}

@media screen and (max-width:1024px){
	.board_list_box thead th {padding:11px 0;}
	.board_list_box thead th.num {width:50px;}
	.board_list_box thead th.writer {width:110px;}
	.board_list_box thead th.date {width:100px;}
	.board_list_box tbody td {padding:13px 0;}
	.board_list_box tbody td.empty {padding:50px 0;}
	.board_list_box tbody td.subject {padding-left:10px;}

	.board_view_box .subject {margin-bottom:5px;}
	.board_view_box .info {padding-bottom:8px;}
	.board_view_box .info li {margin-right:15px;}
	.board_view_box .info li:before {margin-right:5px;}
	.board_view_box .info li.date .time {margin-left:4px;}
	.board_view_box .content {padding:30px 0;}
	.board_view_box .file {padding:10px 15px;}
	.board_view_box .brandkeeper_btn1 {margin-top:10%;}

	.board_b_box a {width:80px; line-height:31px; margin-right:3px;}
	.board_b_box a.w_150 {width:130px;}
}

@media screen and (max-width:767px){
	.board_list_box .writer {display:none;}
	.board_list_box thead th.num {width:35px;}
	.board_list_box thead th.date {width:80px;}
	.board_list_box tbody td.subject {padding-left:10px;}
	.board_list_box tbody td.subject.reply:before {width:10px; height:14px; background-size:contain; margin-right:5px;}

	.board_b_box {flex-wrap:wrap;}
	.board_b_box a {width:65px;}
	.board_b_box a.w_150 {width:120px;}
}


.order_state_wrap {display:flex; justify-content:center; flex-wrap:wrap; width:100%; margin-top:50px;}
.order_state_wrap li {width:100px; margin:0 25px; text-align:center;}
.order_state_wrap li button {display:block; width:100%; font-size:1em; font-family:'Pretendard';}
.order_state_wrap li i {display:block; width:100%; line-height:100px; background:#eff2ff; border-radius:50%; font-size:1.41em; color:#a0b0fb;}
.order_state_wrap li p {font-size:1em; color:#ccc; margin-top:15px;}
.order_state_wrap li.active i {background:#4361ee; color:#fff;}
.order_state_wrap li.active p {color:#4361ee; font-weight:600;}

@media screen and (max-width:1024px){
	.order_state_wrap {margin-top:5%;}
    .order_state_wrap li {width:80px; margin:0 15px;}
    .order_state_wrap li i {line-height:80px;}
    .order_state_wrap li p {margin-top:10px;}
}

@media screen and (max-width:767px){
    .order_state_wrap li {width:60px; margin:10px;}
    .order_state_wrap li i {line-height:60px;}
    .order_state_wrap li p {margin-top:5px;}
}

.step_box1 {display:flex; justify-content:start; flex-wrap:wrap; width:100%; padding-top:100px;}
.step_box1 > li {width:25%; position:relative;}
.step_box1 > li:nth-child(4) ~ li {width:33.33%; margin-top:70px;}
.step_box1 > li:before {content:''; display:block; width:20px; height:20px; background:#fff; border:3px solid #c6dae6; border-radius:50%; margin-top:-2px; margin-bottom:20px; position:relative; z-index:5;}
.step_box1 > li:after {content:''; display:block; width:100%; border-top:1px solid #dcdcdc; position:absolute; left:0; top:7px;}
.step_box1 > li .date {font-size:0.75em; color:#666; line-height:1.5em; font-family:'Lato'}
.step_box1 > li .txt1 {font-size:0.875em; color:#0377bf; line-height:1.5em; font-weight:500; font-family:'Pretendard';}
.step_box1 > li.past .txt1 {color:#a4a4a4; font-weight:400;}
.step_box1 > li.past:after {border-top:1px dashed #dcdcdc}
.step_box1 > li.current:before {width:30px; height:30px; border:5px solid #0377bf; margin-top:-8px;}
.step_box1 > li.current:after {border-top-color:#0377bf;}
.step_box1 > li.current .txt1 {font-size:1em; color:#0377bf; font-weight:700;}
.step_box1 > li.current .txt1:before {content:''; display:block; width:30px; height:30px; background:#0377bf; border-radius:50%; position:absolute; left:0; top:-8px; animation:uptocallmini 1.5s infinite;}
.step_box1 > li.current .limit {width:115px; line-height:30px; border-radius:30px; text-align:center; background:#db222a; font-size:0.75em; color:#fff; font-weight:500; position:absolute; left:50%; top:-40px; margin-left:-57.5px; animation:step 2s linear infinite}
.step_box1 > li.current .limit:before {content:''; display:block; width:0; height:0; border-top:10px solid #db222a; border-left:3px solid transparent; border-right:3px solid transparent; position:absolute; left:50%; bottom:-10px; margin-left:-3px;}

@keyframes uptocallmini {
    0% {
        transform: scale(1,1);
        opacity: 0.8;
    }

    80% {
        opacity: 0;
        transform: scale(1.5,1.5);
    }

    85% {
        transform: scale(0.5,0.5);
        opacity: 0;
    }

    100% {
        transform: scale(1,1);
        opacity: 0.8;
    }
}

@keyframes step{
	0% {transform:translateY(0)}
	50% {transform:translateY(-10px)}
	100% {transform:translateY(0)}
}


@media screen and (max-width:1024px){
	.step_box1 > li {width:33.33%}
	.step_box1 > li:nth-child(3) ~ li {width:33.33%; margin-top:60px;}
}

@media screen and (max-width:767px){
	.step_box1 > li {width:50%}
	.step_box1 > li:nth-child(2) ~ li {width:50%; margin-top:50px;}
	.step_box1 > li:nth-child(6) ~ li {width:100%;}
	.step_box1 > li.current .limit {width:100px; line-height:26px; top:-30px; margin-left:-50px;}
}


.modal_popup {display:none; justify-content:center; align-items:center; width:100%; height:100%; background:rgba(25,25,25,0.5); position:fixed; left:0; top:0; z-index:350;}
.modal_popup.active {display:flex;}
.modal_inner {width:88%; max-width:650px; max-height:90vh; background:#fff; padding:70px 75px 40px; position:relative; text-align:center; overflow-y:auto;}
.modal_inner.case2 {max-width:900px;}
.modal_inner .close_btn {font-size:1.875em; position:absolute; right:30px; top:30px;}
.modal_inner .close_btn:before {content:'\f00d'; font-size:1em; font-weight:300; font-family:'Font Awesome 6 Pro'}
.modal_inner img {max-width:100%;}
.modal_inner .subject {font-size:1.25em; line-height:1.5em; font-weight:600; margin-top:20px;}
.modal_inner2 {width:88%; max-width:300px; background:#fff; border-radius:10px; overflow:hidden;}
.modal_inner2 input[type="text"] {display:block; width:100%; height:32px; background:#fff; border:1px solid #ddd; border-radius:0; font-size:1em; font-family:'Pretendard'; padding:0 10px;}
.modal_inner2 .product_box {width:100%; border:1px solid #ddd; border-bottom:0; padding:20px; text-align:center;}
.modal_inner2 .btn_box {width:100%; overflow:hidden;}
.modal_inner2 .btn_box button {float:left; display:block; width:50%; height:40px; font-size:0.875em; color:#fff; font-weight:600; font-family:'Pretendard';}
.modal_inner2 .btn_box button.close_btn {background:#666;}
.modal_inner2 .btn_box button.submit_btn {background:#191919;}

.estimate_list_popup .modal_inner {padding:0;}
.estimate_list_popup .estimate_wrap {padding:70px 75px 40px;}
.estimate_list_popup .brandkeeper_btn1 {margin:50px auto 0;}

.orderconfirmation_view_popup .modal_inner {padding:0;}
.orderconfirmation_view_popup .estimate_wrap {padding:70px 75px 40px;}
.orderconfirmation_view_popup .brandkeeper_btn1 {margin:50px auto 0;}

@media screen and (max-width:1024px){
    .modal_inner {max-width:550px; padding:40px;}
    .modal_inner .close_btn {font-size:1.5em; right:15px; top:15px;}
    .modal_inner .subject {font-size:1.125em; margin-top:10px;}

	.estimate_list_popup .estimate_wrap {padding:40px;}
	.estimate_list_popup .brandkeeper_btn1 {margin-top:25px;}
	
	.orderconfirmation_view_popup .estimate_wrap {padding:40px;}
	.orderconfirmation_view_popup .brandkeeper_btn1 {margin-top:25px;}
}

@media screen and (max-width:767px){
    .modal_inner {padding:30px 30px 20px;}
    .modal_inner .close_btn {right:10px; top:10px;}
    .modal_inner .subject {margin-top:5px;}

	.estimate_list_popup .estimate_wrap {padding:30px 30px 20px;}
	
	.orderconfirmation_view_popup .estimate_wrap {padding:30px 30px 20px;}
}


.estimate_wrap {text-align:left;}
.estimate_wrap input[type="number"]::-webkit-outer-spin-button, .estimate_wrap input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
.estimate_wrap input {display:block; width:100%; height:40px; border:1px solid #ccc; border-radius:0; font-size:1em; font-family:'Pretendard'; padding:0 10px;}
.estimate_wrap input[type="file"] {height:auto; border:0; padding:0;}
.estimate_wrap textarea {display:block; width:100%; height:60px; border:1px solid #ccc; border-radius:0; font-size:1em; font-family:'Pretendard'; padding:10px; resize:none;}
.estimate_wrap .tit_box .tit1 {font-size:1.25em; line-height:1.4em; font-weight:700;}
.estimate_wrap .tit_box .tit2 {font-size:1.875em; line-height:1.3em; font-weight:700; text-align:center;}
.estimate_wrap .tit_box ul {margin-top:10px;}
.estimate_wrap .tit_box ul li {font-size:0.875em; color:#666; line-height:1.4em;}
.estimate_wrap .info_box {display:flex; align-itmes:center; flex-wrap:wrap; width:100%; border-top:2px solid #191919; border-bottom:2px solid #191919; margin-top:30px; padding:15px 0;}
.estimate_wrap .info_box dl {display:flex; align-items:center; width:50%; margin-top:5px;}
.estimate_wrap .info_box dl dt {width:45px; font-size:0.9375em; font-weight:500; padding-left:10px;}
.estimate_wrap .info_box dl dd {width:calc(100% - 45px); font-size:0.9375em; color:#666;}
.estimate_wrap .info_box dl.w_100 {width:100%;}
.estimate_wrap .info_box2 {margin-top:15px;}
.estimate_wrap .info_box2 dl {width:100%; margin-top:5px; overflow:hidden;}
.estimate_wrap .info_box2 dl dt {float:left; width:55px; font-size:1em; font-weight:500; line-height:1.5em;}
.estimate_wrap .info_box2 dl dd {float:left; width:calc(100% - 55px); font-size:1em; color:#666; line-height:1.5em;}
.estimate_wrap .info_box2 dl.case2 dt {float:none; width:100%;}
.estimate_wrap .info_box3 {margin-top:15px;}
.estimate_wrap .info_box3 dl {display:flex; align-items:center; width:100%; margin-top:5px; overflow:hidden; padding-left:50%;}
.estimate_wrap .info_box3 dl dt {width:90px; font-size:1em; font-weight:500; line-height:1.5em;}
.estimate_wrap .info_box3 dl dd {width:calc(100% - 90px); font-size:1em; color:#666; line-height:1.5em;}
.estimate_wrap .estimate_box {margin:30px 0 15px;}
.estimate_wrap .estimate_box .tit {font-size:1.25em; line-height:1.4em; font-weight:600; text-align:center; margin-bottom:15px;}
.estimate_wrap .estimate_box .tit2 {font-size:1.125em; font-weight:500; margin:30px 0 10px;}
.estimate_wrap .estimate_box .tit input {text-align:center;}
.estimate_wrap .estimate_box .ps {font-size:0.875em; color:#f00; text-align:right; margin-bottom:5px;}
.estimate_wrap .estimate_box .box {display:flex; justify-content:space-between; align-items:end; margin-bottom:5px;}
.estimate_wrap .estimate_box .box .ps {margin-bottom:0;}
.estimate_wrap .estimate_box .box > div {max-width:50%;}
.estimate_wrap .estimate_box .box > div input {margin-bottom:5px;}
.estimate_wrap .estimate_box .box > div input:last-child {margin-bottom:0;}
.estimate_wrap .estimate_box .size_box {display:flex; align-items:center;}
.estimate_wrap .estimate_box .size_box input {width:calc(50% - 5px); padding:0;}
.estimate_wrap .estimate_box .size_box span {display:block; width:10px; text-align:center;}
.estimate_wrap .deliverycompleted_box {margin:30px 0 15px;}
.estimate_wrap .deliverycompleted_box .tit {font-size:1.25em; line-height:1.4em; font-weight:600; text-align:center; margin-bottom:15px;}
.estimate_wrap .deliverycompleted_box .tit input {text-align:center;}
.estimate_wrap .deliverycompleted_box .ps {font-size:0.875em; color:#f00; text-align:right; margin-bottom:5px;}
.estimate_wrap .deliverycompleted_box .box {margin-bottom:5px;}
.estimate_wrap .deliverycompleted_box .box .ps {margin-bottom:0;}
.estimate_wrap .deliverycompleted_box .box input {max-width:50%; margin-bottom:5px;}
.estimate_wrap .deliverycompleted_box .box input:last-child {margin-bottom:0;}
.estimate_wrap .order_box {margin:30px 0 15px;}
.estimate_wrap .order_box .tit {font-size:1.25em; line-height:1.4em; font-weight:600; text-align:center; margin-bottom:15px;}
.estimate_wrap .order_box .tit input {text-align:center;}
.estimate_wrap .order_box .box {display:flex; justify-content:space-between; align-items:center; margin-bottom:5px;}
.estimate_wrap .order_box .box > div {display:flex; align-items:center; width:40%;}
.estimate_wrap .order_box .box p {width:80px;}
.estimate_wrap .order_box .box input {width:calc(100% - 80px);}
.estimate_wrap .order_box .size_box input {padding-right:40px;}
.estimate_wrap .order_box .layout_box {display:flex; align-items:center;}
.estimate_wrap .order_box .layout_box input {width:calc(50% - 45px);}
.estimate_wrap .order_box .layout_box span {display:block; width:20px; text-align:center;}
.estimate_wrap .order_box .layout_box p {width:50px;}
.estimate_wrap .order_detail_box {margin:30px 0;}
.estimate_wrap .order_detail_box textarea {height:140px;}
.estimate_wrap .authenticated_box {margin:30px 0;}
.estimate_wrap .authenticated_box .tit {font-size:1.125em; font-weight:500; margin-bottom:10px;}
.estimate_wrap .authenticated_box .txt {font-size:0.875em; color:#f00; line-height:1.5em; margin-top:5px;}
.estimate_wrap .authenticated_box2 {margin:30px 0;}
.estimate_wrap .authenticated_box2 .tit {font-size:1.125em; font-weight:500; margin-bottom:10px;}
.estimate_wrap .authenticated_box2 .txt {font-size:0.875em; color:#f00; line-height:1.5em; margin-top:5px;}
.estimate_wrap table {width:100%; border:1px solid #191919; border-collapse:collapse;}
.estimate_wrap table thead th {background:#1f4385; font-size:0.875em; color:#fff; line-height:1.3em; font-weight:500; text-align:center; padding:3px 5px; border:1px solid #191919}
.estimate_wrap table tbody td {height:50px; font-size:1em; color:#666; padding:5px 5px; border:1px solid #191919; text-align:center; position:relative;}
.estimate_wrap table tbody td input {text-align:center;}
.estimate_wrap table tbody td .button {display:block; width:30px; height:30px; background:#191919; border-radius:3px; font-size:1em; position:absolute; left:100%; top:50%; transform:translateY(-50%); margin-left:5px;}
.estimate_wrap table tbody td .button:before {font-size:1em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro';}
.estimate_wrap table tbody td .add_btn:before {content:'\2b';}
.estimate_wrap table tbody td .remove_btn:before {content:'\f068';}
.estimate_wrap table.case2 thead th {background:#999;}
.estimate_wrap .txt1 {font-size:1em; line-height:1.5em; text-align:right; margin-top:20px;}
.estimate_wrap .brandkeeper_btn1 {margin:50px auto 0;}

@media screen and (max-width:1024px){
	.estimate_wrap table tbody td .button {width:20px; height:20px; font-size:0.875em;}
}



.order_wrap input {display:block; width:100%; height:40px; border:1px solid #ccc; border-radius:0; font-size:1em; font-family:'Pretendard'; padding:0 10px;}
.order_wrap textarea {display:block; width:100%; height:120px; border:1px solid #ccc; border-radius:0; font-size:1em; font-family:'Pretendard'; padding:10px; resize:none;}
.order_wrap table {width:100%; border:1px solid #191919; border-collapse:collapse;}
.order_wrap table tbody th {width:120px; background:#1f4385; font-size:1em; color:#fff; line-height:1.3em; font-weight:500; text-align:center; padding:13px 0; border:1px solid #eee}
.order_wrap table tbody td {font-size:1em; color:#666; padding:13px 15px; border:1px solid #eee; text-align:left;}
.order_wrap .brandkeeper_btn1 {margin:50px auto 0;}


.certify_wrap {width:88%; max-width:300px; background:#fff; overflow:hidden;}
.certify_wrap input[type="text"] {display:block; width:100%; height:32px; background:#fff; border:1px solid #ddd; border-radius:0; font-size:1em; font-family:'Pretendard'; padding:0 10px;}
.certify_wrap textarea {display:block; width:100%; height:50px; background:#fff; border:1px solid #ddd; border-radius:0; font-size:1em; font-family:'Pretendard'; padding:10px; resize:none;}
.certify_wrap .tit_box {width:100%; background:#1f4385; padding:10px; text-align:center;}
.certify_wrap .tit_box input[type="text"] {text-align:center;}
.certify_wrap .product_box {width:100%; border-left:1px solid #ddd; border-right:1px solid #ddd; padding:40px 10px; text-align:center;}
.certify_wrap .product_box .img_box {width:100%; min-height:40px; position:relative; text-align:center;}
.certify_wrap .product_box .img_box i {font-size:5em; color:#ddd;}
.certify_wrap .product_box .img_box input[type="file"] {display:block; width:100%; height:100%; position:absolute; left:0; top:0; opacity:0; cursor:pointer;}
.certify_wrap .product_box .img_box img {display:none; max-width:100%; max-height:300px; height:auto;}
.certify_wrap .product_box .img_box.active i {display:none;}
/*.certify_wrap .product_box .img_box.active input[type="file"] {display:none;}*/
.certify_wrap .product_box .img_box.active img {display:inline-block;}
.certify_wrap .product_box input[type="text"] {margin-top:15px; text-align:center;}
.certify_wrap .certify_box {width:100%; background:#f8f9fc url(/images/certify_mark.gif) no-repeat 5px center; background-size:auto 85%; padding:10px 10px 10px 95px; border:1px solid #ddd; border-top:0;}
.certify_wrap .btn_box {width:100%; overflow:hidden;}
.certify_wrap .btn_box button {float:left; display:block; width:50%; height:40px; font-size:0.875em; color:#fff; font-weight:500; font-family:'Pretendard';}
.certify_wrap .btn_box button.close_btn, .certify_wrap .btn_box button.preview_btn {background:#666;}
.certify_wrap .btn_box button.submit_btn {background:#191919;}

.certify_wrap.case2 {width:100%; max-width:100%; min-height:100vh;}
.certify_wrap.case2 .tit_box {display:flex; align-items:center; height:50px;}
.certify_wrap.case2 .tit_box p {font-size:1.25em; color:#fff; font-weight:500;}
.certify_wrap.case2 .product_box {display:flex; justify-content:center; align-items:center; flex-direction:column; height:calc(100% - 170px);}
.certify_wrap.case2 .product_box .img_box {}
.certify_wrap.case2 .product_box .img_box img {max-height:60vh;}
.certify_wrap.case2 .product_box span {font-size:3em; color:#fff; font-weight:700; margin-top:10px; font-family:'SCoreDream'; text-transform:uppercase; text-shadow: -1px -1px 0 rgb(3 119 191 / 25%), 1px -1px 0 rgb(3 119 191 / 25%), -1px 1px 0 rgb(3 119 191 / 25%), 1px 1px 0 rgb(3 119 191 / 25%); margin-bottom:-40px;}
.certify_wrap.case2 .product_box p {font-size:3em; font-weight:700; margin-top:10px; font-family:'SCoreDream'; position:relative; z-index:3;}
.certify_wrap.case2 .certify_box {display:flex; align-items:center; height:120px; overflow-y:auto; padding-left:115px;}

.certify_edit_wrap {display:flex; justify-content:center; align-items:center; flex-wrap:wrap;}
.certify_edit_wrap > div {margin:20px;}
.certify_edit_wrap .certify_wrap.case2 {width:auto; min-height:0; max-width:600px;}

@media screen and (max-width:767px){
	.certify_wrap.case2 .product_box span {margin-bottom:-35px;}
}


.process_list_wrap > ul {display:flex; flex-wrap:wrap; width:100%; overflow:hidden;}
.process_list_wrap > ul > li {width:calc(50% - 12.5px); margin-right:15px; border:1px solid #dcdcdc; border-radius:5px; position:relative; padding:25px 30px 20px;}
.process_list_wrap > ul > li:nth-child(2n) {margin-right:0;}
.process_list_wrap > ul > li:nth-child(2) ~ li {margin-top:15px;}
.process_list_wrap > ul > li.empty_list {width:100%;}
/*.process_list_wrap > ul > li > a {display:block; width:100%; height:100%; padding:25px 30px 20px;}*/
.process_list_wrap > ul > li .cate {display:inline-block; background:#eff6ff; font-size:0.875em; color:#0377bf; line-height:25px; border-radius:3px; font-weight:700; padding:0 13px; margin-bottom:10px;}
.process_list_wrap > ul > li .cate.case1 {background:#eff9ec; color:#0e9f6e}
.process_list_wrap > ul > li .cate.case2 {background:#fff9e0; color:#f66e3c}
.process_list_wrap > ul > li .cate.case3 {background:#f4efff; color:#724cf9}
.process_list_wrap > ul > li .cate.case4 {background:#d8d1ff; color:#4e4a85}
.process_list_wrap > ul > li .cate.case5 {background:#cbfaff; color:#2ea8b5}
.process_list_wrap > ul > li .subject {display:block; font-size:1.25em; line-height:1.5em;}
.process_list_wrap > ul > li .t1 {font-size:0.875em; line-height:1.2em; font-weight:500; margin-top:10px;}
.process_list_wrap > ul > li .mark_list {margin-top:25px;}
.process_list_wrap > ul > li .mark_list li {font-size:0.875em; color:#666; line-height:1.5em; margin-bottom:2px; padding-left:22px; position:relative;}
.process_list_wrap > ul > li .mark_list li:last-child {margin-bottom:0;}
.process_list_wrap > ul > li .mark_list li i {position:absolute; left:0; top:4px;}
.process_list_wrap > ul > li .tag_list {margin-top:15px;}
.process_list_wrap > ul > li .tag_list li {display:inline-block; font-size:0.6875em; color:#a4a4a4; line-height:25px; padding:0 12px; border-radius:13px; background:#f8f9fa;}
.process_list_wrap > ul > li.add_box {border:0; background:#f8f9fa;}
.process_list_wrap > ul > li.add_box > a {display:flex; justify-content:center; align-items:center;}
.process_list_wrap > ul > li.add_box > a:before {content:'\f067'; font-size:1.875em; color:#dcdcdc; font-weight:300; font-family:'Font Awesome 6 Pro'}
.process_list_wrap > ul > li .chk_wr {position:absolute; right:10px; top:10px;}
.process_list_wrap > ul > li > a {margin-top:5px;}
.process_list_wrap > ul > li > a:first-of-type {margin-top:15px;}
.process_list_wrap > ul > li .qrdown_btn {display:block; width:100%; line-height:45px; background:#00b1ec; border-radius:3px;; font-size:1em; color:#fff; font-weight:500; text-align:center;}
.process_list_wrap > ul > li .qrdown_popup_btn {display:block; width:100%; line-height:45px; background:#00b1ec; border-radius:3px;; font-size:1em; color:#fff; font-weight:500; font-family:'Pretendard'; text-align:center;}
.process_list_wrap > ul > li .add_link, .process_list_wrap > ul > li .edit_btn {display:block; width:100%; line-height:45px; background:#191919; border-radius:3px;; font-size:1em; color:#fff; font-weight:500; text-align:center;}

.qrdown_popup {display:none; justify-content:center; align-items:center; width:100%; height:100vh; background:rgba(25,25,25,0.8); position:fixed; left:0; top:0; z-index:500;}
.qrdown_popup.active {display:flex;}
.qrdown_popup > div {width:88%; max-width:450px; background:#fff; border-radius:15px; overflow:hidden;}
.qrdown_popup ul {width:100%; max-height:calc(100vh - 150px); padding:35px; overflow-y:auto;}
.qrdown_popup ul li {margin-bottom:5px;}
.qrdown_popup ul li:last-child {margin-bottom:0;}
.qrdown_popup ul li a {display:block; width:100%; line-height:45px; background:#00b1ec; border-radius:3px; font-size:1em; color:#fff; font-weight:500; text-align:center;}
.qrdown_popup .close_btn {display:block; width:100%; height:50px; background:#191919; font-size:1em; color:#fff; font-weight:500;}

@media screen and (max-width:1024px){
	.process_list_wrap > ul > li {width:calc(50% - 5px); margin-right:10px; padding:15px;}
	/*.process_list_wrap > ul > li:nth-child(3n) {margin-right:10px;}
	.process_list_wrap > ul > li:nth-child(2n) {margin-right:0;}*/
	.process_list_wrap > ul > li:nth-child(2) ~ li {margin-top:10px;}
	/*.process_list_wrap > ul > li > a {padding:15px;}*/
	.process_list_wrap > ul > li .qrdown_btn {line-height:40px; margin-top:10px;}
}

@media screen and (max-width:767px){
	.process_list_wrap > ul > li {float:none; width:100%; height:auto; margin-right:0;}
	.process_list_wrap > ul > li:nth-child(1) ~ li {margin-top:5px;}
}



.estimate_date_list {border-top:2px solid #191919; margin-top:10px;}
.estimate_date_list li a {display:flex; justify-content:space-between; align-items:center; font-size:1em; padding:15px 10px; border-bottom:1px solid #ddd;}
.estimate_date_list li a span {font-size:0.875em; color:#666;}

.data_list_box {border-top:2px solid #191919; margin-top:10px;}
.data_list_box li a {display:flex; justify-content:space-between; align-items:center; font-size:1em; padding:15px 10px; border-bottom:1px solid #ddd;}
.data_list_box li a span {font-size:0.875em; color:#666;}


.qrcode_view_tab {display:flex; justify-content:space-between; width:100%;}
.qrcode_view_tab a {display:block; width:calc(50% - 5px); border:1px solid #e3ebf6; background:#fff; line-height:48px; font-size:1em; text-align:center;}
.qrcode_view_tab a.active {background:#1f4385; color:#fff; font-weight:500;}

@media screen and (max-width:1024px){
	.qrcode_view_tab a {width:calc(50% - 2.5px); line-height:40px;}
}