
header{
	background:url(/assets/kr/images/technology/tech_bg.png) no-repeat center / cover;
}

.container{
	width:100%;
	height:max-content;
	max-width:1200px;
	margin:0 auto 50px;
}

.container .headtxt{
	width:100%;
	padding-top: 80px;
	padding-bottom:60px;
}

.container .headtxt img{
	width:720px;
	height:55px;
	padding:50px 240px 0;
}

.container .headtxt .title{
	font-size:25px;
	font-weight:700;
}

.container .headtxt .sub{
	padding-top:10px;
	font-size:16px;
	line-height:23px;
}
.m_title{
	width: 150px;
	height: 50px;
	border-radius: 0 20px 0 20px;
	background-color: #10d6af;
	margin-bottom: 40px;
	font-size: 18px;
	color: white;
	text-align: center;
	line-height: 50px;
	font-weight: 500;
}
.container{
	width:100%;
	height:700px;
	padding-top:40px;
	display: table;
}
.color{
	background-color: #3bd999;
	margin-top: 65px;
}
.color2{
	background-color: #5fda82;
	margin-top: 65px;
}
.color3{
	background-color: #7edc76;
	margin-top: 65px;
}
.color4{
	background-color: #acdd5a;
	margin-top: 65px;
}
.space{
	margin-right: 15px;
	margin-bottom: 15px;
}
#project{ 
	width:100%; 
	max-width: 1200px;
	height:700px;
}
.project02{ 
	height:350px!important;
}
#project .machine{ 
	width: 46%;
	float: left;
	margin:1%; 
	position: relative;
}
#project .machine .m_detail{ 
	position: absolute;
	width: 200px;
	height: 50px;
	background-color: black;
	opacity: 0.8;
	border-radius: 0 20px 0 20px;
	font-size: 20px;
	color: white;
	text-align: center;
	line-height: 50px;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	display: none;
}
#project .machine img{
	width: 100%; 
}


#project .machine:hover .m_detail{ 
	display: block;
}


.license_box{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}
.license_box > .license{
	width: 50%;
	height: max-content;
	float: left;
}


/*반응형*/

@media (min-width: 1025px) and (max-width: 1280px) {

.license_box > .license > img{
    width: 90%;
    
}
#project02_in .project02_img {
    z-index: 99;
    cursor: pointer;
    width: 49%;
}
#project {
    width: 100%;
    max-width: 1200px;
    height: 500px;
}
.project02 {
    height: 250px!important;
}
}


@media (min-width: 768px) and (max-width: 1024px) {
.license_box > .license > img{
    width: 100%;
    
}
#project02_in .project02_img {
    width: 100%;
}
.space {
    margin-right: 0px;
    margin-bottom: 15px;
}
.space2 {
    margin-bottom: 15px;
}
#project .machine {
    width: 96%;
    float: left;
    margin: 2%;
    position: relative;
}
.color {
    background-color: #3bd999;
    margin-top: 600px;
}
.color2 {
    background-color: #5fda82;
    margin-top: 550px;
}
.color3 {
    background-color: #7edc76;
    margin-top: 550px;
}
.color4 {
    background-color: #acdd5a;
    margin-top: 1000px;
}
}


@media (min-width: 481px) and (max-width: 767px) {
.license_box > .license{
	width: 100%;
}
.license_box > .license > img{
    width: 90%;
    
}

#project .machine {
    width: 96%;
    float: left;
    margin: 2%;
    position: relative;
}
.color {
    background-color: #3bd999;
    margin-top: 150px;
}
.color2 {
    background-color: #5fda82;
    margin-top: 240px;
}
.color3 {
    background-color: #7edc76;
    margin-top: 240px;
}
.color4 {
    background-color: #acdd5a;
    margin-top: 430px;
}
.m_title {
    width: 140px;
    height: 45px;
    border-radius: 0 20px 0 20px;
    background-color: #10d6af;
    margin-bottom: 20px;
    font-size: 16px;
    color: white;
    text-align: center;
    line-height: 45px;
}


}


@media (min-width: 320px) and (max-width: 480px) {
.container .headtxt {
    width: 100%;
    padding-top: 30px;
    padding-bottom: 60px;
}
.container .headtxt .sub {
    font-size: 14px;
}
.license_box > .license{
	padding-bottom: 20px;
	width: 100%;
}
.license_box > .license > img{
    width: 100%;
    
}
#project {
    width: 100%;
    max-width: 1200px;
    height: 430px;
}
.project02 {
    height: 160px!important;
}
#project .machine {
    width: 96%;
    float: left;
    margin: 2%;
    position: relative;
}
.color {
    background-color: #3bd999;
    margin-top: 150px;
}
.color2 {
    background-color: #5fda82;
    margin-top: 240px;
}
.color3 {
    background-color: #7edc76;
    margin-top: 240px;
}
.color4 {
    background-color: #acdd5a;
    margin-top: 330px;
}
.m_title {
    width: 140px;
    height: 45px;
    border-radius: 0 20px 0 20px;
    background-color: #10d6af;
    margin-bottom: 20px;
    font-size: 16px;
    color: white;
    text-align: center;
    line-height: 45px;
}


}

