@charset "utf-8";

.main_btn li a:after,
.main_btn li a,
header,
.webtong_contents_wrap
{
	transition: all .5s;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s
}
.certification,
.contents_wrap .certification.con02,
.contents_wrap .certification.effect-on .estimate
{
	transition: all 1.5s;
	-webkit-transition: all 1.5s;
	-moz-transition: all 1.5s;
	-o-transition: all 1.5s;
	-ms-transition: all 1.5s;
}

.sub_nav01,
.sub_nav02,
.sub_nav03,
.sub_nav04,
.sub_nav05 {display:none}

/************ gnb *********************/
.skipnav {position: fixed;width: 100%;background: #000;color: #fff;text-align: center;z-index: 1}
.skipnav a {display: block;color: #fff;font-weight: bold;width: 0;height: 0;line-height: 0;font-size: 0}
.skipnav a:focus, .skip a:active {display: block;padding: 5px 0;width: auto;height: auto;line-height: 1.5;font-size: 14px}

header {width:100%;position: absolute;background-color:rgba(0,0,0,0);z-index: 31;height: 66px}
header.subbg {    background-color: #353030;}
header.menu-fixed {position: fixed;background-color: rgba(0, 0, 0, 0.7)}

h4.ctit {padding: 30px 0 0 0;font-size: 40px;letter-spacing: -1.2px;font-weight: 600}
.nav_wrap {max-width: 1200px;z-index: 1;margin: 0 auto;position: relative}
.nav_wrap > h1 {position: absolute;top: 11px;left: 0}
.nav_wrap > h1 > a {background: url('../images/z5-logo.png') no-repeat;display: block;text-indent: -999em;width: 177px;margin:0 auto;height: 42px}
.nav_wrap > .m_menu {display:none}
nav {position: relative;z-index: 2;float: right}
nav:after {content: '';clear: both;display: block}
.solution_wrap {background: url(/image/business/solution_bg.png) no-repeat;margin-top: 30px;position: relative;z-index: -2;}
.solution_text_box {background-color: #fff;width: 57%;float: right;margin-right: 32px;margin-top: 131px;position: relative;box-shadow: -19px 20px 20px 15px rgba(0, 0, 0, 0.11);padding: 71px 45px;}
.solution_text_box:before {content: '';position: absolute;top: -64px;right: -33px;width: 100%;height: 100%;z-index: -1;background: rgb(60,66,96);background: linear-gradient(131deg, rgba(60,66,96,1) 23%, rgba(255,0,0,1) 100%)}
.solution_text_box h5 {font-size: 54px;font-weight: 600;margin-bottom: 13px}
.solution_text_box h5 em {color: #ff1717}
.solution_text_box .big {font-size: 20px;line-height: 24px;margin-bottom: 26px;}
.solution_text_box .small {font-size: 15px;font-weight: 300;letter-spacing: -0.6px}
.solution_list {background-color: #f6f6f6;padding: 45px 0;margin-top:30px}
.solution_list li {width: 20%;float: left;text-align: center;font-size: 17px;line-height: 21px;letter-spacing: -0.6px}
.solution_list li i {width:144px;height:144px;display:inline-block;border-radius: 100%;}
.solution_list li p {margin-top:10px}
.solution_list li:nth-of-type(1) i {background: #fff url(/image/business/solution01.png) no-repeat center center}
.solution_list li:nth-of-type(2) i {background: #fff url(/image/business/solution02.png) no-repeat center center}
.solution_list li:nth-of-type(3) i {background: #fff url(/image/business/solution03.png) no-repeat center center}
.solution_list li:nth-of-type(4) i {background: #fff url(/image/business/solution04.png) no-repeat center center}
.solution_list li:nth-of-type(5) i {background: #fff url(/image/business/solution05.png) no-repeat center center}

.webtong_gallery03 {margin: 30px -1% 0}
.webtong_gallery03:after {content: "";display: block;clear: both}
.webtong_gallery03 .card_wrap {width: 25%;float: left;padding: 0 1%}
.webtong_gallery03 .card_wrap a:before,
.webtong_gallery03 .card_wrap a:after,
.webtong_gallery03 .card_wrap a span:before,
.webtong_gallery03 .card_wrap a span:after {content: '';display: block;position: absolute;background: #0064a7;transition: all 0.3s;z-index: 1;}

.webtong_gallery03 .card_wrap a:before {width: 0;height: 4px;top: 0;left:0;transition: all 0.1s;transition-delay: 0.3s}
.webtong_gallery03 .card_wrap a span:before {width: 4px;height: 0;top: 0;right: 0;transition: all 0.1s;transition-delay: 0.2s}
.webtong_gallery03 .card_wrap a span:after {width: 0;height: 4px;bottom: 0;right: 0;transition: all 0.1s;transition-delay: 0.1s}
.webtong_gallery03 .card_wrap a:after {width: 4px;height: 0;bottom: 0;left:0;transition: all 0.1s;transition-delay: 0.01s}
.webtong_gallery03 .card_wrap a:hover:before, .webtong_gallery03 .card_wrap a:focus:before  {width: 100%;transition-delay: 0.01s}
.webtong_gallery03 .card_wrap a:hover span:before, .webtong_gallery03 .card_wrap a:focus span:before {height: 100%;transition-delay: 0.1s}
.webtong_gallery03 .card_wrap a:hover span:after, .webtong_gallery03 .card_wrap a:focus span:after {width: 100%;transition-delay: 0.2s}
.webtong_gallery03 .card_wrap a:hover:after, .webtong_gallery03 .card_wrap a:focus:after {height: 100%;transition-delay: 0.3s}

.webtong_gallery03 .card_wrap a {position:relative;display: block}
.webtong_gallery03 .card_wrap a span {display: block;position:relative;padding-top:69%;overflow: hidden}
.webtong_gallery03 .card_wrap a span img {width: 100%;position: absolute;top: 0;transition: all 0.5s}
.webtong_gallery03 .card_wrap a:hover span img, .webtong_gallery03 .card_wrap a:focus span img {transform: scale(1.2)}
.webtong_gallery03 .card_wrap em {display: block;padding: 12px;text-align: center;font-size: 18px;margin-bottom: 18px}

nav > ul {margin: 0 auto;position: relative}
nav > ul:after {content:'';display:block;clear: both}
nav > ul > li {float: left;position: relative;width: 20%}
nav > ul > li > a {color: #fff;display: block;line-height: 42px;text-align: center;position: relative;padding: 12px 50px;white-space: nowrap}
nav.menu-fixed > ul > li > a {line-height:53px}
nav.menu-fixed > ul > li > ul {top: 53px;background-color: rgba(38, 100, 142, 0.8)}
nav > ul > li > ul {position: absolute;background-color: rgba(2, 2, 2, 0.7);width: 100%;display: none;text-align:center}
nav > ul > li > ul > li > ul {display:none}
nav > ul > li > ul > li > ul > li > a {color: #fff;font-size: 13px;background-color: #205a82;display: block;padding: 9px 0 9px 20px}
nav > ul > li > ul > li > a {color: #fff;display: block;padding: 10px 10px;font-size: 12px}
nav > ul > li > ul > li.depth_add > a {display: block;background: url('../images/menu_up_down.png') no-repeat right 13px}
nav > ul > li > ul > li.depth_add.active > a {background-color: #3483b9;background-position: right -23px}


/**visual**/
#webtong_contents {position: relative;overflow: hidden;backface-visibility: hidden;padding-top: 35%}
.img_loaded #webtong_contents .background_img {transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transition: all 15s ;-webkit-transition: all 15s ;-moz-transition: all 15s ;-o-transition: all 15s ;-ms-transition: all 15s}

.background_img {background: url('../images/background.png') no-repeat center / cover;position: absolute;top: 0;left: 0;width: 100%;height: 100%;transform: translate3d(0,0,0) scale(1.3);-webkit-transform: translate3d(0,0,0) scale(1.3);-ms-transform: translate3d(0,0,0) scale(1.3);-moz-transform: translate3d(0,0,0) scale(1.3);-o-transform: translate3d(0,0,0) scale(1.3)}

.webtong_text_box {margin: 0 auto;position: absolute;width: 55%;top:42%;left:50%;transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%)}
.webtong_text_box:after {content: '';clear: both;display: block}
.webtong_text_box .text_box_in {width: 72%;font-size: 17px;visibility: hidden;opacity:0;right:0;position:absolute}
.webtong_text_box .text_box {width: 28%;float: left;margin-top: -23px}
.webtong_text_box .text_box li {float: left;}
.webtong_text_box .text_box li:nth-child(1) p {color:#ff7d33}
.webtong_text_box .text_box li:nth-child(2) p {color:#c49efd}
.webtong_text_box .text_box li:nth-child(3) p {color:#7de9ff}
.webtong_text_box .text_box li:nth-child(4) p {color:#ffe64c}
.webtong_text_box .text_box li:nth-child(5) p {color:#aaff32}
.webtong_text_box .text_box li:nth-child(6) p {color:#4aacf9}
.webtong_text_box .text_box li:nth-child(1).on > a {background-color:#ff7d33}
.webtong_text_box .text_box li:nth-child(2).on > a {background-color:#c49efd}
.webtong_text_box .text_box li:nth-child(3).on > a {background-color:#7de9ff}
.webtong_text_box .text_box li:nth-child(4).on > a {background-color:#ffe64c}
.webtong_text_box .text_box li:nth-child(5).on > a {background-color:#aaff32}
.webtong_text_box .text_box li:nth-child(6).on > a {background-color:#4aacf9}
.webtong_text_box .text_box_in.on {visibility:visible;opacity:1;top:-70px}
.webtong_text_box .text_box_in > p {color: #fff;font-size: 4.3em;letter-spacing: -2.5px;font-weight: 300}
.webtong_text_box .text_box_in > p em {font-weight: 700;color:#fff}
.webtong_text_box .text_box_in > span {display: block;color: rgba(255, 255, 255, 0.7);font-size: 1.1em;font-weight: 300;letter-spacing: -0.8px}
.webtong_text_box .text_box_in > a {display: inline-block;color: #fff;margin-top: 20px;background: url('../images/go.png') no-repeat;text-indent: -999em;width: 77px;height:22px}
.webtong_text_box .text_box:after {content:'';display:block;clear:both}
.webtong_text_box .text_box li > a {background: rgba(255, 255, 255, 0.2);display: inline-block;text-indent: -999em;width: 23px;height: 23px;border-radius: 100%;margin: 0 8px}
.webtong_text_box .text_box li > a:hover, .webtong_text_box .text_box_right li > a:focus {color: #fbd4a2;background: rgba(255, 255, 255, 0.7)}
.webtong_text_box .text_box li.on > a {color: #fbd4a2;background: rgba(134, 13, 61, 0.5)}

/**비주얼버튼**/
.main_btn {width: 72%;right: 0;position: absolute;top: 168px}
.main_btn li {float:left}
.main_btn li a {color: rgba(255, 255, 255, 0.7);display: inline-block;padding: 0px 28px;line-height: 44px;border: 1px solid #5f5c5a;margin-right: -1px;font-size: 15px;font-weight: 200;position:relative;z-index:1}
.main_btn li a:after {content: '';position: absolute;width: 0;height: 100%;background-color: #ef4123;top: 0;left: 0;z-index:-1}
.main_btn li a:hover:after {width: 100%;z-index:-1}
.main_btn li a:hover {color: #fff}
	
/**title**/
.title_30px {text-align: center;font-size: 30px;padding: 10px 30px;color:#262626;font-weight:300;font-size:40px;letter-spacing:-1.2px;position:relative;margin: 56px 0 0}
.title_30px:before {content:'';display:block;position:absolute;top:0;left:50%;margin-left:-15px;background-color:#262626;width:30px;height:1px;clear: both}
.title_30px em {font-weight:600}

/**contents**/
.webtong_contents_wrap {background: #fff url('../images/background01.png') no-repeat right -54px}
.webtong_contents_wrap02 {background: #fff url('../images/background02.png') no-repeat left 0}
.webtong-col-w25 {width:33.33333%;transition: all 1s;float: left;padding: 10px}
.webtong-col-w50 {width:50%;transition: all 1s;float: left;padding: 10px}

.contents_wrap {max-width: 1200px;margin: 0 auto}
.contents_wrap .certification {font-size: 16px;letter-spacing: -0.8px;padding-top: 250px;opacity:0}
.contents_wrap .certification.con02 {margin-top:600px;position: relative;height: 530px}
.contents_wrap .certification.con03 {padding-top: 638px;padding-bottom: 951px;opacity:0}
.contents_wrap .certification.con03 h2 {color:#fff}
.contents_wrap .certification.con03 p {color: rgba(255, 255, 255, 0.5)}
.contents_wrap .certification h2 {font-size: 4em;letter-spacing: -3px;font-weight: 800;color:#1b1b1b;line-height: 1.1em}
.contents_wrap .certification h2 em {font-weight: 200;display:block}
.contents_wrap .certification p {font-weight: 300;color: #767676;margin-top: 10px}
.contents_wrap .certification p.browse {background: url('../images/browse.png') no-repeat 0 bottom;padding-bottom: 70px}
.contents_wrap .certification dl {background:url('../images/certification.png') no-repeat left top;padding: 9px 0 138px 272px;margin-top: 40px}
.contents_wrap .certification dt {font-size: 2em;color: #eb4022;font-weight: 500}
.contents_wrap .certification dd a {border: 1px solid #cc2f13;margin-top: 11px;display: inline-block;line-height: 36px;padding: 0 40px;background: #eb4022;color: #fff}
.contents_wrap .certification .estimate {width: 100%;max-width: 749px;height: 493px;background: url('../images/estimate.png') no-repeat 0 0;display: inline-block;text-indent: -999em;position: absolute;right: 0;top: 322px;opacity:0}
.btn_go {border: 1px solid #4f779a;margin-top: 11px;display: inline-block;line-height: 36px;padding: 0 40px;background: #315575;color: #fff}
.contents_wrap .certification.effect-on {padding-top: 65px;opacity:1}
.contents_wrap .certification.con03.effect-on {padding-top: 438px;opacity:1}
.contents_wrap .certification.effect-on .estimate {top: 222px;opacity:1}


/**button**/
.filled.purple {color: #fff;background-color: #a91e55}
.filled.purple:hover, .filled.purple:focus {background-color: #88103f;border-color: #88103f}
.webtong-btn {display: inline-block;color: #212529;text-align: center;vertical-align: middle;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;border: 1px solid transparent;padding: 6px 14px 10px;font-size: 15px;font-size: .8rem;line-height: 19px;transition: all .15s;letter-spacing: -0.8px;font-family: 'Noto Sans Korean', sans-serif;white-space: nowrap;cursor: pointer}


/**webtong-tab***/
#contents {padding: 2%}
.webtong-tab {position: relative;padding: 60px 0 15px;border: 1px solid #d2d2d2;margin-bottom: 50px;}
.webtong-tab .tab-button {position: absolute;top: 0;padding: 15px 0;line-height: 15px;font-size: 15px}

.webtong-tab.type02 .tab-button {width: 45%;background-color: #f5f5f5;border-right: 1px solid #d2d2d2;border-bottom: 1px solid #d2d2d2;display: inline-block;text-align: center}
.webtong-tab.type02 .tab-wrap .tab-button.tab01 {left: 0}
.webtong-tab.type02 .tab-wrap .tab-button.tab02 {left: 45%}

.webtong-tab .tab-wrap {padding: 0 20px}
.webtong-tab .tab-wrap .tab-button.on, .webtong-tab .tab-wrap .tab-button:hover, .webtong-tab .tab-wrap .tab-button:focus {background-color: #fff;border-bottom: 0}
.webtong-tab .tab-wrap ul li {padding: 6px 0;clear: both}
.webtong-tab .tab-wrap ul li a {position: relative;padding-left: 9px;float: left;width: 67%;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.webtong-tab .tab-wrap ul li a:before {content: '';position: absolute;top: 9px;left: 0;background: url('../images/basic_list1.png') no-repeat;width: 5px;height: 5px}
.webtong-tab .tab-wrap ul li span {float: right}
.webtong-tab .tab-wrap .more {display:none}
.webtong-tab .tab-wrap.on .more {position: absolute;top: 0;right: 0;text-indent: -999em;background: url('../images/more.gif') no-repeat center;width: 10%;display: block;border-bottom: 1px solid #d2d2d2;padding: 15px 0;line-height: 15px}
.webtong-tab .tab-wrap ul {visibility: hidden;height: 0;opacity: 0;transition: all 1s;overflow:hidden}
.webtong-tab .tab-wrap.on ul {visibility: visible;height: auto;opacity: 1}

.webtong-box-wrap {position: relative;border: 1px solid #d2d2d2;margin-bottom: 50px}
.webtong-box-wrap .box-wrap {min-height: 210px}
.webtong-box-wrap .box-wrap p {border-bottom: 1px solid #d2d2d2;padding: 15px;font-size: 15px;line-height: 15px}
.webtong-box-wrap .box-wrap ul {margin:0 -5px;padding: 8px 16px 7px}
.webtong-box-wrap .box-wrap ul li {width:25%;float:left;text-align: center;padding: 5px;position: relative}
.webtong-box-wrap .box-wrap ul li a {display: block;overflow: hidden;margin: 10px}
.webtong-box-wrap .box-wrap ul li a img {transition: all 0.5s;width: 100%}
.webtong-box-wrap .box-wrap ul li a:hover img {transform: scale(1.2)}
.webtong-box-wrap .box-wrap .more {position: absolute;top: 0;right: 0;text-indent: -999em;background: url('../images/more.gif') no-repeat center;width: 10%;display: block;padding: 15px 0;line-height: 15px}

footer {position:relative;background-color:#eceeef}
footer .bg_right {position: absolute;left: 50%;background: #172939;width: 50%;height: 100%}
footer .footer_wrap {max-width:1200px;margin:0 auto;position: relative}
footer .footer_wrap .left {width: 65%;float: left;background-color: #eceeef;padding: 43px 65px 44px 0px;position: relative}
footer .footer_wrap .left h3 {font-size: 29px;display: inline-block;top: 51px;position: absolute;left: 0}
footer .footer_wrap .left h3 a {color:#1b1b1b;text-decoration: none}

footer .footer_wrap .left h3:hover:before, footer .footer_wrap .left h3.on:before {content:'';position:absolute;width:100%;height:3px;background-color:#000;bottom: -6px}
footer .footer_wrap .left .txt_right {position: absolute;top: 51px;left: 78px}
footer .footer_wrap .left div div {position: relative;display:none}
footer .footer_wrap .left div div.on {display:block}
footer .footer_wrap .left div div ul {font-size: 16px;letter-spacing: -0.9px;margin-top: 25px;line-height: 26px;margin-top: 76px}
footer .footer_wrap .left div div ul li span {float: right}
footer .footer_wrap .left div.on > .more {position: absolute;top: 60px;right: 65px;display: inline-block;width: 30px;height: 30px;background: url('../images/more01.gif') no-repeat;text-indent: -999em}
footer .footer_wrap .left div > .more {display:none}

footer .footer_wrap .right {width:35%;float:right;color:#fff;padding: 49px 0 23px 0;text-align: right;font-size: 14px}
footer .footer_wrap .right strong {font-size: 2.7em;text-transform: uppercase;letter-spacing: -0.9px}
footer .footer_wrap .right ul {float: right;margin-top: 20px}
footer .footer_wrap .right ul li {float:left}
footer .footer_wrap .right ul li a {color: #ff7800;padding-left: 20px;font-size:1.2em}
footer address {clear: both;font-weight: 100;line-height: 18px;color: rgba(255, 255, 255, 0.6);padding-top: 17px;font-size: 12px;}
footer p {font-family: Montserrat;font-size: 3em;line-height: 37px;font-weight: 300;padding-top: 12px; color: #fff;}
footer .footer_wrap .left div ul li a {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 79%;display: inline-block}

.sub {background: url(../image/subbg.png) no-repeat center;padding: 66px 0;position: relative;height: 262px}
.sub h2 {font-family: Montserrat;text-align: center;color: rgba(255, 255, 255, 0.61);font-size: 54px;padding-top: 49px;font-weight: 800}
.sub .sub_nav {position: relative;border-bottom: 1px solid #e2e2e2;bottom: -66px;left: 0;width: 100%;height: 57px}
.sub .sub_nav.menu-fixed {position: fixed;top: 66px;bottom: auto;z-index: 30;background-color: #fff}
.sub .sub_nav ul {position: absolute;width: 1200px;left: 50%;margin-left: -600px;top: 0;z-index: 1}
.sub .sub_nav ul li {float:left;width:25%}
.sub .sub_nav02.sub_nav ul li {width:8.5%}
.sub .sub_nav02.sub_nav ul li.w-type {width:11.75%}
.sub .sub_nav03.sub_nav ul li {width:25%}
.sub .sub_nav04.sub_nav ul li {width:33.33333%}
.sub .sub_nav05.sub_nav ul li {width:25%}
.sub .sub_nav ul li a {display:block;text-align:center;padding: 17px 0 16px}
.sub .sub_nav ul li.on a, .sub .sub_nav ul li:hover a {border-bottom: 3px solid}


/****etc***/
.text-center {text-align:center;margin-top:20px}
.btn_001 {display: inline-block;border: 1px solid;line-height: 40px;padding: 0 63px;background-color: #172939;color: #fff}
.mt10 {margin-top:10px}
.mt20 {margin-top:20px}
.mt30 {margin-top:30px}
.mt40 {margin-top:40px}
.mt50 {margin-top:50px}
.mt60 {margin-top:60px}
.mt70 {margin-top:70px}
.mt80 {margin-top:80px}
.mt90 {margin-top:90px}
.mt100 {margin-top:100px}

.mb10 {margin-bottom:10px}
.mb20 {margin-bottom:20px}
.mb30 {margin-bottom:30px}
.mb40 {margin-bottom:40px}
.mb50 {margin-bottom:50px}
.mb60 {margin-bottom:60px}
.mb70 {margin-bottom:70px}
.mb80 {margin-bottom:80px}
.mb90 {margin-bottom:90px}
.mb100 {margin-bottom:100px}

@media screen and (max-width: 1900px) {
	.contents_wrap {padding: 0 2%;}

}

@media screen and (min-width: 1700px) {
	.contents_wrap {max-width:1900px;padding: 0 10%;}
	.contents_wrap .certification h2 {font-size: 3.5vw;}
	.contents_wrap .certification p {font-size: 0.8vw;}
}

@media screen and (max-width: 1700px) {
	.webtong_text_box {width:90%;padding:0 2%}
	.webtong_text_box .text_box_in {font-size:14px}

}

@media screen and (max-width: 1300px) {
	.webtong_text_box {width:90%;padding:0 2%}
	.webtong_text_box .text_box_in {right: 19px}
	.main_btn {width: 74%;top: 130px}
	
}

@media screen and (max-width: 1200px) {
	h4.ctit {padding: 30px 0 0 20px;}
	.solution_wrap {margin:30px 2% 0}
	.solution_text_box {width: 95%;}
	.solution_text_box h5 {font-size:34px}
	.solution_text_box .big {font-size: 17px}
	.solution_list li {width: 33.33333%;margin-bottom:30px}
	.sub .sub_nav.menu-fixed {top: 55px}
	.nav_wrap > h1 {left: 16px}
	.background_img {background: url('../images/background_m.png') no-repeat center / cover}
	.sub .sub_nav {height:auto}
	.sub .sub_nav ul li.on a, .sub .sub_nav ul li:hover a {border-bottom:0}
	.sub .sub_nav ul {position: relative;max-width: 100%;width: auto;left: auto;margin: 0;background-color: #fff}
	.sub .sub_nav ul li, .sub_nav ul li {width: 33.33333% !important}
	.sub .sub_nav ul li a {padding: 8px 0}
	.contents_wrap {padding:0 3%}
	.webtong_text_box .text_box_in > span {color: #fff}
	.main_btn li a {color: #fff}
	.webtong_contents_wrap {background: #fff url('../images/background01_m.png') no-repeat right -36px;height: auto}
	.contents_wrap .certification.con02 {margin-top: 100px;height: 622px}
	.contents_wrap .certification {font-size: 16px}
	.contents_wrap .certification h2 {font-size: 3em}
	.contents_wrap .certification .estimate {background-size:100%;max-width: 700px}
	.contents_wrap .certification.con03 {padding-top: 257px;padding-bottom: 541px}
	.webtong_contents_wrap02 {background: #fff url('../images/background02_m.png') no-repeat left 0}
	footer .footer_wrap .left {width:60%}
	footer .footer_wrap .right {font-size: 12px;width:40%;padding-right:3%}
	footer .footer_wrap .left h3 {left: 21px}
	footer .footer_wrap .left .txt_right {left: 100px}
	footer .footer_wrap .left {padding: 43px 20px 44px 20px}
	footer .footer_wrap .left div ul {line-height: 22px}
	.pc_br {display:none}
	.contents_wrap .certification.con03 {padding-top: 400px;opacity:0}
	.contents_wrap .certification.con03.effect-on {padding-top: 257px;opacity:1}
	footer .footer_wrap .left div > .more {right: 19px}
	.webtong_gallery03 {margin: 30px 2% 100px;}
	
}

@media screen and (max-width: 1024px) {
	header.menu-fixed {background:none}
	#webtong_contents {margin-top: 55px;padding-top: 80%}
	header {height: 54px}
	.nav_wrap {left:0;margin:0}
	.nav_wrap > h1 {background-color: #423a37;padding: 6px 1% 7px;position: fixed;width: 100%;z-index: 4;top: 0;left:0}
	.nav_wrap.menu-fixed > h1 {background-color: rgba(1, 56, 93, 0.9)}
	.nav_wrap > h1 > a {background: url('../images/z5-logo.png') no-repeat center left / 71%;margin:0}
	.nav_wrap > .m_menu {position: fixed;right: 13px;top: 17px;z-index: 4;color: #fff;display: block;background: url('../images/menu.png') no-repeat;text-indent: -999em;width: 23px;height: 17px}
	.nav_wrap > .m_menu.off {background: url('../images/close.png') no-repeat;right: 9px}
	nav {display:none;background-color: #423a37;top: 54px;float:none;position: fixed;width: 100%}
	nav > ul {display:block}
	nav > ul > li {float:none;width:100%}
	nav > ul > .slider {display:none}
	nav > ul > li > a {line-height: 40px;display:block;padding-left: 28px;text-align:left}
	nav > ul > li.active > a {background-color: #3483b9}
	nav > ul > li.depth_add > a {display:block;line-height: 20px;background: url('../images/menu_up_down.png') no-repeat right 13px}
	nav > ul > li.depth_add.active > a {background-color: #423a37;background-position: right -23px}
	nav.menu-fixed > ul > li > ul {top:0}
	nav.menu-fixed > ul > li > a {line-height: 40px}
	nav > ul > li > ul {position:relative;text-align:left;background-color:#312d2b}
	nav > ul > li > ul > li {width: 50%;float: left;border-bottom: 1px solid rgba(255, 255, 255, 0.09);border-right: 1px solid}
	nav > ul > li > ul > li:last-child {border-bottom: 0}
	nav > ul > li > ul > li > a {padding-left: 40px;padding: 13px 0;text-align: center}
	nav > ul > li > ul > li.depth_add > a {display: block;background: url('../images/menu_up_down.png') no-repeat right 13px}
	nav > ul > li > ul > li.depth_add.active > a {background-color: #3483b9;background-position: right -23px}
	div.bsolution div {margin-left:0}
	div.bsolution span.img {display:none}
	.webtong_text_box .text_box_left {width:100%;font-size: 14px;text-align: center}
	.webtong_text_box .text_box_left.on {padding-bottom: 2em}
	.webtong_text_box .text_box_right {width:100%;padding-top: 269px}
	.webtong_text_box .text_box_right li {width:50%;float:left}
	.webtong_text_box {padding: 3% 2%}
	.webtong_text_box .text_box_in > p {font-size:3em}
	.webtong_contents_wrap {padding:2%}
	.webtong_text_box {top: 41%}
	.webtong_text_box .text_box {width: 19%}
	.webtong_text_box .text_box li {width: 100%;margin-bottom: 10px}
	.webtong_text_box .text_box_in.on {top: -6%}
	.contents_wrap .certification.effect-on .estimate {top: 310px}
	.contents_wrap .certification.con03.effect-on {padding-top: 257px}
	.main_btn {top: 180px}
	.w1024_50 {width:50%}
	.w1024_100 {width:100%}
	footer .footer_wrap .left {width:50%}
	footer .footer_wrap .right {width:50%}
	footer .footer_wrap .left div ul {font-size: 14px}
	
}

@media screen and (max-width: 860px) {
	.contents_wrap .certification.con02 {margin-top: 0;height: 540px}
	.contents_wrap .certification .estimate {top: 44px;position:relative}
	.contents_wrap .certification.effect-on .estimate {top: 44px}
	footer .footer_wrap .left {width:100%}
	footer .footer_wrap .right {width: 100%;background: #172939;text-align: center}
	footer .bg_right {display:none}
	footer .footer_wrap .right ul {float:none;margin: 20px auto 0;display: table}
	footer .footer_wrap .right ul li a {padding:0 7px}
	.webtong_gallery03 .card_wrap {width: 50%}
}

@media screen and (max-width: 740px) {
	.webtong_text_box .text_box {width: 24%}
}

@media screen and (max-width: 640px) {
	.solution_list li {width: 50%;margin-bottom:30px} 
	.webtong_text_box {padding: 23% 5% 0;top: 0;bottom: 0;left: 0;right: 0;transform: none;width: 100%}
	.webtong_text_box .text_box_left {font-size: 9px}
	.webtong_text_box .text_box_left > strong {font-size: 1.7em}
	.webtong_text_box .text_box_left > span {font-size: 1.4em}
	.webtong_text_box .text_box_right {padding-top: 241px}
	.webtong_text_box .text_box_right li {width:100%;float:none}
	.webtong_text_box .text_box_in > p {font-size:2em}
	.webtong_text_box .text_box {width: 22%}
	.webtong_text_box .text_box_in.on {top:21%}
	.webtong_text_box .text_box_in > a {background-size: 62%}
	.main_btn {top:auto;bottom:0;width: 100%}
	.main_btn li {width:33.33333%}
	.main_btn li a {width:100%;padding:0;text-align:center;border:0}
	.w640_100 {width:100%}
	.webtong-box-wrap .box-wrap ul li {width:50%}
	.contents_wrap .certification.con03 {padding-top: 300px;opacity:0}
	.pc_bg {display:none}
	.contents_wrap .certification dl {background: url('../images/certification.png') no-repeat center top;padding: 200px 0 0;text-align:center}
	.contents_wrap .certification h2 em {display:inline-block}
	.contents_wrap .certification h2 {font-size: 2em}
	.webtong_contents_wrap02 {background-position:-82px -40px}
	.contents_wrap .certification.con02 {height: 498px}
	footer .footer_wrap .left div ul li a {width: 70%}
	footer .footer_wrap .left h3 {font-size: 23px}
	.contents_wrap .certification.con03.effect-on {padding-top: 200px;opacity:1}
	div.zsolution.type span.img {position:relative;float: none;display: block;text-align: center}
	div.zsolution.type div {margin-left: 184px;float: none;margin: 0;padding: 0;margin-top: 50px}
	div.graph {background-size:100%}
	.contents_wrap .certification p {color: #1b1b1b}
	div.intro {font-size:14px}
	ul.history li ul {width:100%;margin-left:0}
	ul.history li ul li strong {position: absolute}
	ul.history li span {font-size:25px}
	h4.ctit {font-size:30px;padding: 0px 0 0 12px}
	.webtong_gallery03 .card_wrap em {font-size: 15px}
	
}

@media screen and (max-width: 400px) {
	.webtong_text_box {padding: 15% 5% 0}
	.webtong_text_box .text_box_in.on {top: 9%}
	.contents_wrap .certification .estimate {width: 100%}
	.webtong_contents_wrap02 {background-position:-100px -40px}
	.contents_wrap .certification .estimate {height: 271px}
	.contents_wrap .certification.con03.effect-on {padding-top: 160px}
}