/* 버튼 */
.btn,.btn i{vertical-align:middle}.btn:before,.btn:focus:before,.btn:hover:before{z-index:-1;transition:.3s}.btn,.btn.btn-link{overflow:hidden;text-transform:uppercase}.btn,.btn:not(:disabled):not(.disabled){cursor:pointer}.form-control-lg,.input-group-lg>.form-control,.input-group-lg>.input-group-addon,.input-group-lg>.input-group-btn>.btn{font-size:.8rem}.btn{position:relative;z-index:1;border-radius:2px;font-weight:700!important;font-size:14px;padding:14px 30px!important;letter-spacing:.05em}.btn i{display:inline-block;margin-right:8px}.btn.btn-rounded{border-radius:100px}.btn:before{content:"";position:absolute;left:0;top:0;width:0%;height:100%}.btn.btn-link{border:0;padding:0!important;color:#4782d3}.btn.btn-sm{padding:9px 20px!important;font-size:.75rem}.btn.btn-link:after{font-family:themify;content:"\e649";margin-left:5px;position:relative;top:0;font-size:10px;transition:.3s;-webkit-transition:.3s}.btn.btn-link:hover{text-decoration:none;color:#999}.btn.btn-link:hover:after{margin-top:-100px}.btn.btn-secondary{color:#999}.btn-circle .btn-danger i,.btn-circle .btn-info i,.btn-circle .btn-primary i,.btn-circle .btn-success i,.btn-circle .btn-warning i,.btn.btn-secondary:hover{color:#fff}.btn-white{background-color:#fff;color:#333}.btn-white-outline{border:2px solid #fff;background-color:transparent;color:#fff}.btn-white-outline:focus:before,.btn-white-outline:hover:before{width:100%;background-color:#fff}.btn-outline-primary{border:2px solid #4782d3;background-color:transparent;color:#4782d3}.btn-outline-primary:active,.btn-outline-primary:focus,.btn-outline-primary:hover{color:#fff;border-color:#4782d3;background-color:transparent}.btn-outline-primary:active:before,.btn-outline-primary:focus:before,.btn-outline-primary:hover:before{width:100%;background-color:#4782d3}.btn-outline-info{border:2px solid #5bc0de;background-color:transparent;color:#5bc0de}.btn-outline-info:active,.btn-outline-info:focus,.btn-outline-info:hover{color:#fff;border-color:#5bc0de;background-color:transparent}.btn-outline-info:active:before,.btn-outline-info:focus:before,.btn-outline-info:hover:before{width:100%;background-color:#5bc0de}.btn-outline-success{border:2px solid #5cb85c;background-color:transparent;color:#5cb85c}.btn-outline-success:active,.btn-outline-success:focus,.btn-outline-success:hover{color:#fff;border-color:#5cb85c;background-color:transparent}.btn-outline-success:active:before,.btn-outline-success:focus:before,.btn-outline-success:hover:before{width:100%;background-color:#5cb85c}.btn-outline-danger{border:2px solid #c9302c;background-color:transparent;color:#c9302c}.btn-outline-danger:active,.btn-outline-danger:focus,.btn-outline-danger:hover{color:#fff;border-color:#c9302c;background-color:transparent}.btn-outline-danger:active:before,.btn-outline-danger:focus:before,.btn-outline-danger:hover:before{width:100%;background-color:#c9302c}.btn-outline-warning{border:2px solid #f0ad4e;background-color:transparent;color:#f0ad4e}.btn-outline-warning:active,.btn-outline-warning:focus,.btn-outline-warning:hover{color:#fff;border-color:#f0ad4e;background-color:transparent}.btn-outline-warning:active:before,.btn-outline-warning:focus:before,.btn-outline-warning:hover:before{width:100%;background-color:#f0ad4e}.btn-outline-secondary{border:2px solid #ccc;background-color:transparent;color:#ccc}.btn-outline-secondary:active,.btn-outline-secondary:focus,.btn-outline-secondary:hover{color:#fff;border-color:#ccc;background-color:transparent}.btn-outline-secondary:active:before,.btn-outline-secondary:focus:before,.btn-outline-secondary:hover:before{width:100%;background-color:#ccc}.btn-secondary.disabled,.btn-secondary:disabled{background-color:#f5f5f5}.btn-danger,.btn-dark,.btn-info,.btn-primary,.btn-secondary,.btn-success,.btn-warning,.btn-white{box-shadow:0 .05em .1em rgba(0,0,0,.18);border:0}.btn-danger:hover,.btn-dark:hover,.btn-info:hover,.btn-primary:hover,.btn-secondary:hover,.btn-success:hover,.btn-warning:hover,.btn-white:hover{border:0;box-shadow:0 .05em 1em rgba(0,0,0,.18)}.btn-secondary{background:#f5f5f5;box-shadow:none}.btn-secondary:active,.btn-secondary:focus,.btn-secondary:hover{border:0;color:#fff;box-shadow:none}.btn-circle,.icon-sm-rounded{text-align:center;border-radius:50%}.btn-primary,.btn-primary:active,.btn-primary:focus,.btn-primary:hover{background:#4782d3;color:#fff}.btn-circle{width:80px;height:80px;line-height:80px}.btn-circle i{display:block;line-height:80px;margin:0 auto;font-size:35px}.btn-dark,.btn-dark:active,.btn-dark:focus,.btn-dark:hover{background:#141414;color:#fff}.icon-sm-rounded{width:32px;height:32px;line-height:32px;display:inline-block!important;background:#4782d3;color:#fff}.btn-white-outline:focus,.btn-white-outline:hover{color:#333;border-color:#fff}.btn.btn-lg{padding:15px 40px!important;font-size:14px}.btn:focus,.btn:hover{box-shadow:none;outline:0!important}
.btn.btn-sm {
    padding: 9px 20px!important;
    font-size: 12px;
}


/*
 * -------------------------------
 *  메인 박스
 * -------------------------------
*/



/* 모바일기기 1 */
@media only screen and (max-width: 320px) {
	.SF_main_icon{
		background:#fff;
		margin-top:0px;
	}
	.SF_main_icon .row{
		margin-left:0px;
		margin-right:0px;
	}
	.SF_main_icon .row > div{
		padding:0px;
	}
	
	
	.colorbox-5 {
		text-align: center;
		border: 1px solid #e1e1e1;
		padding: 20px;
		background: #f5f5f5;
		height: 250px;
	}

	.bg-white{background:#fff;}
	.bg-blue{
		background: #3b5998;
		color: #fff;
	}
	.bg-blue{color:#fff;}

	.bg-white{background:#fff;}
	.bg-gray{
		background: #525252;
		color: #fff;
	}
	.bg-gray {color:#fff;}
	
	.SF_main_icon a:focus, a:hover {
		color: #333;
		text-decoration: none;
	}

	.colorbox-5 .material-symbols-outlined {
	  line-height: 90px;
	  text-align: center;
	  border: 0px solid;
	  background-color: transparent;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  -ms-border-radius: 50%;
	  border-radius: 50%;
	  display: inline-block;
	  font-size: 60px;
	}

	.colorbox-5.green .material-symbols-outlined {
	  color: #32c5d2;
	  border-color: #32c5d2;
	}

	.colorbox-5.dark .material-symbols-outlined {
	  color: #333;
	  border-color: #333;
	}

	.colorbox-5.blue .material-symbols-outlined {
	  color: #3b5998;
	  border-color: #3b5998;
	}

	.colorbox-5.red .material-symbols-outlined {
	  color: #cb2027;
	  border-color: #cb2027;
	}

	.colorbox-5 .title {
	  font-size: 14px;
	  font-weight: 700;
	  margin-bottom: 0px;
	  text-transform: uppercase;
	}

	.colorbox-5 p {
	  margin-top: 10px;
	  font-size:12px;

	}
	.colorbox-5 .material-symbols-outlined{
		transition: transform 0.3s ease;
	}
	.colorbox-5:hover .material-symbols-outlined{
		transform: rotateY(180deg);
	}
	/* 이미지크기 */
	.colorbox-img1{
		width:100%; height:100%;
	}
	.colorbox-img2{
		width:100%; height:100%;
	}	
}
/* 모바일기기 2 */
@media only screen and (min-width: 321px) and (max-width: 768px){

	.SF_main_icon{
		background:#fff;
		margin-top:0px;
	}
	.SF_main_icon .row{
		margin-left:0px;
		margin-right:0px;
	}
	.SF_main_icon .row > div{
		padding:0px;
	}
	
	
	.colorbox-5 {
		text-align: center;
		border: 1px solid #e1e1e1;
		padding: 20px;
		background: #f5f5f5;
		height: 250px;
	}

	.bg-white{background:#fff;}
	.bg-blue{
		background: #3b5998;
		color: #fff;
	}
	.bg-blue{color:#fff;}

	.bg-white{background:#fff;}
	.bg-gray{
		background: #525252;
		color: #fff;
	}
	.bg-gray {color:#fff;}
	
	.SF_main_icon a:focus, a:hover {
		color: #333;
		text-decoration: none;
	}

	.colorbox-5 .material-symbols-outlined {
	  line-height: 90px;
	  text-align: center;
	  border: 0px solid;
	  background-color: transparent;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  -ms-border-radius: 50%;
	  border-radius: 50%;
	  display: inline-block;
	  font-size: 60px;
	}

	.colorbox-5.green .material-symbols-outlined {
	  color: #32c5d2;
	  border-color: #32c5d2;
	}

	.colorbox-5.dark .material-symbols-outlined {
	  color: #333;
	  border-color: #333;
	}

	.colorbox-5.blue .material-symbols-outlined {
	  color: #3b5998;
	  border-color: #3b5998;
	}

	.colorbox-5.red .material-symbols-outlined {
	  color: #cb2027;
	  border-color: #cb2027;
	}

	.colorbox-5 .title {
	  font-size: 14px;
	  font-weight: 700;
	  margin-bottom: 0px;
	  text-transform: uppercase;
	}

	.colorbox-5 p {
	  margin-top: 10px;
	  font-size:12px;

	}
	.colorbox-5 .material-symbols-outlined{
		transition: transform 0.3s ease;
	}
	.colorbox-5:hover .material-symbols-outlined{
		transform: rotateY(180deg);
	}
	/* 이미지크기 */
	.colorbox-img1{
		width:100%; height:100%;
	}
	.colorbox-img2{
		width:100%; height:100%;
	}		
}
/* 태블릿 */
@media only screen and (min-width: 769px) and (max-width: 1200px){

	.SF_main_icon{
		background:#fff;
		margin-top:0px;
	}
	.SF_main_icon .row{
		margin-left:0px;
		margin-right:0px;
	}
	.SF_main_icon .row > div{
		padding:0px;
	}

	.colorbox-5 {
		text-align: center;
		border: 1px solid #e1e1e1;
		padding: 20px;
		background: #f5f5f5;
		height: 280px;
	}

	.bg-white{background:#fff;}
	.bg-blue{
		background: #3b5998;
		color: #fff;
	}
	.bg-blue{color:#fff;}

	.bg-white{background:#fff;}
	.bg-gray{
		background: #525252;
		color: #fff;
	}
	.bg-gray {color:#fff;}
	
	.SF_main_icon a:focus, a:hover {
		color: #333;
		text-decoration: none;
	}

	.colorbox-5 .material-symbols-outlined {
	  line-height: 90px;
	  text-align: center;
	  border: 0px solid;
	  background-color: transparent;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  -ms-border-radius: 50%;
	  border-radius: 50%;
	  display: inline-block;
	  font-size: 60px;
	}

	.colorbox-5.green .material-symbols-outlined {
	  color: #32c5d2;
	  border-color: #32c5d2;
	}

	.colorbox-5.dark .material-symbols-outlined {
	  color: #333;
	  border-color: #333;
	}

	.colorbox-5.blue .material-symbols-outlined {
	  color: #3b5998;
	  border-color: #3b5998;
	}

	.colorbox-5.red .material-symbols-outlined {
	  color: #cb2027;
	  border-color: #cb2027;
	}

	.colorbox-5 h3 {
	  font-size: 16px;
	  font-weight: 700;
	  margin-top: 20px;
	  margin-bottom: 0px;
	  text-transform: uppercase;
	}

	.colorbox-5 p {
	  margin-top: 10px;

	}
	.colorbox-5 .material-symbols-outlined{
		transition: transform 0.3s ease;
	}
	.colorbox-5:hover .material-symbols-outlined{
		transform: rotateY(180deg);
	}
	/* 이미지크기 */
	.colorbox-img1{
		width:100%; height:100%;
	}
	.colorbox-img2{
		width:100%; height:100%;
	}	
}
/* 데스크탑 */
@media only screen and (min-width: 1201px) {

	.SF_main_icon{
		background:#fff;
		margin-top:0px;
		height: 560px;
	}
	.SF_main_icon .row{
		margin-left:0px;
		margin-right:0px;
	}
	.SF_main_icon .row > div{
		padding:0px;
	}

	.colorbox-5 {
		text-align: center;
		border: 1px solid #e1e1e1;
		padding: 20px;
		background: #f5f5f5;
		height: 280px;
	}

	.bg-white{background:#fff;}
	.bg-blue{
		background: #3b5998;
		color: #fff;
	}
	.bg-blue{color:#fff;}

	.bg-white{background:#fff;}
	.bg-gray{
		background: #525252;
		color: #fff;
	}
	.bg-gray {color:#fff;}
	
	.SF_main_icon a:focus, a:hover {
		color: #333;
		text-decoration: none;
	}

	.colorbox-5 .material-symbols-outlined {
	  line-height: 90px;
	  text-align: center;
	  border: 0px solid;
	  background-color: transparent;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  -ms-border-radius: 50%;
	  border-radius: 50%;
	  display: inline-block;
	  font-size: 60px;
	}

	.colorbox-5.green .material-symbols-outlined {
	  color: #32c5d2;
	  border-color: #32c5d2;
	}

	.colorbox-5.dark .material-symbols-outlined {
	  color: #333;
	  border-color: #333;
	}

	.colorbox-5.blue .material-symbols-outlined {
	  color: #3b5998;
	  border-color: #3b5998;
	}

	.colorbox-5.red .material-symbols-outlined {
	  color: #cb2027;
	  border-color: #cb2027;
	}

	.colorbox-5 h3 {
	  font-size: 16px;
	  font-weight: 700;
	  margin-top: 20px;
	  margin-bottom: 0px;
	  text-transform: uppercase;
	}

	.colorbox-5 p {
	  margin-top: 10px;

	}

	.colorbox-5 .material-symbols-outlined{
		transition: transform 0.3s ease;
	}
	.colorbox-5:hover .material-symbols-outlined{
		transform: rotateY(180deg);
	}
	
	/* 이미지크기 */
	.colorbox-img1{
		width:660px; height:568px;
	}
	.colorbox-img2{
		width:330px; height:280px;
	}
	.img-main{
		height: 560px;
	}
	
	
	
}




/*
 * -------------------------------
 *  고객센터
 * -------------------------------
*/
	/* 모바일기기 1 */
	@media only screen and (max-width: 320px) {
		#bg-wide-1 {
			padding: 70px 20px;
			text-align: center;
		}

		#bg-wide-1 h2 {
			color: #fff;
			font-size: 24px;
			font-weight: 700;
			margin-bottom: 20px;
		}

		#bg-wide-1 p {
			color: #fff;
			font-size: 14px;
			margin-bottom: 40px;
		}
	}

	/* 모바일기기 2 */
	@media only screen and (min-width: 321px) and (max-width: 768px) {
		#bg-wide-1 {
			padding: 70px 20px;
			text-align: center;
		}

		#bg-wide-1 h2 {
			color: #fff;
			font-size: 24px;
			font-weight: 700;
			margin-bottom: 20px;
		}

		#bg-wide-1 p {
			color: #fff;
			font-size: 14px;
			margin-bottom: 40px;
		}
	}

	/* 태블릿 */
	@media only screen and (min-width: 769px) and (max-width: 1200px) {
		#bg-wide-1 {
			padding: 70px 20px;
			text-align: center;
		}

		#bg-wide-1 h2 {
			color: #fff;
			font-size: 40px;
			font-weight: 700;
			margin-bottom: 20px;
		}

		#bg-wide-1 p {
			color: #fff;
			font-size: 18px;
			margin-bottom: 40px;
		}
	}

	/* 데스크탑 */
	@media only screen and (min-width: 1201px) {
		#bg-wide-1 {
			padding: 70px 20px;
			text-align: center;
		}

		#bg-wide-1 h2 {
			color: #fff;
			font-size: 40px;
			font-weight: 700;
			margin-bottom: 20px;
		}

		#bg-wide-1 p {
			color: #fff;
			font-size: 18px;
			margin-bottom: 40px;
		}
	}






.widebox-1 {
	overflow: hidden;
}
.widebox-1-row {
  position: relative;
}	
.no-padding.gray {
	background-color: #f5f5f5;
}		

/* 모바일기기 1 */
@media only screen and (max-width: 320px) {
	.no-padding.img-view {
	  background-size: cover;
	  height: 100%;
	}
	.no-padding-inner {
		padding: 30px;
	}
	.no-padding-inner-img{
		padding: 80px;
	}			
	.widebox-icon {
		background: transparent;
		width: 50px;
		height: 50px;
		display: inline-block;
		float: left;
		height: 35px;
		line-height: 35px;
		margin-right: 10px;
		position: relative;
		text-align: center;
		top: 5px;
	}
	.widebox-icon .material-symbols-outlined {
		width: 50px;
		height: 50px;
		line-height: 50px;
		text-align: center;
		background-color: #0077b6;
		color: #fff;
		font-size: 24px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		border-radius: 50%;
	}
	.servicebox-icon {
		padding-left: 65px;
	}
	.servicebox-icon h4 {
		font-weight: 700;
		font-size: 14px;
		color: #000;
		text-transform: uppercase;
		margin-bottom: 5px;
	}		
	.servicebox-icon p {
		font-weight: 700;
		font-size: 12px;
		color: #999;
		text-transform: uppercase;
		margin-bottom: 5px;
		line-height: 1.7;
	}			
}
/* 모바일기기 2 */
@media only screen and (min-width: 321px) and (max-width: 768px){
	.no-padding.img-view {
	  background-size: cover;
	  height: 100%;
	}
	.no-padding-inner {
		padding: 30px;
	}
	.no-padding-inner-img{
		padding: 80px;
	}
	.widebox-icon {
		background: transparent;
		width: 50px;
		height: 50px;
		display: inline-block;
		float: left;
		height: 35px;
		line-height: 35px;
		margin-right: 10px;
		position: relative;
		text-align: center;
		top: 5px;
	}
	.widebox-icon .material-symbols-outlined {
		width: 50px;
		height: 50px;
		line-height: 50px;
		text-align: center;
		background-color: #0077b6;
		color: #fff;
		font-size: 24px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		border-radius: 50%;
	}
	.servicebox-icon {
		padding-left: 65px;
	}
	.servicebox-icon h4 {
		font-weight: 700;
		font-size: 14px;
		color: #000;
		text-transform: uppercase;
		margin-bottom: 5px;
	}		
	.servicebox-icon p {
		font-weight: 700;
		font-size: 12px;
		color: #999;
		text-transform: uppercase;
		margin-bottom: 5px;
		line-height: 1.7;
	}				
}
/* 태블릿 */
@media only screen and (min-width: 769px) and (max-width: 1200px){
	.no-padding.img-view {
	  background-size: cover;
	  position: absolute;
	  height: 100%;
	}
	.no-padding-inner {
		padding: 60px;
	}				
	.widebox-icon {
		background: transparent;
		width: 50px;
		height: 50px;
		display: inline-block;
		float: left;
		height: 35px;
		line-height: 35px;
		margin-right: 10px;
		position: relative;
		text-align: center;
		top: 5px;
	}
	.widebox-icon .material-symbols-outlined {
		width: 50px;
		height: 50px;
		line-height: 50px;
		text-align: center;
		background-color: #0077b6;
		color: #fff;
		font-size: 17px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		border-radius: 50%;
	}
	.servicebox-icon {
		padding-left: 65px;
	}
	.servicebox-icon h4 {
		font-weight: 700;
		font-size: 15px;
		color: #000;
		text-transform: uppercase;
		margin-bottom: 5px;
	}
	.servicebox-icon p {
		font-weight: 700;
		font-size: 13px;
		color: #999;
		text-transform: uppercase;
		margin-bottom: 5px;
	}				
}
/* 데스크탑 */
@media only screen and (min-width: 1201px) {
	.no-padding.img-view {
	  background-size: cover;
	  position: absolute;
	  height: 100%;
	}
	.no-padding-inner {
		padding: 60px;
	}				
	.widebox-icon {
		background: transparent;
		width: 50px;
		height: 50px;
		display: inline-block;
		float: left;
		height: 35px;
		line-height: 35px;
		margin-right: 10px;
		position: relative;
		text-align: center;
		top: 5px;
	}
	.widebox-icon .material-symbols-outlined {
		width: 50px;
		height: 50px;
		line-height: 50px;
		text-align: center;
		background-color: #0077b6;
		color: #fff;
		font-size: 24px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		border-radius: 50%;
	}
	.servicebox-icon {
		padding-left: 65px;
	}
	.servicebox-icon h4 {
		font-weight: 700;
		font-size: 15px;
		color: #000;
		text-transform: uppercase;
		margin-bottom: 5px;
	}
	.servicebox-icon p {
		font-weight: 700;
		font-size: 13px;
		color: #999;
		text-transform: uppercase;
		margin-bottom: 5px;
	}		

}


/*
 * -------------------------------
 *  와이드박스
 * -------------------------------
*/
.wide-box {
	background-color: #f6f8fa;
	padding: 0;
}

.wide-box .btn {
	margin-bottom: 30px;
}	
/* 모바일기기 1 */
@media only screen and (max-width: 320px) {
	.wide-box h3 {
		color: #fff;
		font-size: 16px;
		font-weight: 300;
		padding: 20px;
		background: #00000057;
		height: auto;
	}
	.wide-box p {
		padding-bottom: 30px;
		color: #fff;
		font-size: 14px;
		background: #00000057;
		padding: 20px;
	}
}
/* 모바일기기 2 */
@media only screen and (min-width: 321px) and (max-width: 768px){
	.wide-box h3 {
		color: #fff;
		font-size: 16px;
		font-weight: 300;
		padding: 20px;
		background: #00000057;
		height: auto;
	}
	.wide-box p {
		padding-bottom: 30px;
		color: #fff;
		font-size: 14px;
		background: #00000057;
		padding: 20px;
	}
}
/* 태블릿 */
@media only screen and (min-width: 769px) and (max-width: 1200px){
	.wide-box h3 {
		color: #fff;
		font-size: 50px;
		font-weight: 300;
		padding: 20px;
		background: #00000057;
		height: auto;
	}
	.wide-box p {
		padding-bottom: 30px;
		color: #fff;
		font-size: 16px;
		background: #00000057;
		padding: 20px;
	}
}
/* 데스크탑 */
@media only screen and (min-width: 1201px) {
	.wide-box h3 {
		color: #fff;
		font-size: 50px;
		font-weight: 300;
		padding: 20px;
		background: #00000057;
		height: auto;
	}
	.wide-box p {
		padding-bottom: 30px;
		color: #fff;
		font-size: 16px;
		background: #00000057;
		padding: 20px;
	}
}