 /* ============= 
ºê·£µå css ÆÄÀÏÀÔ´Ï´Ù.
 * ============*/


.bland_01{width:100%;background: url(../../img/dmedi/idea-bg.jpg) no-repeat center;background-size: cover;}
.bland_01 .inner {max-width:1350px;margin:0 auto}
.row {display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;    margin: 0 0.5%;}
.leftview{    flex: 0 0 36%; max-width: 36%;    padding: 5% 0 0 4%;}
.textb1{    color: #46c2f6;    font-size: 20px;    line-height: 180%;    font-weight: 400; }
.textb2{    color: #fff;    font-size: 50px;    line-height: 120%;    font-weight: bold; }
.textb3{    color: rgba(255,255,255,0.8);    font-size: 16px;    line-height: 150%;    font-weight:400;    padding: 10% 0;}
.bland_01 .more a{text-decoration: none; color: rgba(255,255,255,0.8); font-size: 18px; line-height: 180%; font-weight:600;    display: inline-block;    padding-bottom: 1%;    margin: 0 0 0 0; position: relative; text-decoration: none; text-transform: uppercase; }
.bland_01 .more a:after {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #fff;
  content: '';
  opacity: 0;
  -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
  transition: height 0.3s, opacity 0.3s, transform 0.3s;
  -webkit-transform: translateY(-10px);
  -moz-transform: translateY(-10px);
  transform: translateY(-10px);
}




.bland_01 .more a:hover:after, .bland_01 .more a:focus:after {
  height: 1px;
  opacity: 1;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  transform: translateY(0px);
}


.business{margin-top: 100px;position: relative;display:block;transition-delay: 1s;width: 100%;text-align: center;}
.business ul{display: inline-flex;position: relative;z-index: 1;}
.business li{transition: 0.5s;}
.business li ~ li{border-left: 1px solid rgba(255,255,255,0.1);}
.business li a{display: block;text-align: center;position: relative;}
.business li a:hover{background-color: rgba(0,0,0,0.15);transition: 0.3s;transition-delay: 0.1s;}
.business li a::before{content: "";width: 20px;height: 9px;background: url(../../img/dmedi/wh-arr.png) no-repeat center;background-size: contain;position: absolute;left: 50%;bottom: 30px;margin-left: -50px;opacity: 0;transition: 0.3s;transition-delay: 0.1s;}
.business li a > div{display: flex;align-items: center;justify-content: center;width: 190px;height: 230px;}
.business li a p{padding-top: 85px;background-repeat: no-repeat;background-position: center top;position: relative;z-index: 5;transition: 0.3s;}
.business li:nth-child(1){transition-delay: 1s;}
.business li:nth-child(2){transition-delay: 1.2s;}
.business li:nth-child(3){transition-delay: 1.4s;}
.business li:nth-child(1) a p{background-image: url(../../img/dmedi//business-icon1.png);}
.business li:nth-child(2) a p{background-image: url(../../img/dmedi/business-icon2.png);}
.business li:nth-child(3) a p{background-image: url(../../img/dmedi/business-icon3.png);}
.business li a p span{display: block;color: #153a4d;font-size: 0.75rem;}
.business li a p strong{display: block;padding-top: 15px;color: #fff;font-weight: 400;font-size:16px;}


.business li a:hover p{padding-bottom: 40px;}
.business li a:hover::before{opacity: 1;margin-left: -10px;}


.special{width:100%; overflow: hidden;float: left;}
.special li {display: inline-block; width: 47.5%;padding: 20% 1% 1%;}
.special li img{width:100%;}
.special li:first-child{padding-left:0%;}


.rightview{display: block; }
.rightview .imgview{     position: relative;  }




/* ============= 
* RESPONSIVE
* ============*/
@media screen and (max-width:3000px) {


.rightview img{max-width: 1200px; margin-left: 15%; }
}


@media (max-width: 1500px) { 
.business ul{width: 100%;}
.business ul li {width: 33.33%;}
.business li a > div {width: 100%;}
}




@media (max-width: 1024px) { 
#main_company .inner{ width: 100%; }


}




@media screen and (max-width:1050px) {
.textb1{ text-align:center }
.textb2{ font-size: 34px; text-align:center;    line-height: 1.5; }
.textb3{  text-align:center ;font-size: 16px ;padding: 5% 0;}
.bland_01 .more {border-bottom: 0px solid #000;    display: block;    padding-bottom: 1%;  text-align:center ;   margin-top: 10%;}




.special li {width:49.3%;padding: 20% 0.5% 1% 0.5%;}
.special li:last-child{padding-right:0%;}


.leftview{flex: 0 0 100%; max-width: 100%;padding:15% 0 0;}




.rightview img{max-width: 100%; margin-left:0%; }


}








@media screen and (min-width:1050px) {


.col8{ flex: 0 0 60%; max-width: 60%;}


}






@media screen and (max-width:881px) {


.special li {width:49.2%;padding: 20% 0.5% 1% 0;}
}




@media (max-width: 640px) { 
.textb2{ font-size: 28px;  }
.textb3{font-size: 14px ;padding: 5% 0 2%;    width: 80%;    margin: 0 auto;}
.business{margin: 12% 0 0;}
}