/*
	Copyright 2020 Raonbnp
	http://raonbnp.com, http://raonwebstore.com
*/
@charset "UTF-8";
@import '/_css/common.css'; /* front, admin 공통*/
@import '/_css/member.css'; /* front member 공통*/
@import '/_css/board.css'; /* front member 공통*/
@import 'loading.css';
@import 'fontSet.css';
@import 'basic.css';
@import 'layout.css';



/*company_wrap*/
.company_wrap .greeting{
	position:relative;
	padding-left:50rem;
	padding-top:10rem;
	padding-bottom:10rem;
	z-index:1;
	margin-top:12rem;
}
.company_wrap .greeting::after{
	content:"";
	position:absolute;
	left:20rem;
	top:0;
	width:300%;
	height:100%;
	background:#f6f6f6;
	z-index:-1;
}
.company_wrap .greeting > p{
	position:absolute;
	left:-20rem;
	bottom:0rem;
}
.company_wrap .brief_history{
	margin-top:12rem;
}
.company_wrap .brief_history .v{
	background:url(../_img/sub/company_img2.jpg) no-repeat center center / cover;
	height:30rem;
	display:flex;
	align-items: center;
	justify-content: center;
	padding-bottom:8rem;
}
.company_wrap .brief_history ul{
	width:90%;
	max-width:120rem;
	margin:0 auto;
	display:flex;
	flex-wrap: wrap;
	font-size:1.6rem;
	background:#fff;
	padding:3rem;
	position:relative;
	z-index: 1;
	margin-top:-8rem;
}
.company_wrap .brief_history ul > li{
	border-bottom:1px solid #ddd;
	width:50%;
	display:flex;
	min-height:6rem;
	align-items: center;
	padding:10px 20px;
}
.company_wrap .brief_history ul > li > p:first-child{
	width:14rem;
}
.company_wrap .brief_history ul > li > p:first-child strong{
	font-weight:500;
	position:relative;
	display:inline-block;
	padding-left:10px;
}
.company_wrap .brief_history ul > li > p:first-child strong::after{
	content:"";
	position:absolute;
	left:0;
	top:50%;
	transform: translateY(-50%);
	width:3px;
	height:3px;
	border-radius:100%;
	background:#222;
}
.company_wrap .brief_history ul > li > p:last-child{
	color:#666;
}


@media(max-width:991.98px){
	.company_wrap .greeting{
		position:relative;
		padding-left:0rem;
		padding-top:10rem;
		padding-bottom:10rem;
		z-index:1;
		margin-top:12rem;
	}
	.company_wrap .greeting > p{
		position:relative;
		left:0;
	}
	.company_wrap .greeting > p img{
		width:100%;
	}
	.company_wrap .brief_history ul{
		padding:3rem 0rem;
		width:100%;
	}
	.company_wrap .brief_history ul > li{
		width:100%;
	}
}
@media(max-width:576.98px){
	.company_wrap .greeting{
		padding-top:6rem;
		padding-bottom:6rem;
		margin-top:4rem;
	}
}

/*history_wrap*/
.history_wrap{
	padding-top:6rem;
}
.history_container{
	position:relative
}
.history_wrap .history_box{
	display:flex;
	position:relative;
	padding-bottom:10rem;
}
.history_wrap .history_box::after{
	content:"";
	position:absolute;
	left:50%;
	top:3rem;
	border-right:1px solid #ddd;
	height:100%;
	z-index:-1;
}
.history_wrap .history_box > div{
	width:50%;
	flex-shrink: 0;
	padding:0px 6rem;
}
.history_wrap .history_box > div h4{
	font-size:4.5rem;
	font-weight:300;
	position:relative;
	margin-bottom:4rem;
	padding-bottom:4rem;
}
.history_wrap .history_box > div h4::before{
	content:"";
	position:absolute;
	bottom:0;
	border-bottom:1px solid #ddd;
	width:500%;
}
.history_wrap .history_box > div h4 strong{
	font-weight:600;
}
.history_wrap .history_box > div h4 span{
	position:absolute;
	font-weight:900;
	color:#007ec6;
	opacity:.2;
	top:0;
	transform:translateY(-40%);
	font-family:'Montserrat',sans-serif !important;
}
.history_wrap .history_box > div ul{
	list-style:none;
	padding:0;
	font-size:1.8rem;
	position:relative;
	z-index:2;
}
.history_wrap .history_box > div ul > li {
	position:relative;
	margin-bottom:3rem;
}
.history_wrap .history_box > div ul > li:last-child{
	margin-bottom:0;
}
.history_wrap .history_box > div ul > li span.num{
	font-family:'Montserrat',sans-serif !important;
	color:#106299;
	font-weight:600;
	position:absolute;
}
.history_wrap .history_box > div h4::after,
.history_wrap .history_box > div ul > li::after{
	content:"";
	position:absolute;
	top:.5rem;
	width:16px;
	height:16px;
	background:#007ec6;
	border:4px solid #7fbee2;
	border-radius:100%;
}
.history_wrap .history_box > div h4::after{
	top:2.2rem
}
.history_wrap .history_box:nth-child(odd) > div:first-child,
.history_wrap .history_box:nth-child(even) > div:last-child{
	text-align:right;
}

.history_wrap .history_box:nth-child(even) > div:first-child{
	order:2;
}
.history_wrap .history_box:nth-child(odd) > div:first-child li{
	padding-right:4rem;
}
.history_wrap .history_box:nth-child(odd) > div:first-child li span.num{
	right:0;
}

.history_wrap .history_box:nth-child(even) > div:first-child li{
	padding-left:4rem;
}
.history_wrap .history_box:nth-child(even) > div:first-child li span.num{
	left:0;
}
.history_wrap .history_box:nth-child(odd) > div:first-child h4::before{
	right:-6rem;
}
.history_wrap .history_box:nth-child(even) > div:first-child h4::before{
	left:-6rem;
}
.history_wrap .history_box:nth-child(odd) > div:first-child li::after,
.history_wrap .history_box:nth-child(odd) > div:first-child h4::after{
	right:-6rem;
	transform:translateX(50%);
}
.history_wrap .history_box:nth-child(even) > div:first-child li::after,
.history_wrap .history_box:nth-child(even) > div:first-child h4::after{
	left:-6rem;
	transform:translateX(-50%);
}

@media(max-width:991.98px){
	.history_wrap{
		padding-top:3rem;
	}
	.history_wrap .history_box {
		padding-bottom: 6rem;
	}
	.history_wrap .history_box > div{
		padding:0px 2.5rem;
	}
	.history_wrap .history_box > div h4 {
		font-size: 3.5rem;
		margin-bottom: 3rem;
		padding-bottom: 3rem;
	}
	.history_wrap .history_box:nth-child(odd) > div:first-child li::after,
	.history_wrap .history_box:nth-child(odd) > div:first-child h4::after,
	.history_wrap .history_box:nth-child(odd) > div:first-child h4::before{
		right:-2.5rem;
	}
	.history_wrap .history_box:nth-child(even) > div:first-child li::after,
	.history_wrap .history_box:nth-child(even) > div:first-child h4::after,
	.history_wrap .history_box:nth-child(even) > div:first-child h4::before{
		left:-2.5rem;
	}
}
@media(max-width:576.98px){
	.history_wrap .history_box > div h4 {
		font-size: 2.5rem;
	}
	.history_wrap .history_box > div h4::after{
		top:.6rem;
	}
	.history_wrap .history_box{
		flex-wrap:wrap;
	}
	.history_wrap .history_box > div{
		width:100%;
		text-align:left !important;
		padding-left:35px;
		padding-right:0px;
	}
	.history_wrap .history_box .v{
		width:100%;
		order:-1;
		margin-bottom:4rem;
		padding-left:0;
	}
	.history_wrap .history_box > div ul > li{
		padding-right:0 !important;
		padding-left:4rem !important;
	}
	.history_wrap .history_box > div:first-child li::after,
	.history_wrap .history_box > div:first-child h4::after{
		right:auto !important;
		left:-2.5rem;
		transform: translateX(-50%) !important;
	}
	.history_wrap .history_box:nth-child(odd) > div:first-child li span.num{
		right:auto;
		left:0;
	}
	.history_wrap .history_box::after {
		left: 1.8rem;
	}
	.history_wrap .history_box > div h4::before{
		width:150% !important;
		left:-2.5rem;
		transform: translateX(0) !important;
	}
}


/*location_wrap*/
.location_wrap{}
.location_wrap .root_daum_roughmap{
	width:100% !important;
}
.location_wrap .info{
	display:flex;
	flex-wrap:wrap;
	margin-top:5rem;
	font-size:1.8rem;
}
.location_wrap .info h5{
	width:26rem;
	flex-shrink: 0;
	font-size:2.2rem;
	position:relative;
	margin-bottom:2rem;
}
.location_wrap .info h5::after{
	content:"";
	position:absolute;
	left:0;
	width:15rem;
	top:-2rem;
	height:4px;
	background:#0698d8
}

@media(max-width:767.98px){
	.location_wrap .info h5{
		width:100%;
	}
	.location_wrap .info h5::after{
		width:10rem;
		height:2px;
	}
}


/*비지니스 프로덕트 공통*/
.bp_wrap .bp_title{
	font-size:4rem;
	color:#106299;
	font-weight:700;
	margin-bottom:4rem;
}
.bp_wrap .bp_title .bar{
	margin-top:1rem;
	position:relative;
}
.bp_wrap .bp_title .bar > span{
	display:inline-block;
	position:relative;
	z-index:2;
	background:#fff;
	padding-right:4rem;
}
.bp_wrap .bp_title .bar::after{
	content:"";
	position:absolute;
	right:0;
	width:100%;
	top:50%;
	transform:translateY(-50%);
	height:6px;
	background: rgb(5,152,217);
	background: -moz-linear-gradient(90deg, rgba(5,152,217,1) 20%, rgba(137,210,69,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(5,152,217,1) 20%, rgba(137,210,69,1) 100%);
	background: linear-gradient(90deg, rgba(5,152,217,1) 20%, rgba(137,210,69,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0598d9",endColorstr="#89d245",GradientType=1);
}
.bp_wrap .bp_title2 .bar::after{
	top:75%;
}
.bp_wrap .title_desc{
	font-size:1.8rem;
	line-height:1.6;
	margin-bottom:10rem;
}
.bp_wrap .bp_cont_box{
	display:flex;
}
.bp_wrap .bp_cont_box{
	margin-bottom:8rem;
} 
.bp_wrap .bp_cont_box h5{
	font-size:2rem;
	padding-top:2rem;
	position:relative;
	width:22rem;
	flex-shrink: 0;
	padding-right:1rem;
}
.bp_wrap .bp_cont_box h5::after{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:16rem;
	height:.4rem;
	background:#0698d8
}
.bp_wrap .bp_cont_box h5 small{
	display:block;
	color:#999;
	margin-top:.5rem;
}

.bp_wrap .bp_cont_box > div{
	width:100%;
}

.bp_wrap .gray_box{
	background:#eeefef;
	border-radius:10px;
	padding:3rem;
}

.bullet_plus{
	list-style:none;
	padding:0;
	font-size:1.8rem;
}
.bullet_plus > li{
	position:relative;
	display:flex;
	align-items: center;
}
.bullet_plus > li + li {
	margin-top:1.5rem;
	
}
.bullet_plus > li::before{
	content:"";
	left:0;
	width:2.4rem;
	height:2.4rem;
	background:url(../_img/sub/gateway_img5.jpg) no-repeat center center / cover;
	margin-right:8px;
	flex-shrink: 0;
}

@media(max-width:991.98px){
	.bp_wrap .bp_title{
		font-size:3rem;
		color:#106299;
		font-weight:700;
		margin-bottom:3rem;
	}
	.bp_wrap .bp_title .bar::after{
		height:4px;
	}
	.bp_wrap .title_desc{
		font-size:1.6rem;
		margin-bottom:6rem;
	}
	.bp_wrap .bp_cont_box{
		flex-wrap:wrap;
	}
	.bp_wrap .bp_cont_box{
		margin-bottom:8rem;
	} 
	.bp_wrap .bp_cont_box h5{
		width:100%;
		padding-right:1rem;
		margin-bottom:2.5rem;
	}
	.bp_wrap .bp_cont_box h5::after{
		height:3px;
	}
	.bp_wrap .bp_cont_box h5 br{
		display:none;
	}
}
@media(max-width:576.98px){
	.bp_wrap .bp_title{
		font-size:2.4rem;
		letter-spacing:-0.03em;
	}
	.bp_wrap .title_desc{
		margin-bottom:5rem;
	}
	.bp_wrap .title_desc br{
		display:none;
	}
	.bp_wrap .bp_cont_box h5{
		font-size:2rem;
	}
}



/*ict_wrap*/
.ict_wrap{}
.ict_wrap .step_section{
	position:relative;
	z-index:5;
	margin-bottom:-8rem;
	padding-bottom:8rem;
	
}
.ict_wrap .step_section::after{
	content:"";
	position:absolute;
	left:-50%;
	right:-50%;
	top:18.3rem;
	height:100%;
	background:#f7f7f7;
	z-index:-1;
}
.ict_wrap .step_box{
	display:flex;
	flex-wrap:wrap;
	text-align:center;
	width:calc(100% + 60px)
}
.ict_wrap .step_box > div{
	width:calc(100%/4);
	margin-left:-20px;
}
.ict_wrap .step_box > div:first-child{
	margin-left:0;
}
.ict_wrap .step_box > div .inner{
	border-radius:100%;
	overflow:hidden;
	position:relative;
	padding:20px;
	background:#f1f1f1;
}
.ict_wrap .step_box > div .circle_box{
	display:flex;
	padding-top:100%;
	border-radius:100%;
	background:#fff;
	position:relative;
	z-index:3;
}
.ict_wrap .step_box > div .circle_box > div{
	position:absolute;
	left:0;
	width:100%;
	top:50%;
	transform:translateY(-50%);
	font-size:2rem;
	line-height:1.6;
	font-weight:600;
}
.ict_wrap .step_box > div .circle_box > div img{
	max-width:7rem;
	margin-bottom:1rem;
}
.ict_wrap .step_box > div .inner::after{
	content:"";
	position:absolute;
	width:100%;
	height:50%;
	left:0;
	z-index:2;
}
.ict_wrap .step_box > div:nth-child(1)  .inner::after{
	top:0;
	background: rgb(21,229,187);
	background: -moz-linear-gradient(90deg, rgba(21,229,187,1) 0%, rgba(46,201,187,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(21,229,187,1) 0%, rgba(46,201,187,1) 100%);
	background: linear-gradient(90deg, rgba(21,229,187,1) 0%, rgba(46,201,187,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#15e5bb",endColorstr="#2ec9bb",GradientType=1);
}
.ict_wrap .step_box > div:nth-child(2)  .inner::after{
	bottom:0;
	background: rgb(46,201,187);
	background: -moz-linear-gradient(90deg, rgba(46,201,187,1) 0%, rgba(72,174,186,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(46,201,187,1) 0%, rgba(72,174,186,1) 100%);
	background: linear-gradient(90deg, rgba(46,201,187,1) 0%, rgba(72,174,186,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2ec9bb",endColorstr="#48aeba",GradientType=1);
}
.ict_wrap .step_box > div:nth-child(3)  .inner::after{
	top:0;
	background: rgb(72,174,186);
	background: -moz-linear-gradient(90deg, rgba(72,174,186,1) 0%, rgba(97,147,186,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(72,174,186,1) 0%, rgba(97,147,186,1) 100%);
	background: linear-gradient(90deg, rgba(72,174,186,1) 0%, rgba(97,147,186,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#48aeba",endColorstr="#6193ba",GradientType=1);
}
.ict_wrap .step_box > div:nth-child(4)  .inner::after{
	bottom:0;
	background: rgb(97,147,186);
	background: -moz-linear-gradient(90deg, rgba(97,147,186,1) 0%, rgba(122,119,186,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(97,147,186,1) 0%, rgba(122,119,186,1) 100%);
	background: linear-gradient(90deg, rgba(97,147,186,1) 0%, rgba(122,119,186,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#6193ba",endColorstr="#7a77ba",GradientType=1);
}
.ict_wrap .step_box .desc{
	font-size:1.6rem;
	line-height:1.6;
	padding-top:5rem;
	position:relative;
}
.ict_wrap .step_box > div:nth-child(even) .desc{
	padding-top:10rem;
} 
.ict_wrap .step_box .desc p{
	position:absolute;
	left:50%;
	top:0;
	height:3rem;
	border-left:1px solid #cccc;
}
.ict_wrap .step_box > div:nth-child(even) .desc p{
	position:absolute;
	left:50%;
	top:0;
	height:8rem;
	border-left:1px solid #cccc;
}
.ict_wrap .step_box > div .desc p::after{
	content:"";
	position:absolute;
	left:50%;
	top:-7px;
	margin-left:-8px;
	background:#fff;
	border:3px solid #ccc;
	width:15px;
	height:15px;
	border-radius:100%;
	z-index:7;
}
.ict_wrap .step_box > div .desc p::before{
	content:"";
	position:absolute;
	left:50%;
	bottom:-5px;
	margin-left:-5px;
	background:#ccc;
	width:9px;
	height:9px;
	border-radius:100%;
	z-index:7;
}

@media(max-width:1199.98px){
	.ict_wrap .step_section::after{
		top:12.5rem;
	}
	.ict_wrap .step_box{
		width:calc(100% + 30px)
	}
	.ict_wrap .step_box > div{
		margin-left:-10px;
	}
	.ict_wrap .step_box > div:first-child{
		margin-left:0;
	}
	.ict_wrap .step_box > div .inner{
		padding:10px;
	}
	.ict_wrap .step_box > div .circle_box > div {
		font-size: 1.8rem;
		line-height:1.4;
	}
	.ict_wrap .step_box .desc {
		font-size: 1.5rem;
		line-height: 1.5;
		padding-left:10px;
		padding-right:10px;
	}
	.ict_wrap .step_box .desc br{
		display:none;
	}
}

@media(max-width:991.98px){
	.ict_wrap .step_section::after{
		top:12.5rem;
	}
	.ict_wrap .step_box{
		width:calc(100% + 15px)
	}
	.ict_wrap .step_box > div{
		margin-left:-5px;
	}
	.ict_wrap .step_box > div:first-child{
		margin-left:0;
	}
	.ict_wrap .step_box > div .inner{
		padding:5px;
	}
	.ict_wrap .step_box > div .circle_box > div {
		font-size: 1.6rem;
	}
	.ict_wrap .step_box .desc {
		font-size: 1.5rem;
		line-height: 1.5;
		padding-left:10px;
		padding-right:10px;
	}
	.ict_wrap .step_box .desc br{
		display:none;
	}
}
@media(max-width:767.98px){
	.ict_wrap .step_section::after{
		top:12.5rem;
	}
	.ict_wrap .step_box{
		width:calc(100% + 15px)
	}
	.ict_wrap .step_box > div{
		margin-left:-5px;
		width:calc(100%/2);
		margin-bottom:5rem;
	}
	.ict_wrap .step_box > div:first-child{
		margin-left:0;
	}
	.ict_wrap .step_box > div .inner{
		padding:5px;
	}
	.ict_wrap .step_box > div .circle_box > div {
		font-size: 1.6rem;
	}
	.ict_wrap .step_box .desc {
		font-size: 1.5rem;
		line-height: 1.5;
		padding-left:10px;
		padding-right:10px;
	}
	.ict_wrap .step_box .desc br{
		display:none;
	}
}