@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');

div.business{ padding:0 ; clear:both; overflow:hidden; width:100%; padding: 0 0 100px 210px; letter-spacing:-0.5px}
div.business img{max-width:100%; vertical-align:top;}
.field {/*font-size:115px; line-height:105px; color:#f1f3e8; clear:both; font-family: 'Montserrat', sans-serif; 
letter-spacing:-3px; margin-left:-12px; */ padding: 0 0 0px 210px;}
.field img {max-width:100%; vertical-align:top; padding-top:3px;}
div.business .floatL {width:50%; float:left; padding-right:50px}
div.business .floatR {width:50%; float:left; padding-right:50px; padding-top:30px;}
div.business .head .txt01 {font-size:38px; line-height:52px; font-weight:600; padding-top:50px; font-family: 'Pretendard-Bold';}
div.business .head .txt02{font-size:20px; padding-top:30px; font-weight:500; width:100%; color:#a0a0a0;}
div.business .item {padding-top:60px; /*max-width:635px;*/ float:left; width:50%;}
div.business .item02 {padding-top:0; margin-top:-90px;}
div.business .item02,div.business .item03 {float:right; width:50%;}
div.business .item03 {padding-top:130px}
div.business .item04 {padding-top:150px}
div.business .item .img {position:relative; }
div.business .item .img a {float:left;  /*width:92%;*/ position:relative; }
div.business .item .img a:before {content:""; background-color:rgba(0,0,0,0); position:absolute; top:0; left:0; opacity:0;
 width:100%; height:100%; z-index: 99; transition:all 0.3s; background-image:url(../img/more.png); background-repeat:no-repeat; background-position:center;}
div.business .item .img a:hover:before {content:""; background-color:rgba(0,0,0,0.5); position:absolute; top:0; left:0; opacity:0.8;
 width:100%; height:100%; z-index: 99; transition:all 0.3s; background-image:url(../img/more.png); background-repeat:no-repeat; background-position:center;}
div.business .item .img span {font-family: 'Montserrat', sans-serif; writing-mode:vertical-rl; float:left; 
color:#b3c05b; font-size:18px; font-weight:500; padding-left:20px;}
div.business .item .tit {clear:both; font-size:40px; font-weight:600; padding:20px 0 10px 0; font-family: 'Pretendard-Bold';}
div.business .item .txt {clear:both; font-size:20px; font-weight:500; color:#a0a0a0;}

/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1500px) {
div.business {width: 100%; padding:0px 0 100px 110px ; }
}
@media (max-width: 1400px) {
div.business {width: 100%; padding:0px 0 80px 60px ; }
div.business .item .img a {width:90%; }
}

@media (max-width: 1023px) {
div.business {width: 100%; padding:0px 20px 60px 20px ; }
div.business .item .img img{  width:80%;}
div.business .item .img a {width:100%; }
.field {/*font-size:58px; line-height:55px; letter-spacing:-3px; margin-left:-12px;*/ padding:0px 0px 0px 0px ; }

div.business .floatL {width:100%; float:none; padding-right:0px}
div.business .floatR {width:100%; float:none; padding-right:0px; padding-top:0px;}
div.business .head .txt01 {font-size:25px; line-height:32px;padding-top:30px; letter-spacing: -1px;}
div.business .head .txt02{font-size:16px; color:#888; padding-top:20px; font-weight:500;}
div.business .head .txt02 span {display:block}
div.business .item {padding-top:50px; max-width:100%;}
div.business .item {padding-top:60px;float:none; width:auto;}
div.business .item02,div.business .item03 {float:none; width:100%;}
div.business .item02 {padding-top:0; margin-top:0px;}
div.business .item .img a:hover:before {display:none ;}
div.business .item .img span {position:absolute; right:0;}
div.business .item02 .img span,
div.business .item04 .img span {position:absolute; right:auto; left:0 !important; padding:0;}

div.business .item02 .img img,
div.business .item04 .img img{float:right;}
div.business .item03 .img span,
div.business .item04 .img span {float:left;}
div.business .item02 {padding-top:60px}
div.business .item04 {padding-top:60px}
div.business .item .img img{  width:92%;}
div.business .item .img span { font-size:15px; font-weight:500;}
div.business .item02 .tit, div.business .item02 .txt,
div.business .item04 .tit, div.business .item04 .txt {padding-left:28px !important;}
div.business .item .tit {clear:both; font-size:26px; font-weight:600; padding:20px 0 10px 0;}
div.business .item .txt {clear:both; font-size:14px; font-weight:500;}

}
@media (max-width: 768px) {
}
@media (max-width: 640px) {
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}