@charset "UTF-8";
/*컨테이너 css 시작*/
.wrap .content {
	text-align: center;	
}
.wrap .bg {
	background-position: center 208px;
	background-repeat: no-repeat;	
    background-color:#a6bfd7;
    /* background-image: URL("/img/rnd/rnd_main.png"); */
}
.wrap .content-2{	
	height: 439px;
}
.content-2 .rnd-img img{
	width: 100%;
}
.wrap .ground-color{
	height: 66px;
    background: #d1dee8;
}
.content-2 .topic-top{
	width: 100%;
	padding-top: 120px;
	margin:0px auto;
}
.content-2 .topic-top-title{
    color: white;
    font-size: 30px;
    max-width: 100%;
    font-weight: bold;
    padding-bottom: 20px;
    line-height: 1.15;
    text-align: center;
}
.content-2 .topic-top-bar-main{
    background-color: white;
    width: 60px;
    height: 4px;
    margin: 0px auto;
}
/*컨테이너 가운데 정렬*/
@media only screen and (max-width: 340px) {
	.wrap .content-2{	
		height: 430px;
	}
	.content-2 .topic-top{
		width: 960px;
		padding-top: 226px;
	}
	.wrap .bg {		
		background-size: 320px 220px;	    
	}
	.content-2 .rnd-img img{
	    margin-top: 10%;
	}
}
@media only screen and (min-width: 341px) and (max-width: 480px) {
	.wrap .content-2{	
		height: 430px;
	}
	.content-2 .topic-top{		
		padding-top: 226px;
	}
	.wrap .bg {		
		background-size: 350px 220px;	    
	}
	.content-2 .rnd-img img{
       margin-top: 18%;
	}
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.content-2 .topic-top{		
		padding-top: 120px;
	}
	.wrap .bg {		
		background-size: 520px 457px;	    
	}		
	.wrap .content-2{	
		height: 365px;
	}
	.content-2 .rnd-img img{
	    height: 233px;
	}	
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.content-2 .topic-top{
		width: 960px;
		padding-top: 120px;
	}
	.wrap .content-2{	
		height: 433px;
	}
}
@media only screen and (min-width: 1201px) {
	.content-2 .topic-top{
		width: 960px;
		padding-top: 120px;
	}
	.wrap .content-2{	
		height: 439px;
	}	
}
/*----------컨테이너 가운데 정렬*/
.wrap .content-3 {
	background: #ffffff;		
}
.content-3 .topic-top{
	width: 100%;	
	margin:0px auto;
}
.content-3 .topic-top-title{
    color: black;
    font-size: 30px;
    max-width: 100%;
    font-weight: bold;
    padding-bottom: 20px;
    line-height: 1.15;
    text-align: center;
}
.content-3 .topic-top-bar02{
    background-color: black;
    width: 60px;
    height: 4px;
    margin:0px auto;
}
.content-3 .description{
	color: black;
    font-size: 18px;
    max-width: 100%;
    font-weight: 300;
    text-align: left;
    letter-spacing: -1px;
    word-spacing: 2px;
    line-height: 200%;
    padding-top: 40px;
    padding-bottom: 40px;   
}
@media only screen and (max-width: 340px) {
	.content-3 .topic-top{		
		padding-top: 40px;
	}		
}
@media only screen and (min-width: 341px) and (max-width: 480px) {
	.content-3 .topic-top{		
		padding-top: 40px;
	}	
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.content-3 .topic-top{		
		padding-top: 40px;
	}	
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.content-3 .topic-top{
		width: 960px;
		padding-top: 40px;
	}			
}
@media only screen and (min-width: 1201px) {
	.content-3 .topic-top{
		width: 960px;
		padding-top: 40px;
	}			
}
.wrap .content-4 {
	background: #eef1f7;		
}
.content-4 .topic-top{
	width: 100%;	
	margin:0px auto;
	padding-top: 40px;
	padding-bottom: 40px;
}
.content-4 .topic-top-title{
    color: black;
    font-size: 30px;
    max-width: 100%;
    font-weight: bold;
    padding-bottom: 20px;
    line-height: 1.15;
    text-align: center;
}
.content-4 .topic-top-bar02{
    background-color: black;
    width: 60px;
    height: 4px;
    margin:0px auto;   
}
@media only screen and (max-width: 340px) {
	.wrap .content-4 {
		height: 1040px;		
	}
	.content-4 .topic-top{		
		padding-top: 40px;
		padding-bottom: 40px;
	}	
}
@media only screen and (min-width: 341px) and (max-width: 480px) {
	.wrap .content-4 {
		height: 1040px;		
	}		
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.wrap .content-4 {
		height: 1000px;		
	}	
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.wrap .content-4 {
		height: 570px;		
	}
	.content-4 .topic-top{
		width: 960px;
		padding-top: 40px;
		padding-bottom: 40px;
	}
}
@media only screen and (min-width: 1201px) {
	.wrap .content-4 {
		height: 540px;		
	}
	.content-4 .topic-top{
		width: 960px;
		padding-top: 40px;
		padding-bottom: 40px;
	}	
}
.wrap .content-4 .card-list {
	padding-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	padding-bottom: 10px;
	text-align: center;
	font-weight: 500;
}
.wrap .content-4 .card {
	-webkit-border-radius: 5px;
	-webkit-background-clip: padding-box;
	-moz-border-radius: 5px;
	-moz-background-clip: padding;
	border-radius: 40px;
	background-clip: padding-box;
	background: white;
	position: relative;
	max-width: 420px;
	margin: 0 auto;
	margin-bottom: 18px;
}
.wrap .content-4 .card .title {
	text-align: center;
	padding-top: 20px;	
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;	
	-webkit-border-top-right-radius: 5px;
	-webkit-background-clip: padding-box;
	-moz-border-radius-topright: 5px;
	-moz-background-clip: padding;
	border-top-right-radius: 5px;
	background-clip: padding-box;
	color: #ffffff;
	border-top-left-radius: 40px;
    border-top-right-radius: 40px;
}
.wrap .content-4 .card .title-name{
	margin-top: 20px;
    margin-bottom: 20px;
}
.wrap .content-4 .card .title-name span{
	text-align: center;	
	color: #006cff;
}
.wrap .content-4 .card .body {	
	font-size: 13px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-background-clip: padding-box;
	-moz-border-radius-bottomright: 5px;
	-moz-background-clip: padding;
	border-bottom-right-radius: 5px;
	background-clip: padding-box;
}
.wrap .content-4 .card .body p {
	font-size: 15px;
	text-align: left;
    margin: 0px 10px 10px 13px;
    padding: 0px 20px 15px 20px;
    line-height: 1.30;
}
@media only screen and (max-width: 340px) {
	.wrap .content-4 .card-list {
		padding-top: 0px;
		padding-bottom: 40px;
	}	
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {	
	.wrap .content-4 .card-list {
		display: inline-block;
		overflow: auto;
		height: 500px;
		width: 980;
	}
	.wrap .content-4 .card {
		display: block;
		float: left;
		width: 240px;
		margin: 10px;
	    height: 370px;
	}
	.wrap .content-4 .card.active {
		z-index: 10;
		-webkit-transform: scale(1.2) translate(0px, -30px);
		-moz-transform: scale(1.2) translate(0px, -30px);
		-o-transform: scale(1.2) translate(0px, -30px);
		-ms-transform: scale(1.2) translate(0px, -30px);
		transform: scale(1.2) translate(0px, -30px);
	}			
}
@media only screen and (min-width: 1201px) {	
	.wrap .content-4 .card-list {
		display: inline-block;
		overflow: auto;
		height: 404px;
		width: 960px;
	}
	.wrap .content-4 .card {
		display: inline-table;		
		width: 270px;
		margin: 10px;
	    height: 350px;
	}
	.wrap .content-4 .card.active {
		z-index: 10;
		-webkit-transform: scale(1.2) translate(0px, -30px);
		-moz-transform: scale(1.2) translate(0px, -30px);
		-o-transform: scale(1.2) translate(0px, -30px);
		-ms-transform: scale(1.2) translate(0px, -30px);
		transform: scale(1.2) translate(0px, -30px);
	}	
}
.wrap .content-5 {
		
}
.content-5 .topic-top{
	width: 100%;	
	margin:0px auto;
	padding-top: 40px;
	padding-bottom: 40px;
}
.content-5 .topic-top-title{
    color: black;
    font-size: 30px;
    max-width: 100%;
    font-weight: bold;
    padding-bottom: 20px;
    line-height: 1.15;
    text-align: center;
}
.content-5 .topic-top-bar02{
    background-color: black;
    width: 60px;
    height: 4px;
    margin:0px auto;   
}
@media only screen and (max-width: 340px) {
	.wrap .content-5 {
		height: 950px;		
	}
	.content-5 .topic-top{		
		padding-top: 40px;
		padding-bottom: 40px;
	}	
}
@media only screen and (min-width: 341px) and (max-width: 480px) {
	.wrap .content-5 {
		height: 950px;		
	}		
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.wrap .content-5 {
		height: 1050px;		
	}	
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.wrap .content-5 {
		height: 550px;		
	}
	.content-5 .topic-top{
		width: 960px;
		padding-top: 40px;
		padding-bottom: 40px;
	}
}
@media only screen and (min-width: 1201px) {
	.wrap .content-5 {
		height: 600px;		
	}
	.content-5 .topic-top{
		width: 960px;
		padding-top: 40px;
		padding-bottom: 40px;
	}	
}
.content-5 .description-impect{	
	text-align: left;	
	display: inline-block;	
}
.content-5 .description-impect .description{
	font-weight: 800;
	font-size: 17px;	
}
.content-5 .description-impect .description span{
	font-size: 18px;
	color: #006cff;
	font-weight: 800;
    padding-bottom: 53px;
    padding-right: 10px;
    float: left;	
}
.content-5 .description-impect .impect-content{
	padding-left: 0px;
}
.content-5 .description-impect .content01{
	padding-bottom: 33px;
}
.content-5 .description-impect .content02{
	padding-bottom: 33px;
}
.content-5 .description-impect .content03{
	padding-bottom: 5px;
}
.content-5 .description-impect .content04{
	padding-bottom: 33px;
}
.content-5 .description-impect .content05{
		    
}
.content-5 .impect-character{
	
}
@media only screen and (max-width: 340px) {
	.content-5 .impect-character{
		width: 100%;
		margin: 0px auto;
	}
	.content-5 .impect-character img{
		width: 90%;
		margin: 0px auto;
	}
	.content-5 .description-impect .impect-content{
		padding-left: 30px;
	}
	.content-5 .description-impect .content01{
		padding-bottom: 19px;
	}
	.content-5 .description-impect .content02{
		padding-bottom: 19px;
	}
	.content-5 .description-impect .content03{
		padding-bottom: 17px;
	}
	.content-5 .description-impect .content04{
		padding-bottom: 35px;
	}
	.content-5 .description-impect .content05{
		padding-bottom: 35px;	    
	}
}
@media only screen and (min-width: 341px) and (max-width: 480px) {
	.content-5 .impect-character{
		width: 100%;
		margin: 0px auto;
	}
	.content-5 .impect-character img{
		width: 90%;
		margin: 0px auto;
	}
	.content-5 .description-impect .impect-content{
		padding-left: 0px;
	}
	.content-5 .description-impect .content01{
		padding-bottom: 9px;
	}
	.content-5 .description-impect .content02{
		padding-bottom: 5px;
	}
	.content-5 .description-impect .content03{
		padding-bottom: 17px;
	}
	.content-5 .description-impect .content04{
		padding-bottom: 35px;
	}
	.content-5 .description-impect .content05{
		padding-bottom: 35px;	    
	}
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.content-5 .impect-character{
		width: 100%;
		margin: 0px auto;
	}
	.content-5 .impect-character img{
		width: 80%;
		margin: 0px auto;
	}
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
	.content-5 .impect-character{
		margin-top: -55px;
	}
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.content-5 .description-impect{	
		text-align: left;	
		display: inline-block;	
	}
	.content-5 .impect-character{
		margin-top: -55px;
		display: inline-block;
		float: right;
	}
}
@media only screen and (min-width: 1201px) {
	.content-5 .description-impect{	
		text-align: left;	
		display: inline-block;	
	}
	.content-5 .impect-character{
		margin-top: 10px;
		display: inline-block;
		float: right;
	}
}
.wrap .content-6 {
    background: #eef1f7;
    height: 730px; 	
}
.content-6 .topic-top{
	width: 100%;	
	margin:0px auto;
	padding-top: 40px;
	padding-bottom: 40px;
}
.content-6 .topic-top-title{
    color: black;
    font-size: 30px;
    max-width: 100%;
    font-weight: bold;
    padding-bottom: 20px;
    line-height: 1.15;
    text-align: center;
}
.content-6 .topic-top-bar02{
    background-color: black;
    width: 60px;
    height: 4px;
    margin:0px auto;   
}
@media only screen and (max-width: 340px) {
	.wrap .content-6 {
		height: 1100px;		
	}
	.content-6 .topic-top{		
		padding-top: 40px;
		padding-bottom: 40px;
	}	
}
@media only screen and (min-width: 341px) and (max-width: 480px) {
	.wrap .content-6 {
		height: 1100px;		
	}		
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.wrap .content-6 {
		height: 1100px;		
	}	
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.wrap .content-6 {
		height: 560px;		
	}
	.content-6 .topic-top{
		width: 960px;
		padding-top: 40px;
		padding-bottom: 40px;
	}
}
@media only screen and (min-width: 1201px) {
	.wrap .content-6 {
		height: 350px;		
	}
	.content-6 .topic-top{
		width: 960px;
		padding-top: 40px;
		padding-bottom: 40px;
	}	
}
.content-6 .process-list{
	width: 100%;
	margin: 0px auto;
}
.content-6 .process{
	
}
.content-6 .process .process-img{
	
}
.content-6 .process .process-img img{
	
}
.content-6 .process .process-content{
	font-size: 13px;
	text-align: left;
	width: 120px;
}
.content-6 .process .process-content p{
	font-size: 15px;   
    line-height: 1.30;
    padding-left: 23px;
}
@media only screen and (max-width: 340px) {
	.content-6 .process{		
		margin:0px auto;
		margin-bottom: 20px;
	}
	.content-6 .process .process-img{
		
	}
	.content-6 .process .process-img img{
		
	}
	.content-6 .process .process-content{
		font-size: 13px;
		text-align: left;
		width: 120px;
		display: inline-block;
	}
	.content-6 .process .process-content p{
		font-size: 15px;   
	    line-height: 1.30;
	    padding-left: 23px;
	}	
}
@media only screen and (min-width: 341px) and (max-width: 480px) {
	.content-6 .process{		
		margin:0px auto;
		margin-bottom: 20px;
	}
	.content-6 .process .process-img{
		
	}
	.content-6 .process .process-img img{
		
	}
	.content-6 .process .process-content{
		font-size: 13px;
		text-align: left;
		width: 120px;
		display: inline-block;
	}
	.content-6 .process .process-content p{
		font-size: 15px;   
	    line-height: 1.30;
	    padding-left: 23px;
	}		
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.content-6 .process{		
		margin:0px auto;
		margin-bottom: 20px;
	}
	.content-6 .process .process-img{
		
	}
	.content-6 .process .process-img img{
		
	}
	.content-6 .process .process-content{
		font-size: 13px;
		text-align: left;
		width: 120px;
		display: inline-block;
	}
	.content-6 .process .process-content p{
		font-size: 15px;   
	    line-height: 1.30;
	    padding-left: 23px;
	}	
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
	.content-6 .process{
		display: inline-block;
		float: left;
		margin-left: 20%;
		margin-bottom: 20px;
	}	
	.content-6 .process .process-content{
		font-size: 13px;
		text-align: left;
		width: 120px;
	}
	.content-6 .process .process-content p{
		font-size: 15px;   
	    line-height: 1.30;
	    padding-left: 23px;
	}
}
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.content-6 .process-list{
		width: 100%;
		margin: 0px auto;
	}
	.content-6 .process{
		display: inline-block;
		float: left;
		margin-left: 100px;
		margin-bottom: 20px;
	    height: 175px;
	}	
	.content-6 .process .process-content{
		font-size: 13px;
		text-align: left;
		width: 120px;
	}
	.content-6 .process .process-content p{
		font-size: 15px;   
	    line-height: 1.30;
	    padding-left: 23px;
	}
}
@media only screen and (min-width: 1201px) {
	.content-6 .process{
		display: inline-block;
		float: left;
	}	
	.content-6 .process .process-content{
		font-size: 13px;
		text-align: left;
		width: 120px;
	}
	.content-6 .process .process-content p{
		font-size: 15px;   
	    line-height: 1.30;
	    padding-left: 23px;
	}
}