@charset "utf-8";

/* 메인페이지리뉴얼 2019-04-08 추가 */
.main_line {overflow:hidden;}
#pstWrp {background:url("../img/main_bg_line.png") repeat-y center top;}
/* main cover */
#mainCover_new {position:relative; /*margin-top:70px;*/ padding:200px 0 100px;}
#mainCover_new .typo {width:80%; margin:auto; text-align:center}
#mainCover_new .typo h2 {font-size:50px; font-weight:500; color:#0163c6; line-height:1.3;font-weight:bold;position:relative;display:inline-block;}
#mainCover_new .typo h2:before {display:inline-block;height:10px;width:100%;content:'';background:rgba(255, 176, 76, 1);bottom:17px;position:absolute;mix-blend-mode: multiply;}
#mainCover_new .typo p {font-size:20px; color:#c3c3c3; line-height:1.5;margin-top:40px;}
#wrapper.main_bg {}
#wrapper.main_bg #header {background:none;/*transition:.4s ease*/}
#wrapper.main_bg #header.fixed {background:rgba(255,255,255,255.6);/*transition:.4s ease, opacity .5s ease*/box-shadow: 3px 3px 13px 0 rgb(0 0 0 / 10%);}
/*body.fixed #wrapper.main_bg #header {background:#000;}*/
#wrapper #header.fixed {background:rgba(255,255,255,255.6);/*transition:.4s ease, opacity .5s ease*/box-shadow: 3px 3px 13px 0 rgb(0 0 0 / 10%);}
body.fixed #wrapper #header {background:#fff;}

/* main portfolio section 2019-04-08 추가 */
#container .portfolio {padding:40px 0 200px 0;position:relative;background:url('../img/port_bg.jpg') repeat-x center bottom;}
#container .portfolio .fixed-websre {/*position:fixed;top:50%;left:50%;margin-left:-118px;margin-top:-50px;font-size:200px;color:#eef0f2;opacity:1;font-weight:700;*/}
#pstItmWrpTxt{font-size:250px;line-height:280px;color:#eef0f2;position:absolute;top:270px;left:50%;letter-spacing:-20px;width:2920px;transform:translateX(calc(50vw - 860px));font-weight:700;opacity:0.6;}
#container .portfolio .innerContainer {z-index:1;}

/* main */
.introMainWrap{min-width:1080px;width:100%;margin:0 auto;}
.introMainWrap .introMainInner{}


.introMainWrap .circle{}
.introMainWrap .circle i{display:block;position:absolute;}
.introMainWrap .circle .obj1{background:url('../img/icon_bg.png') no-repeat;top:415px;left:-515px;width:474px;height:455px;transition:all 2s cubic-bezier(.13,.45,.34,.94);}
.introMainWrap .circle .obj2{background:url('../img/icon_bg_sec.png') no-repeat;top:530px;left:1670px;width:158px;height:195px;transition:all 2s cubic-bezier(.13,.45,.34,.94);}

.introMainWrap .circle.scene1 .obj1{top:415px;left:-515px;}
.introMainWrap .circle.scene1 .obj2{top:530px;left:1670px;}

.introMainWrap .circle.scene2 .obj1{top:1480px;left:210px;}
.introMainWrap .circle.scene2 .obj2{top:1900px;left:1413px;}

.introMainWrap .circle.scene3 .obj1{top:2904px;left:-53px;}
.introMainWrap .circle.scene3 .obj2{top:3120px;left:1311px;}

.introMainWrap .circle.scene4 .obj1{top:3904px;left:653px;}
.introMainWrap .circle.scene4 .obj2{top:3900px;left:1311px;}

.introMainWrap .circle.scene5 .obj1{top:4904px;left:-515px;}
.introMainWrap .circle.scene5 .obj2{top:5120px;left:1670px;}

/* motion */
.introMainWrap [class*=trigger]{position:absolute;}
.introMainWrap .trigger_cir1{top:200px;}
.introMainWrap .trigger_cir2{top:1200px;}
.introMainWrap .trigger_cir3{top:2400px;}
.introMainWrap .trigger_cir4{top:3600px;}
.introMainWrap .trigger_cir5{top:4800px;}

/*.introMainWrap .con1{position:fixed;top:0;width:1920px;height:100%;overflow:hidden;}*/
.introMainWrap .introMainInner{min-height:3000px;}
.introMainWrap .frame{position:fixed;top:100px;width:1920px;}
.introMainWrap .end{position:static;}

@keyframes txt1 {
	0% {
		transform: translateY(100px);
		opacity:0;
	}
	100% {
		transform: translateY(0);
		opacity:1;
	}
}
@keyframes con1_obj1 {
	0% {
		transform: translateY(200px);
		opacity:0;
	}
	100% {
		transform: translateY(0);
		opacity:1;
	}
}
@keyframes con1_obj2 {
	0% {
		transform: scale(0.5);
		opacity:0;
	}
	100% {
		transform: scale(1);
		opacity:1;
	}
}
@keyframes con2_obj1 {
	100% {
		transform: translateY(10px);
	}
}
@keyframes con3_obj1 {
	100% {
		transform: scale(1);
	}
}


.portfolio .visual_wave_box {
 width:100%;
 height:0;
 position:absolute;
 bottom:515px;
 left:0;
 right:0;
 background:#fff;
 z-index:0;
}
.portfolio .visual_wave {
 background: url('../img/wave_4x.svg') repeat-x;
 position:absolute;
 top:-100px;
 width:6400px;
 height:100px;
 animation: wave 14s cubic-bezier(0.36,0.45,0.63,0.53) infinite;
 transform: translate3d(0,0,0);
 z-index:999;
}
@keyframes wave {
 0% {
  margin-left: -1600px;
 }
 100% {
  margin-left:0px;
 }
}
.portfolio .wave_sec {

 position:relative;
 top:-240px;
 height:180px;
 z-index:0;
}

.team-member--2 .team-member__thumb:before {
    background: -webkit-gradient(linear, left bottom, left top, from(#000), to(transparent));
    background: -webkit-linear-gradient(bottom, #000, transparent);
    background: -o-linear-gradient(bottom, #000, transparent);
    background: linear-gradient(to top, #000, transparent);
    
}

#container .portfolio .workWrapper_new {column-width:452px;column-gap:122px;/*column-count: 4;
  column-gap: 1em;*/position:relative;}
#container .portfolio .workWrapper_new > li {display:inline-block;width:100%;margin-bottom:120px;}
#container .portfolio .workWrapper_new > li.action-area {margin-top:200px;}
#container .portfolio .workWrapper_new > li.action-area-sec {margin-top:90px;}
#container .portfolio .workWrapper_new > li .image_area {width:100%;}

#container .portfolio .workWrapper_new > li .thumb {width:100%;position:relative;}
#container .portfolio .workWrapper_new > li .thumb:before {
background: -webkit-gradient(linear, left bottom, left top, from(#004d9b), to(transparent));
background: -webkit-linear-gradient(bottom, #004d9b, transparent);
background: -o-linear-gradient(bottom, #004d9b, transparent);
background: linear-gradient(to top, #004d9b, transparent);
/*background:rgba(0,77,155,0.9);*/
content:'';width:100%;height:100%;position:absolute;left:0px;top:0px;border-radius:30px;opacity:0;transition:all .2s ease}
#container .portfolio .workWrapper_new > li:hover .thumb:before {opacity:1;}
#container .portfolio .workWrapper_new > li .thumb:after {color:#fff;font-family:'xeicon';content:'\e9c5';width:100%;height:100%;position:absolute;text-align:center;top:50%;margin-top:-55px;font-size:50px;opacity:0;transition:all .2s ease}

#container .portfolio .workWrapper_new > li:hover .thumb:after {opacity:1;margin-top:-25px;}
#container .portfolio .workWrapper_new > li .thumb img {display:block;width:100%;border-radius:30px;}
#container .portfolio .workWrapper_new > li .title-box {position:relative;}
#container .portfolio .workWrapper_new > li .title-box a {display:block; width:100%; height:100%}
#container .portfolio .workWrapper_new > li .title-box a .info {padding:0px;margin-top:40px;text-align:center;}

#container .portfolio .workWrapper_new > li .title-box a .info h3 {font-size:25px; font-weight:normal; color:#2f2929; margin-bottom:10px}
#container .portfolio .workWrapper_new > li .title-box a .info p {font-size:17px; color:#2f2929; letter-spacing:-0.5px;font-weight:300;}
#container .portfolio .more_btn {position:relative;margin:0px auto;text-align:center;opacity:0; filter:alpha(opacity=0); transform:translate(0,50px); transition:all .6s cubic-bezier(.165,.84,.44,1);}
#container .portfolio .more_btn.active {opacity:1; filter:alpha(opacity=100); transform:translate(0,0);transition-delay:0.3s;}
#container .portfolio .more_btn a {color:#0163c6;font-size:15px;letter-spacing:0px;display:inline-block;border:solid 1px #0163c6;padding:25px 80px;}
#container .portfolio .more_btn a:hover {color:#fff;background:#0163c6;border-color:#0163c6;}

#container .portfolio .more-btn {text-align:center;position:relative;}
#container .portfolio .more-btn h1 {font-size:30px;color:#0163c6;display:inline-block;margin-right:20px;}
#container .portfolio .more-btn h1 span {color:#333;}
#container .portfolio .more-btn p {width:70px;height:70px;border-radius:70px;background:#feaf4b;text-align:center;display:inline-block;}
#container .portfolio .more-btn p i {font-size:20px;color:#fff;padding-top:25px;}

/* real review */
#container .review {position:relative;width:100%;background:#f6f6f6;text-align:left;padding-bottom:200px;}
#container .review .review-websre {font-size:200px;color:#fbfbfb;font-weight:bold;text-align:center;position:absolute;left:50%;margin-left:-717px;top:-150px;}
#container .review .rolling {padding:0px 0px 0px;}
#container .review .roll-content {background:#fff;border-radius:30px;padding:60px 50px;transition:all .2s ease;box-shadow: 1px 1px 13px 0 rgb(0 0 0 / 20%);}
#container .review .roll-content:hover {background:#0163c6;}
#container .review .roll-content:hover span {color:#fff;}
#container .review .roll-content:hover p {color:#fff;}
#container .review .roll-content:before {font-family:'xeicon';content:'\e907';font-size:30px;color:#ffe84c;position:absolute;top:50%;right:55px;opacity:0;transition:all .2s ease}
#container .review .roll-content:hover:before {opacity:1;right:25px;}
#container .review span {font-size:17px;position:relative;z-index:9;color:#0163c6;transition:all .2s ease} 
#container .review p {margin-top:30px;color:#333;font-size:23px;transition:all .2s ease}


/* inquiry */
#map_bottom {background:#fff;padding:150px 0px;}
#map_bottom .inner .leftArea {float:left; width:48%}
#map_bottom .inner .leftArea .inner_tit {color:#0163c6;font-size:50px;}
#map_bottom .inner .leftArea .inner_tit span {margin-left:30px;}
#map_bottom .inner .leftArea .left_inner_con {color:#888;font-size:20px;padding:30px 0px;position:relative;}
#map_bottom .inner .leftArea .left_inner_con:before {position:absolute;content:'';left:0px;bottom:0px;width:50px;height:1px;background:#ddd;} 
#map_bottom .inner .leftArea .infoList {margin:30px 0 40px 0}
#map_bottom .inner .leftArea .infoList li {position:relative; font-size:16px; color:#343434; padding:5px 0 5px 0px}
#map_bottom .inner .leftArea .infoList li:before {position:absolute; top:50%; left:0; margin-top:-9px; font-family:'Pe-icon-7-stroke'; font-size:18px}
/*#map_bottom .inner .leftArea .infoList li.icon1:before {content:'\e638'}
#map_bottom .inner .leftArea .infoList li.icon2:before {content:'\e63b'}
#map_bottom .inner .leftArea .infoList li.icon3:before {content:'\e670'}*/

#map_bottom .inner .rightArea {float:right; width:48%}
#map_bottom .inner .rightArea .fieldList {}
#map_bottom .inner .rightArea .fieldList li {margin-bottom:10px}
#map_bottom .inner .rightArea .fieldList li input[type=text] {width:100%; height:65px; padding-left:0px; font-size:16px; color:#343434;border:none; border-bottom:solid 2px #ebebeb;background:#fff}
#map_bottom .inner .rightArea .fieldList li input[type=text],
#map_bottom .inner .rightArea .fieldList li textarea {
    background-color: transparent;
    border: none;
    border-bottom: 2px solid #eee;
    display: block;
    padding: 0 0 10px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    resize: none;
    width: 100%;
}

#map_bottom .inner .rightArea .fieldList li input[type=text]:focus,
#map_bottom .inner .rightArea .fieldList li textarea:focus {
	outline: none;
    border-bottom-color: #ffb04c;
}
input:focus {
  
}

#map_bottom .inner .rightArea .fieldList li input[type=file] {width:100%; height:30px}
#map_bottom .inner .rightArea .fieldList li textarea {width:100%; height:125px; padding:20px 0px; font-size:16px; color:#343434; }
#map_bottom .inner .rightArea .fieldList li .selectbox {position:relative}
#map_bottom .inner .rightArea .fieldList li .selectbox > a {position:relative; display:block; width:100%; height:65px; padding-left:0px; font-size:16px; color:#999; line-height:65px; border:none;  background:#fff;border-bottom:solid 2px #ebebeb;}

#map_bottom .inner .rightArea .fieldList li .selectbox > a:after {position:absolute; top:50%; right:0px; font-family:'xeicon'; font-size:18px; color:#333; line-height:1; content:'\e941'; margin-top:-9px}
#map_bottom .inner .rightArea .fieldList li .selectbox > a.open:after {content:'\e944'}
#map_bottom .inner .rightArea .fieldList li .selectbox ul {display:none; position:absolute; top:50px; width:100%; border:1px solid #dedede; border-radius:6px; box-shadow:0 1px 2px rgba(0, 0, 0, .08); overflow:hidden; z-index:100}
#map_bottom .inner .rightArea .fieldList li .selectbox ul li {display:block; margin:0; padding:14px 20px; font-size:15px; color:#666; border-top:1px solid rgba(0, 0, 0, .12); background:#fff; cursor:pointer}
#map_bottom .inner .rightArea .fieldList li .selectbox ul li:first-child {border-top:none}
#map_bottom .inner .rightArea .fieldList li .selectbox ul li:hover {color:#333; background:#f4f4f4}
#map_bottom .inner .rightArea .btnArea {margin-top:30px}
#map_bottom .inner .rightArea .btnArea .btn {margin-right:5px}
#map_bottom .inner .rightArea .btnArea .btn-black-o {width:100%; border-radius:0}

@media screen and (max-width:1800px) {
.innerContainer {max-width:100%;}
#container .portfolio .workWrapper_new {column-width:345px;column-gap:122px;}
}
@media screen and (max-width:1400px) {
#container .portfolio .workWrapper_new {column-width:300px;column-gap:52px;}
}
@media screen and (max-width:1280px) {
.introMainWrap {min-width:100%;}
#container .portfolio .workWrapper_new > li .image_area {width:100%;}
#container .portfolio .workWrapper_new > li .thumb img {width:100%;}
}
@media screen and (max-width:1024px) {
#mainCover_new .typo h2 {font-size:42px;}
#mainCover_new .typo p {}
#container .portfolio .workWrapper_new > li .title-box a .info h3 {font-size:21px;}
#container .portfolio .workWrapper_new > li .title-box a .info p {font-size:13px;}
#container .portfolio .more_btn a {font-size:13px;position:relative;top:-15px;padding:18px 60px}

#map_bottom {padding:70px 0px;}
#map_bottom .inner .leftArea {float:left; width:100%}
#map_bottom .inner .leftArea .inner_tit {font-size:30px;}
#map_bottom .inner .leftArea .inner_tit span {margin-left:20px;}
#map_bottom .inner .leftArea .left_inner_con {font-size:18px;padding:20px 0px;}
#map_bottom .inner .leftArea .left_inner_con:before {left:0px;bottom:0px;} 
#map_bottom .inner .leftArea .infoList {margin:20px 0 30px 0}
#map_bottom .inner .leftArea .infoList li {font-size:13px;}

#map_bottom .inner .rightArea {float:right; width:100%}
#map_bottom .inner .rightArea .fieldList li input[type=text] {height:40px;font-size:13px;}
#map_bottom .inner .rightArea .fieldList li .selectbox > a {height:40px;font-size:13px;line-height:40px;}
#map_bottom .inner .rightArea .fieldList li .selectbox ul {top:38px;}
#map_bottom .inner .rightArea .fieldList li .selectbox ul li {font-size:13px;}
#map_bottom .inner .rightArea .fieldList li textarea {font-size:13px;}
 

}
@media screen and (max-width:768px) {
#mainCover_new {padding:100px 0 60px;}
#mainCover_new .typo h2 {font-size:28px;}
#mainCover_new .typo h2:before {bottom:10px;}
#mainCover_new .typo p {font-size:16px;}

#wrapper {/*height:100%!important;*/margin:0px;}
#wrapper.main_bg {/*margin-top:0px; */height:100%;}


#container {background-position:-50px 0px;}

#container .portfolio {padding:40px 0px 100px 0px}
#container .portfolio .workWrapper_new > li {width:100%;}
#container .portfolio .workWrapper_new > li .image_area {width:100%;}
#container .portfolio .workWrapper_new > li {margin-top:0px !important; margin-bottom:60px}
#container .portfolio .workWrapper_new > li .jum {display:none;}
#container .portfolio .workWrapper_new > li .jum2 {display:none;}
#container .portfolio .workWrapper_new > li .title-box a .info h3 {font-size:15px;}
#container .portfolio .workWrapper_new > li .title-box a .info p {font-size:12px;}
#container .portfolio .more_btn {width:100%;text-align:center;margin-top:0px;left:auto;margin-left:auto;}
#container .portfolio .more-btn h1 {font-size:20px;}
#container .portfolio .more-btn p {width:40px;height:40px;}
#container .portfolio .more-btn p i {padding-top:10px;}

#container .review {padding-bottom:0px;}
#container .review .review-websre {font-size:60px;position:absolute;left:50%;margin-left:-215px;top:20px;}
#container .review .roll-content {padding:30px;}
#container .review .rolling {padding:50px 0px 50px;}
#container .review h1 img {width:50%}
#container .review span.pt {font-size:50px;bottom:-25px;}
#container .review span.title {font-size:14px;color:#fff;margin:20px 0px;display:block;position:relative;}
#container .review p {margin-top:20px;color:#ccc;font-size:12px;}
}



/* wrapper */
#wrapper {/*background:url(../img/cover_pattern.png)*/background:#f6f6f6;overflow:hidden;}

/* sub cover */
#subCover {position:relative; padding:270px 0; /*background:url(../img/cover_pattern.png)*/border-bottom:solid 1px #dfdfdf;}
#subCover.wideBtm {padding-bottom:220px}
#subCover .typo {width:80%; margin:auto; text-align:center}
#subCover .typo h2 {font-size:50px; color:#0163c6; line-height:1.3;position:relative;font-weight:bold;display:inline-block;z-index:1;}
#subCover .typo h2:before {display:inline-block; margin:0px auto; width:100%; height:10px; content:''; background:#ffb04c;position:absolute;left:0px;bottom:17px;mix-blend-mode: multiply;}
#subCover .typo p {font-size:20px; font-weight:500; color:#000; line-height:1.7;margin-top:20px;z-index:1;position:relative;}
#subCover .typo span.aniTxt {position:absolute;top: calc(50% - 10px);left:0; transform:translateY(-50%);color:#ffffff;font-size:200px;line-height:100%;font-weight:600; white-space: nowrap;z-index:0;}
#subCover .typo span.aniTxt:after { content:"Web Design Agency Websrepublic Inc. Web Design Agency Websrepublic Inc. Web Design Agency Websrepublic Inc. Web Design Agency Websrepublic Inc.";z-index:0;}

#subCover .typo span.aniTxt2 {position:absolute;top: calc(50% - 10px);left:0; transform:translateY(-50%);color:#ffffff;font-size:200px;line-height:100%;font-weight:600; white-space: nowrap;z-index:0;}
#subCover .typo span.aniTxt2:after { content:"We are Websrepublic. We are Websrepublic. We are Websrepublic. We are Websrepublic. We are Websrepublic. We are Websrepublic. We are Websrepublic.";z-index:0;}

#subCover .typo span.aniTxt3 {position:absolute;top: calc(50% - 10px);left:0; transform:translateY(-50%);color:#ffffff;font-size:200px;line-height:100%;font-weight:600; white-space: nowrap;z-index:0;}
#subCover .typo span.aniTxt3:after { content:"Our News. Get the latest news from Websrepublic right now Our News. Get the latest news from Websrepublic right now Our News. Get the latest news from Websrepublic right now";z-index:0;}

/* common */
.innerContainer {position:relative; max-width:100%; margin:auto; padding:0 50px;}
.innerContainer:after {clear:both; display:block; content:''}
.innerContainer > .title {text-align:center; margin-bottom:50px}
#container h2.inner_tit {/*font-family:'Montserrat'; font-weight:700; font-size:55px; color:#363636*/}

/* ====================================
 * about us *
==================================== */

/* rules section */
#container .about_rule {padding:150px 0 150px 0;}
#container .about_rule .title-box {position:relative;}
#container .about_rule .title-box p {font-size:60px; font-weight:700; line-height:1.1; color:#e5e5e5; letter-spacing:-2px;transform: rotate(270deg);position:absolute;left:0px;top:165px;}
#container .about_rule ul {float:right; width:66.4%}
#container .about_rule ul > li {margin-bottom:75px; display:table; width:100%}
#container .about_rule ul > li:after {clear:both; display:block; content:''}
#container .about_rule ul > li .num {position:relative; display:inline-block; width:10%; vertical-align:top}
#container .about_rule ul > li .num:after {position:absolute; top:37px; left:20px; width:1px; height:300%; content:''; background:#c7d7e7; opacity:.5}
#container .about_rule ul > li:last-child .num:after {display:none}
#container .about_rule ul > li .num h3 {font-size:30px; font-weight:600; color:#0163c6;}
#container .about_rule ul > li .desc {display:inline-block; width:90%; padding-left:30px}
#container .about_rule ul > li .desc h4 {font-size:25px; font-weight:normal; color:#2f2929; margin-bottom:25px}
#container .about_rule ul > li .desc p {font-size:19px; color:#666; line-height:1.4;font-family:'notokr';}

/* intro section */
#container .about_intro {background:#fff;padding:220px 0px 140px;position:relative;}
#container .about_intro:before {position:absolute;content:'';background:rgba(255,255,255,1);width:50%;left:0px;top:0px;}
#container .about_intro .box-list li {float:left; width:100%; padding:0 0px; height:auto; text-align:left;margin-bottom:95px;}
#container .about_intro .box-list li h3 {color:#2f2929;font-size:25px;font-weight:normal;}
#container .about_intro .box-list li p {font-size:19px; color:#666; line-height:1.6; word-break:keep-all; padding-top:20px;font-family:'notokr';}
#container .about_intro .bg-img {position:absolute;left:-450px;top:-600px;}
#container .about_intro .typoWrapper {margin:110px 0}

#container .about_intro .typoWrapper .leftArea {float:left; width:43%;z-index:2;}

#container .about_intro .typoWrapper .leftArea h2 {font-size:50px; font-weight:200; color:#0163c6; line-height:1.05;position:relative;}
#container .about_intro .typoWrapper .leftArea h2:before {position:absolute;left:-30px;top:0px;width:20px;height:20px;border-radius:20px;background:#feae4a;content:'';} 
#container .about_intro .typoWrapper .leftArea h2 span {font-weight:700;position:relative;z-index:1;}
#container .about_intro .typoWrapper .leftArea h2 span:before {position:absolute;left:0px;content:'';height:10px;width:100%;background:#ffb04c;bottom:13px;mix-blend-mode: multiply;}
#container .about_intro .typoWrapper .leftArea h2 strong {font-weight:700;color:#f7f7f8;font-size:200px;position:relative;left:-200px;top:-80px;}

#container .about_intro .typoWrapper .leftArea_m h2 {font-size:50px; font-weight:200; color:#0163c6; line-height:1.05;position:relative;}
#container .about_intro .typoWrapper .leftArea_m h2:before {position:absolute;left:-30px;top:0px;width:20px;height:20px;border-radius:20px;background:#feae4a;content:'';} 
#container .about_intro .typoWrapper .leftArea_m h2 span {font-weight:700;position:relative;z-index:1;}
#container .about_intro .typoWrapper .leftArea_m h2 span:before {position:absolute;left:0px;content:'';height:10px;width:100%;background:#ffb04c;bottom:13px;mix-blend-mode: multiply;}
#container .about_intro .typoWrapper .leftArea_m h2 strong {font-weight:700;color:#f7f7f8;font-size:200px;position:relative;left:-200px;top:-80px;}

#container .about_intro .typoWrapper .rightArea {float:right; width:54%;height: 100%;position:relative;z-index:1;}
#container .about_intro .typoWrapper .rightArea .desc {float:right; width:55%; padding-right:5%; text-align:right}
#container .about_intro .typoWrapper .rightArea .desc h3 {font-size:25px; font-weight:normal; color:#000; margin-bottom:30px}
#container .about_intro .typoWrapper .rightArea .desc ul li {padding:4px 0; font-size:16px; color:#333}
#container .about_intro .typoWrapper .rightArea .desc .deco-bar {display:inline-block; width:27px; height:3px; margin:30px 0 25px 0; content:''; background:#3ebeb3}
#container .about_intro .typoWrapper .rightArea .desc p {font-size:16px; color:#333; line-height:1.875; letter-spacing:-0.07em}
#container .about_intro .typoWrapper .rightArea .img {float:right; width:45%}
#container .about_intro .typoWrapper .rightArea .img img {display:block; width:100%}
#container .about_intro .typoWrapper .rightArea .scroll-add {height:5000px;position:relative;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area {position:absolute;/*width:8658px;*/top:0px;font-size:0px;width: 100%; white-space: nowrap;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div {position:relative;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div {position:relative;width:auto;margin-bottom:50px;display:inline-block;margin-right:250px;vertical-align:top}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div img {box-shadow:10px 10px 13px 0 rgb(0 0 0 / 10%);}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div.img2 {top:160px;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div.img4 {top:160px;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div.img6 {top:300px;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div.img8 {top:160px;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div.img10 {top:160px;}
#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div.img12 {top:300px;}

#container .work-section {position:relative;width:100%;background:#f6f6f6;padding:220px 0px 150px;}
#container .work-section .bg-img-sec {position:absolute;right:-175px;top:-70px;}
#container .work-section .titleArea {position:relative;}
#container .work-section .titleArea h2 {font-size:50px; font-weight:200; color:#0163c6; line-height:1.05;position:relative;z-index:1;}
#container .work-section .titleArea h2 span {font-weight:700;position:relative;z-index:1;}
#container .work-section .titleArea h2 span:before {position:absolute;left:0px;content:'';height:10px;width:100%;background:#ffb04c;bottom:13px;mix-blend-mode: multiply;}
#container .work-section .titleArea h2 strong {font-weight:700;color:#fff;font-size:200px;position:absolute;left:-200px;top:-80px;z-index:-1;white-space: nowrap;}
#container .work-section .titleArea h3 {color:#2f2929;font-size:25px;font-weight:normal;padding-top:30px;position:relative;z-index:1;}
#container .work-section .titleArea h4 {color:#666;font-size:19px;font-family:'notokr';font-weight:normal;padding-top:20px;position:relative;z-index:1;}
#container .work-section .conArea {position:relative;margin-top:60px;}
#container .work-section .conArea ul {font-size:0px;}
#container .work-section .conArea ul li {display:inline-block;width:350px;height:230px;margin-right:60px;border-radius:30px;}
#container .work-section .conArea ul li:last-child {margin:0px;}
#container .work-section .conArea ul li h2 {color:#ffe84c;font-size:17px;font-weight:normal;padding-top:60px;padding-left:50px;}
#container .work-section .conArea ul li span {color:#fff;font-size:23px;padding-left:50px;display:inline-block;padding-top:30px;}
#container .work-section .conArea ul li.img1 {background:url('../img/work_section_bg11.png') no-repeat center top;background-size:cover;}
#container .work-section .conArea ul li.img2 {background:url('../img/work_section_bg22.png') no-repeat center top;background-size:cover;position:relative;top:50px;}
#container .work-section .conArea ul li.img3 {background:url('../img/work_section_bg33.png') no-repeat center top;background-size:cover;}
#container .work-section .conArea ul li.img4 {background:url('../img/work_section_bg44.png') no-repeat center top;background-size:cover;position:relative;top:50px;}

/* ====================================
 * our work *
==================================== */

/* policy section */
#container .work_policy {padding:220px 0px 0px;}
#container .work_policy .summary {margin-top:-105px}
#container .work_policy .summary .title {float:left; width:43%; z-index:1;}
#container .work_policy .summary .title h2 {font-size:50px;font-weight:200; color:#0163c6; line-height:1.05;position:relative;z-index:1;position:relative;}
#container .work_policy .summary .title h2:before {position:absolute;left:-30px;top:0px;width:20px;height:20px;border-radius:20px;background:#feae4a;content:'';} 
#container .work_policy .summary .title h2 span {font-weight:700;position:relative;z-index:1;}
#container .work_policy .summary .title h2 span:before {position:absolute;left:0px;content:'';height:10px;width:100%;background:#ffb04c;bottom:13px;mix-blend-mode: multiply;}
#container .work_policy .summary .title h2 strong {font-weight:700;color:#f6f6f6;font-size:200px;position:absolute;left:-250px;top:0px;z-index:-1;text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff;}
#container .work_policy .summary .solution-box {float:right; width:54%; height: 100%;position:relative;z-index:1;}
#container .work_policy .summary .solution-box p {font-size:25px; color:#2f2929; line-height:1.875; margin-bottom:20px}
#container .work_policy .summary .solution-box span {font-size:19px;color:#666;font-family:'notokr';margin-bottom:20px;display:inline-block;}
#container .work_policy .process {margin:100px -15px 60px -15px}
#container .work_policy .process > li {float:left;position:relative; width:48%; background:#fff;box-shadow: 1px 1px 13px 0 rgb(0 0 0 / 20%);margin-right:4%;border-radius:30px;margin-bottom:60px;height:260px;}
#container .work_policy .process > li:nth-child(2) {margin-right:0px;}

#container .work_policy .process > li:last-child {margin-right:0px;}
#container .work_policy .process > li h2 {position:absolute; font-family:'Montserrat'; font-size:23px;width:100px;height:100px;border-radius:100px;background:#0163c6; font-weight:600; color:#ffe84c; margin-bottom:30px; padding-bottom:25px;text-align:center;padding-top:35px;left:50px;top:75px;transition:all .15s ease-out}

#container .work_policy .process > li .conArea {padding-top:50px;padding-left:195px;transition:all .15s ease-out}
#container .work_policy .process > li:nth-child(3) .conArea {padding-top:40px;}
#container .work_policy .process > li h3 {font-size:28px; font-weight:normal; color:#333; margin-bottom:15px}
#container .work_policy .process > li h4 {font-size:17px; color:#0163c6; margin-bottom:15px}
#container .work_policy .process > li p {font-size:18px; color:#666; line-height:1.875;font-family:'notokr';}
#container .work_policy .more-btn {text-align:center;position:relative;}
#container .work_policy .more-btn h1 {font-size:30px;color:#0163c6;display:inline-block;margin-right:20px;}
#container .work_policy .more-btn h1 span {color:#333;}
#container .work_policy .more-btn p {width:70px;height:70px;border-radius:70px;background:#feaf4b;text-align:center;display:inline-block;}
#container .work_policy .more-btn p i {font-size:20px;color:#fff;padding-top:25px;}

/* portfolio section */
#container .work_portfolio {padding:140px 0 200px 0;}
#container .work_portfolio .title h2 {font-weight:700;color:#f6f6f6;font-size:200px;position:absolute;left:37px;top:-150px;text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff;}

#container .work_portfolio .workWrapper > li {position:relative; float:left; width:23.5%; padding:0 0px; margin-bottom:90px;margin-right:2%;height:460px;}
#container .work_portfolio .workWrapper > li:nth-child(4n) {margin-right:0px;}
#container .work_portfolio .workWrapper > li .thumb {box-shadow:3px 3px 3px 0 rgba(0, 0, 0, .04);border-radius:30px;position:relative;}
#container .work_portfolio .workWrapper > li .thumb:before {
background: -webkit-gradient(linear, left bottom, left top, from(#004d9b), to(transparent));
background: -webkit-linear-gradient(bottom, #004d9b, transparent);
background: -o-linear-gradient(bottom, #004d9b, transparent);
background: linear-gradient(to top, #004d9b, transparent);
/*background:rgba(0,77,155,0.9);*/
content:'';width:100%;height:100%;position:absolute;left:0px;top:0px;border-radius:30px;opacity:0;transition:all .2s ease}
#container .work_portfolio .workWrapper > li:hover .thumb:before {opacity:1;}
#container .work_portfolio .workWrapper > li .thumb:after {color:#fff;font-family:'xeicon';content:'\e9c5';width:100%;height:100%;position:absolute;text-align:center;top:50%;margin-top:-55px;font-size:50px;opacity:0;transition:all .2s ease;z-index:0;}
#container .work_portfolio .workWrapper > li:hover .thumb:after {opacity:1;margin-top:-25px;}
#container .work_portfolio .workWrapper > li .thumb img {display:block; width:100%;border-radius:30px;}
#container .work_portfolio .workWrapper > li .title-box {/*position:absolute; bottom:-50px; */width:100%;z-index:0;position:relative;}
#container .work_portfolio .workWrapper > li .title-box a {display:block; width:100%; height:100%}
#container .work_portfolio .workWrapper > li .title-box a .info {padding:20px; text-align:center;}
#container .work_portfolio .workWrapper > li .title-box a .info h3 {font-size:22px; font-weight:normal; color:#2f2929; margin-bottom:10px}
#container .work_portfolio .workWrapper > li .title-box a .info p {font-size:14px; color:#2f2929; letter-spacing:-0.5px}
#container .work_portfolio .workWrapper > li .title-box a .button {position:relative; padding:15px 20px; background:#3ebeb3;display:none;}
#container .work_portfolio .workWrapper > li .title-box a .button:before {position:absolute; top:0; left:0; width:0; height:100%; content:''; background:#333; transition:all .15s ease-out}
#container .work_portfolio .workWrapper > li .title-box:hover a .button:before {width:100%}
#container .work_portfolio .workWrapper > li .title-box a .button:after {clear:both; display:block; content:''}
#container .work_portfolio .workWrapper > li .title-box a .button span {position:relative; float:left; font-size:14px; /*font-weight:600;*/ color:#fff; z-index:5}
#container .work_portfolio .workWrapper > li .title-box a .button i {position:relative; float:right; font-size:16px; font-weight:600; color:#fff; z-index:5}


#container .portfolio .workWrapper_new > li:hover .thumb:after {opacity:1;margin-top:-25px;}
#container .portfolio .workWrapper_new > li .thumb img {display:block;width:100%;border-radius:30px;}
#container .portfolio .workWrapper_new > li .title-box {position:relative;}
#container .portfolio .workWrapper_new > li .title-box a {display:block; width:100%; height:100%}
#container .portfolio .workWrapper_new > li .title-box a .info {padding:0px;margin-top:40px;text-align:center;}


/* ====================================
 * inquiry *
==================================== */
/* inquiry section */
#container .inquiry {padding:140px 0 200px 0; background:#000}
#container .inquiry .inner_tit {color:#eee}
#container .inquiry .leftArea {float:left; width:48%}
#container .inquiry .leftArea .infoList {margin:30px 0 40px 0}
#container .inquiry .leftArea .infoList li {position:relative; font-size:16px; color:#fff; padding:5px 0 5px 30px}
#container .inquiry .leftArea .infoList li a {color:#fff}
#container .inquiry .leftArea .infoList li:before {position:absolute; top:50%; left:0; margin-top:-9px; font-family:'Pe-icon-7-stroke'; font-size:18px}
#container .inquiry .leftArea .infoList li.icon1:before {content:'\e638'}
#container .inquiry .leftArea .infoList li.icon2:before {content:'\e63b'}
#container .inquiry .leftArea .infoList li.icon3:before {content:'\e670'}
#container #map img {display:block; width:100%}
#container .inquiry .rightArea {float:right; width:48%}
#container .inquiry .rightArea .fieldList {margin-top:45px}
#container .inquiry .rightArea .fieldList li {margin-bottom:10px}
#container .inquiry .rightArea .fieldList li input[type=text] {width:100%; height:45px; padding-left:20px; font-size:16px; color:#343434; border:none; border-radius:6px; background:#f0f0f0}
#container .inquiry .rightArea .fieldList li input[type=file] {width:100%; height:30px; color:#eee}
#container .inquiry .rightArea .fieldList li textarea {width:100%; height:125px; padding:20px; font-size:16px; color:#343434; border:none; border-radius:6px; background:#f0f0f0}
#container .inquiry .rightArea .fieldList li .selectbox {position:relative}
#container .inquiry .rightArea .fieldList li .selectbox > a {position:relative; display:block; width:100%; height:45px; padding-left:20px; font-size:16px; color:#999; line-height:45px; border:none; border-radius:6px; background:#f0f0f0}

#container .inquiry .rightArea .fieldList li .selectbox > a:after {position:absolute; top:50%; right:20px; font-family:'xeicon'; font-size:18px; color:#333; line-height:1; content:'\e941'; margin-top:-9px}
#container .inquiry .rightArea .fieldList li .selectbox > a.open:after {content:'\e944'}
#container .inquiry .rightArea .fieldList li .selectbox ul {display:none; position:absolute; top:50px; width:100%; border:1px solid #dedede; border-radius:6px; box-shadow:0 1px 2px rgba(0, 0, 0, .08); overflow:hidden; z-index:100}
#container .inquiry .rightArea .fieldList li .selectbox ul li {display:block; margin:0; padding:14px 20px; font-size:15px; color:#666; border-top:1px solid rgba(0, 0, 0, .12); background:#fff; cursor:pointer}
#container .inquiry .rightArea .fieldList li .selectbox ul li:first-child {border-top:none}
#container .inquiry .rightArea .fieldList li .selectbox ul li:hover {color:#333; background:#f4f4f4}
#container .inquiry .rightArea .btnArea {margin-top:30px}
#container .inquiry .rightArea .btnArea .btn {border:none !important}
#container .inquiry .rightArea .btnArea .btn-black-o {width:300px; color:#fff !important; border-radius:0; background:#3ebeb3 !important}
#container .inquiry .rightArea .btnArea .btn-black-o:hover {background:#52a59e !important}


/* ====================================
 * board common *
==================================== */ 
#board-nav {display:none}

/* ====================================
 * media query *
==================================== */
@media screen and (min-width:1700px) {
.innerContainer {position:relative; max-width:1700px;}
}
@media screen and (max-width:1700px) {
#container .work-section .conArea ul li {width:23.5%;margin-right:2%;}

}
@media screen and (max-width:1400px) {
#container .work_policy .process > li .conArea {padding-left:55px;}
#container .work_policy .process > li h2 {left:-30px;top:-50px;}
#container .work_portfolio .workWrapper > li {height:440px;width:32%;}
#container .work_portfolio .workWrapper > li:nth-child(4n) {margin-right:2%;}
#container .work_portfolio .workWrapper > li:nth-child(3n) {margin-right:0px;}
}
@media screen and (min-width:1025px) {
	/* about us */
	#container .about_rule .title-box {min-width:285px}
	#container .about_photo .gridWrapper .inner:hover .overlay {/*bottom:0; */opacity:1}

	/* our work */
	/*#container .work_portfolio .workWrapper > li:nth-child(3n-2) .title-box {left:0}
	#container .work_portfolio .workWrapper > li:nth-child(3n-1) .title-box {left:50%; margin-left:-30%}
	#container .work_portfolio .workWrapper > li:nth-child(3n) .title-box {right:0}*/
}

@media screen and (max-width:1024px) {
	/* sub cover */
	#subCover {margin-top:50px;padding:170px 0px;}
	#subCover .typo {width:100%; padding:0 50px}
	#subCover .typo h2 {font-size:42px}
	#subCover .typo h2:before {bottom:14px;}
	#subCover .typo span.aniTxt {font-size:140px;}
	#subCover .typo span.aniTxt2 {font-size:140px;}
	#subCover .typo span.aniTxt3 {font-size:140px;}

	/* about us */
	#container .about_rule .title-box {width:30%; padding:30px}
	#container .about_rule .title-box p {font-size:45px}
	#container .about_rule ul {width:65%}
	#container .about_rule ul > li .desc p {font-size:18px}
	#container .about_rule ul > li .desc p br {display:none}

	#container .about_intro .box-list li p {font-size:16px; padding-top:40px}
	#container .about_intro .box-list li p i {font-size:65px}
	#container .about_intro .box-list li p br {display:none}

	/*#container .about_intro .typoWrapper .leftArea h2 {font-size:40px}*/
	#container .about_intro .typoWrapper .leftArea_m h2 {font-size:40px}
	#container .about_intro .typoWrapper .rightArea .desc {float:none; width:100%; text-align:left; padding:0}
	#container .about_intro .typoWrapper .rightArea .img {float:none; width:100%; margin-bottom:30px}
	/*#container .about_intro .typoWrapper .rightArea .scroll_img_area {position:relative;}
	#container .about_intro .typoWrapper .rightArea .scroll-add {height:auto;}*/
	#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div {display:block;;top:0px !important;margin-right:0px !important;}
	#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div img {width:100%;}
	#container .about_intro .typoWrapper .rightArea_m .scroll_img_area_m > div > div {display:block;;top:0px !important;margin-right:0px !important;}
	#container .about_intro .typoWrapper .rightArea_m .scroll_img_area_m > div > div img {width:100%;}
	
	#container .work-section .titleArea h2 {font-size:40px;}
	#container .work-section .conArea ul li {width:49%;margin-bottom:20px;}
	#container .work-section .conArea ul li:nth-child(2) {margin-right:0px;}
	#container .work-section .conArea ul li.img2 {top:0px;}
	#container .work-section .conArea ul li.img4 {top:0px;}

	/* our work */
	#container .work_policy .summary .title {float:none; width:100%; margin-bottom:50px; padding-top:48px; text-align:center}
	#container .work_policy .summary .title h2:before {left:50%;margin-left:-10px;top:-40px;}
	#container .work_policy .summary .title h2 strong {font-size:100px;left:50%;margin-left:-215px;top:90px;}
	#container .work_policy .summary .solution-box {float:none; width:100%; padding:50px;text-align:center;}
	
	#container .work_policy .process {}
	#container .work_policy .process > li {width:100%;padding-right:50px;}
	#container .work_policy .source-box {padding:40px}
	#container .work_policy .source-box h3 {padding-top:5px}

	#container .work_portfolio {padding:100px 0 140px 0}
	#container .work_portfolio .title h2 {font-size:100px;position:absolute;left:37px;top:-80px;text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff;}

	#container .work_portfolio .workWrapper > li {width:49%;margin-bottom:30px; padding:0 10px;height:auto;}
	#container .work_portfolio .workWrapper > li:nth-child(4n) {margin-right:0px;}
	#container .work_portfolio .workWrapper > li:nth-child(3n) {margin-right:2%;}
	#container .work_portfolio .workWrapper > li:nth-child(even) {margin-right:0px;}
	#container .work_portfolio .workWrapper > li .title-box {bottom:-10px}
	#container .work_portfolio .workWrapper > li:nth-child(2n-1) .title-box {left:0 !important}
	#container .work_portfolio .workWrapper > li:nth-child(2n) .title-box {right:0 !important}
	#container .work_portfolio .workWrapper > li .title-box a .info {padding:20px}
	#container .work_portfolio .workWrapper > li .title-box a .info h3 {font-size:21px}
	#container .work_portfolio .workWrapper > li .title-box a .button {padding:20px}

	/* inquiry */
	#container .inquiry {padding:100px 0 140px 0}
	#container .inquiry .rightArea .btnArea .btn-black-o {width:auto}
}

@media screen and (max-width:768px) {
	/* sub cover */
	#subCover {padding:100px 0}
	#subCover.wideBtm {padding-bottom:160px}
	#subCover .typo {padding:0 20px}
	#subCover .typo h2 {font-size:28px;}
	#subCover .typo h2:before {height:5px;bottom:9px;}
	#subCover .typo h2 br {display:none}
	#subCover .typo p {font-size:16px}
	#subCover .typo p br {display:none}

	/* common */
	.innerContainer {padding:0 20px}
	#container h2.inner_tit {font-size:32px}

	/* about us */
	#container .about_rule {padding:80px 0 80px 0}
	#container .about_rule .title-box {float:none; min-width:260px; height:auto; margin-bottom:50px}
	#container .about_rule .title-box p {font-size:36px;transform:none;top:0px;}
	
	#container .about_rule ul {float:none; width:100%}
	#container .about_rule ul > li .num {width:18%}
	#container .about_rule ul > li .num h3 {font-size:20px}
	#container .about_rule ul > li .num:after {left:12px;}
	#container .about_rule ul > li .desc {width:81%}
	#container .about_rule ul > li .desc h4 {font-size:18px; margin-bottom:20px}
	#container .about_rule ul > li .desc p {font-size:15px}
	
	#container .about_intro {padding:110px 0px 100px;}
	#container .about_intro .bg-img {left:-160px;top:-300px;}
	#container .about_intro .bg-img > img {width:50%;}
	#container .about_intro .box-list li h3 {font-size:18px;}
	#container .about_intro .box-list li {float:none; width:100%; height:auto; padding-top:20px; padding-bottom:20px;margin-bottom:20px;}
	#container .about_intro .box-list li p {font-size:15px; padding-top:20px}
	#container .about_intro .box-list li i {font-size:40px; margin-bottom:20px !important}

	#container .about_intro .typoWrapper {margin:0px 0}
	/*#container .about_intro .typoWrapper .leftArea {float:none; width:100%; margin-bottom:20px}
	#container .about_intro .typoWrapper .leftArea h2 {font-size:38px; line-height:1.15;z-index:1;display:inline-block;}
	#container .about_intro .typoWrapper .leftArea h2:before {left:auto;right:0px;}
	#container .about_intro .typoWrapper .leftArea h2 strong {font-size:100px;position:absolute;left:0px;top:60px;z-index:-1;}*/
	
	#container .about_intro .typoWrapper .leftArea_m {float:none; width:100%; margin-bottom:20px}
	#container .about_intro .typoWrapper .leftArea_m h2 {font-size:38px; line-height:1.15;z-index:1;display:inline-block;}
	#container .about_intro .typoWrapper .leftArea_m h2:before {left:auto;right:0px;}
	#container .about_intro .typoWrapper .leftArea_m h2 strong {font-size:100px;position:absolute;left:0px;top:60px;z-index:-1;}
	
	#container .about_intro .typoWrapper .rightArea {float:none; width:100%}
	#container .about_intro .typoWrapper .rightArea .desc h3 {font-size:15px; margin-bottom:20px}
	#container .about_intro .typoWrapper .rightArea .desc ul li {font-size:13px}
	#container .about_intro .typoWrapper .rightArea .desc .deco-bar {margin:20px 0 15px 0}
	#container .about_intro .typoWrapper .rightArea .desc p {font-size:13px; text-align:justify}
	#container .about_intro .typoWrapper .rightArea .desc p br {display:none}
	#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div {display:block;}
	#container .about_intro .typoWrapper .rightArea .scroll_img_area > div > div img {width:100%;}
	#container .about_intro .typoWrapper .rightArea .scroll-add {}

	#container .work-section {padding:110px 0px 100px;}
	#container .work-section .titleArea h2 {font-size:38px;}
	#container .work-section .titleArea h3 {font-size:18px;}
	#container .work-section .titleArea h2 strong {font-size:50px;left:-10px;top:-35px;}
	#container .work-section .titleArea h4 {font-size:15px;}
	#container .work-section .conArea ul li h2 {text-align:center;padding-left:0px;display:block;font-size:14px;}
	#container .work-section .conArea ul li span {text-align:center;padding-left:0px;display:block;font-size:17px;}

	/* our work */
	#container .work_policy {/*padding-bottom:80px*/}
	#container .work_policy .summary {margin-top:-86px}
	#container .work_policy .summary .title h2 {font-size:38px}
	#container .work_policy .summary .title h3 {font-size:18px}
	#container .work_policy .summary .solution-box {padding:30px}
	#container .work_policy .summary .solution-box p {font-size:18px}
	#container .work_policy .summary .solution-box span {font-size:15px}
	#container .work_policy .summary .solution-box p br {display:none}
	#container .work_policy .summary .solution-box ul li {margin-bottom:10px}
	#container .work_policy .summary .solution-box ul li.sol_sir img {max-width:50px !important}
	#container .work_policy .process {margin:40px 0}
	#container .work_policy .process > li {width:100%; margin-bottom:40px;height:auto;padding:30px;}
	#container .work_policy .process > li .conArea {padding-left:0px;padding-top:20px;}
	#container .work_policy .process > li h2 {font-size:18px; margin-bottom:20px; padding-bottom:20px;width:60px;height:60px;padding-top:20px;left:-10px;top:-10px;}
	#container .work_policy .process > li h2:before, #container .work_policy .process > li h2:after {display:none}
	#container .work_policy .process > li h3 {font-size:18px; margin-bottom:10px}
	#container .work_policy .process > li h4 {font-size:15px; margin-bottom:20px}
	#container .work_policy .process > li p {font-size:15px}
	#container .work_policy .process > li p br {display:none}
	#container .work_policy .more-btn h1 {font-size:20px;}
	#container .work_policy .more-btn p {width:40px;height:40px;}
	#container .work_policy .more-btn p i {padding-top:10px;}

	#container .work_portfolio {padding:80px 0}
	#container .work_portfolio .workWrapper > li {width:100%}
	#container .work_portfolio .workWrapper > li .title-box {bottom:-10px}
	#container .work_portfolio .workWrapper > li .title-box a .info h3 {font-size:15px}
	#container .work_portfolio .workWrapper > li .title-box a .info p {font-size:12px}
	#container .work_portfolio .workWrapper > li .title-box a .button {padding:20px}
	#container .work_portfolio .workWrapper > li .title-box a .button span {font-size:13px}

	/* inquiry */
	#container .inquiry {padding:80px 0}
	#container .inquiry .leftArea {float:none; width:100%; margin-bottom:30px}
	#container .inquiry .leftArea .infoList {margin:20px 0 30px 0}
	#container .inquiry .leftArea .infoList li {font-size:13px}
	#container .inquiry .rightArea {float:none; width:100%}

	#container .inquiry .rightArea .fieldList li input[type=text] {font-size:13px; border-radius:3px}
	#container .inquiry .rightArea .fieldList li textarea {font-size:13px; border-radius:3px}
	#container .inquiry .rightArea .fieldList li .selectbox > a {font-size:13px}
	#container .inquiry .rightArea .fieldList li .selectbox ul li {font-size:13px}
	#container .inquiry .rightArea .btnArea {text-align:center}
	#container .inquiry .rightArea .btnArea .btn {font-size:13px; margin:0}
}