@charset "euc-kr";

/*================================
    left : 기본레이아웃
================================*/
.left{
	width: 213px;
	height: 100%;	
	background: #FFFFFF;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999999;
}
.left_sub .left_menu,
.left_sub .left_copyright{
	border-right: 1px solid #dcdcdc;
}
.left .left_logo{
	width: 100%;
	height: 10%;
}
.left .left_menu{
	width: 100%;
	height: 67%;
	overflow-y: auto;
}
.left  .left_copyright{
	width: 100%;
	height: 23%;
}

/*================================
    left : 로고
================================*/
.left > .left_logo{
	background: #ce2025;
	text-align: center;
	padding: 30px 0 29px 0;
}

/*================================
    left : ks마트
================================*/
.left_ks{
	position: absolute;
	bottom: 230px;
	left: 30px;
}
.left_ks img{
	width: 153px;
}

/*================================
    left : 카피라이터
================================*/
.left > .left_copyright{
	background: #f8f8f8;
	position: absolute;
	bottom: 0;
	font-size: 14px;
	color: #6b6b6b;
	line-height: 19px;
	padding: 17px 11px 26px 11px;
}
.left > .left_copyright > .li_2{
	padding: 13px 0 3px 0;
}
.left > .left_copyright > .li_4{
	font-size: 13px;
	padding: 19px 0 0 0;
}

/*================================
    left : 메뉴(스크립트 css)
================================*/
.list{
	width: 100%;
	height: 100%;
	padding: 45px 0 0 0;
}
.list .list-hidden{
  display: none;
  overflow: hidden;
}
.list .list-item li{
	padding: 0 17px 20px 17px;
}
.list .list-item .list-link-m{
	width: 100%;
	font-family: 'NanumSquareNeoExtraBold';
	font-size: 20px;
	color: #000000;
	background: #fff url(../images/left/left_menu_icon01.png) no-repeat 100% 50%;
	display: block;
}
.list .list-item .list-link-m:hover,
.list .list-item .list-link-m:focus,
.list .list-item .list-link-m:active,
.list .list-item .active{
	color: #ce2025;
	background: #fff url(../images/left/left_menu_icon02.png) no-repeat 100% 50%;
}
.list .list-item .list-unstyled-s{
	margin: 10px 0 0 0;
	padding: 10px 0 10px 0;
	background: #f6f6f6;
}
.list .list-item .list-unstyled-s li{
	padding: 0 0 0 10px;
}
.list .list-item .list-unstyled .list-link-s{
	width: 100%;
	font-family: 'NanumSquareNeo';
	font-size: 15px;
	color: #000000;
	display: block;	
}
.list .list-item .list-unstyled .list-link-s:hover,
.list .list-item .list-unstyled .list-link-s:focus,
.list .list-item .list-unstyled .list-link-sactive{
	color: #ce2025;
}

/*================================
    right : 스크립트
================================*/
.navigation .toggle-wrapper span{
  width: 50px;
  height: 50px;  
  text-align: center;
  background: #000000;
  color: inherit;
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  transition: right 0.25s;
  padding: 10px 0 0 0;
}
.navigation .toggle-wrapper .show{
  right: -50px;
}

/* Closed States */
.navigation:not(.open) .toggle-wrapper .show{
  right: 0px;
}
.navigation:not(.open) .toggle-wrapper .hide{
  right: 50px;
}
.navigation .has-menu:not(.open)::after{
  transform: rotate(-90deg);
}
.navigation .has-menu:not(.open) > .menu{
  border-top: none;
  max-height: 0;
}
.navigation .has-menu:not(.open) > .menu > li > a{
  padding-left: 15px;
}

@media (min-width: 1300px){
	.navigation{
		width: 420px;
		height: 100%;
		background-color: rgba(255,255,255,1);
		position: fixed;
		z-index: 9999;
		top: 0;
		right: 0;
		transition: right 0.5s;
	}
	.navigation .toggle-wrapper{
	  border-left: none;
	  height: 50px;
	  width: 50px;
	  overflow: hidden;
	  position: absolute;
	  top: 0;
	  right: 420px;  
	}
	.navigation:not(.open) {
	  right: -420px;
	}
}
@media (min-width: 1400px){
	.navigation{
		width: 470px;
		height: 100%;
		background-color: rgba(255,255,255,1);
		position: fixed;
		z-index: 9999;
		top: 0;
		right: 0;
		transition: right 0.5s;
	}
	.navigation .toggle-wrapper{
	  border-left: none;
	  height: 50px;
	  width: 50px;
	  overflow: hidden;
	  position: absolute;
	  top: 0;
	  right: 470px;  
	}
	.navigation:not(.open) {
	  right: -470px;
	}
}
@media (min-width: 1500px){
	.navigation{
		width: 500px;
		height: 100%;		
		background-color: rgba(255,255,255,1);
		position: fixed;
		z-index: 9999;
		top: 0;
		right: 0;
		transition: right 0.5s;
	}
	.navigation .toggle-wrapper{
	  border-left: none;
	  height: 50px;
	  width: 50px;
	  overflow: hidden;
	  position: absolute;
	  top: 0;
	  right: 500px;  
	}
	.navigation:not(.open) {
	  right: -500px;
	}
}
@media (min-width: 1600px){
	.navigation{
		width: 560px;
		height: 100%;		
		background-color: rgba(255,255,255,1);
		position: fixed;
		z-index: 9999;
		top: 0;
		right: 0;
		transition: right 0.5s;
	}
	.navigation .toggle-wrapper{
	  border-left: none;
	  height: 50px;
	  width: 50px;
	  overflow: hidden;
	  position: absolute;
	  top: 0;
	  right: 560px;  
	}
	.navigation:not(.open) {
	  right: -560px;
	}
}

/*================================
    right : 기본레이아웃
================================*/
.right{
	width: 100%;
	height: 100%;
	overflow: auto;
}
.right_sub{
	border-left: 1px solid #dcdcdc;
}

/*================================
    right : 제품소개
================================*/
.right_product{
	width: 100%;
	overflow: hidden;	
}
.right_product .rpi_btn{
	width: 100%;
	overflow: hidden;
	padding: 16px 0 0 0;
}
.right_product .rpi_btn span img{
	width: 5px;
	vertical-align: middle;
	margin: -3px 0 0 8px;
}
.right_product .swiper-pagination-fraction{
	width: 50px;	
	font-family: 'Gmarket Sans', sans-serif;
	font-weight: 700;
	font-size: 16px;
	color: #cacaca;
	left: 46%;
	bottom: 15px;
}
.right_product .swiper-pagination-current{
	color: #000000;
}
.right_product .swiper-button-next,
.right_product .swiper-button-prev{	
	top: auto;
	bottom: 24px;
	width: 20px;
	height: 13px;
}
.right_product .swiper-button-prev{
	background: url('../images/right/right_pre.png') no-repeat;
	background-size: 20px 13px;
	left: 40%;
}

@media (min-width: 1300px){
	.right_product .right_product_info{
		width: 100%;
		float: left;
		text-align: center;
	}
	.right_product .right_product_img{
		width: 100%;
		float: left;
		text-align: center;
		padding: 20px 0 0 0;
	}
	.right_product .right_product_img img{
		width: 70%;
	}
	.right_product .rpi_btn span{
		width: 110px;
		height: 30px;
		margin: 0 auto;
		border: 1px solid #c5c5c5;
		border-radius: 30px;
		font-size: 14px;
		color: #6a6a6a;
		text-align: center;
		display: block;
	}
	.right_product .swiper-slide{
		width: 100%;
		overflow: hidden;
		padding: 30px 20px 65px 20px;
	}
	.right_product .right_product_info .rpi_title{
		font-weight: 700;
		font-size: 26px;
		color: #000000;
		line-height: 32px;
	}
	.right_product .right_product_info .rpi_text{
		font-size: 15px;
		color: #6a6a6a;
		line-height: 22px;
		padding: 12px 0 0 0;
	}
	.right_product .swiper-button-next{
		background: url('../images/right/right_pre.png') no-repeat;
		transform:rotate(180deg);  
		background-size: 20px 13px;
		right: 36%;
	}
}
@media (min-width: 1400px){
	.right_product .right_product_info{
		width: 100%;
		float: left;
		text-align: center;
	}
	.right_product .right_product_img{
		width: 100%;
		float: left;
		text-align: center;
		padding: 20px 0 0 0;
	}
	.right_product .right_product_img img{
		width: 70%;
	}
	.right_product .rpi_btn span{
		width: 110px;
		height: 30px;
		margin: 0 auto;
		border: 1px solid #c5c5c5;
		border-radius: 30px;
		font-size: 14px;
		color: #6a6a6a;
		text-align: center;
		display: block;
	}
	.right_product .swiper-slide{
		width: 100%;
		overflow: hidden;
		padding: 30px 30px 65px 30px;
	}
	.right_product .right_product_info .rpi_title{
		font-weight: 700;
		font-size: 27px;
		color: #000000;
		line-height: 35px;
	}
	.right_product .right_product_info .rpi_text{
		font-size: 16px;
		color: #6a6a6a;
		line-height: 24px;
		padding: 12px 0 0 0;
	}
	.right_product .swiper-button-next{
		background: url('../images/right/right_pre.png') no-repeat;
		transform:rotate(180deg);  
		background-size: 20px 13px;
		right: 38%;
	}
}
@media (min-width: 1500px){
	.right_product .right_product_info{
		width: 100%;
		float: left;
		text-align: center;
	}
	.right_product .right_product_img{
		width: 100%;
		float: left;
		text-align: center;
		padding: 20px 0 0 0;
	}
	.right_product .right_product_img img{
		width: 70%;
	}
	.right_product .rpi_btn span{
		width: 110px;
		height: 30px;
		margin: 0 auto;
		border: 1px solid #c5c5c5;
		border-radius: 30px;
		font-size: 14px;
		color: #6a6a6a;
		text-align: center;
		display: block;
	}
	.right_product .swiper-button-next{
		background: url('../images/right/right_pre.png') no-repeat;
		transform:rotate(180deg);  
		background-size: 20px 13px;
		right: 38%;
	}
}
@media (min-width: 1600px){
	.right_product .right_product_info{
		width: 50%;
		float: left;
		text-align: left;
	}
	.right_product .right_product_img{
		width: 50%;
		float: left;
		padding-top: 0;
		text-align: left;
	}
	.right_product .right_product_img img{
		width: 100%;
	}
	.right_product .rpi_btn span{
		width: 110px;
		height: 30px;
		margin: 0;
		border: 1px solid #c5c5c5;
		border-radius: 30px;
		font-size: 14px;
		color: #6a6a6a;
		text-align: center;
		display: block;
	}
	.right_product .swiper-button-next{
		background: url('../images/right/right_pre.png') no-repeat;
		transform:rotate(180deg);  
		background-size: 20px 13px;
		right: 40%;
	}
}

/*================================
    right : 정책자금안내
================================*/
.right_banner01{
	width: 100%;
	overflow: hidden;
	background: #d8eaff;	
}
.right_banner01 a > dt{
	width: 30%;
	float: left;
}
.right_banner01 a > dd{
	width: 70%;
	float: left;
}
.right_banner01 a > dt img{
	width: 90%;
	max-width: 115px;
}
.right_banner01 a > dd .right_banner01_title{
	font-family: 'NanumSquareNeoExtraBold';
	font-size: 26px;
	color: #000000;
}
.right_banner01 a > dd .right_banner01_text{
	font-size: 16px;
	color: #737373;
	padding: 3px 0 18px 0;
}
.right_banner01 a > dd .right_banner01_btn > span{
	width: 110px;
	height: 37px;
	background: #FFFFFF;
	font-size: 14px;
	color: #6a6a6a;
	line-height: 37px;
	border-radius: 5px;
	display: block;
	text-align: center;
}
.right_banner01 a > dd .right_banner01_btn > span > img{
	width: 5px;
	vertical-align: middle;
	margin: -3px 0 0 12px;
}

@media (min-width: 1300px){
	.right_banner01 a{
		width: 100%;
		overflow: hidden;
		display: block;
		padding: 35px 0 30px 20px;
	}
}
@media (min-width: 1400px){
	.right_banner01 a{
		width: 100%;
		overflow: hidden;
		display: block;
		padding: 35px 0 30px 48px;
	}
}

/*================================
    right : 공지사항
================================*/
.right_notice_top{
	width: 100%;
	overflow: hidden;
}
.right_notice_top .rnt_more{
	width: 30%;
	float: left;
	text-align: right;
}
.right_notice_top .rnt_more > a{
	width: 27px;
	height: 27px;
	border: 1px solid #d5d5d5;
	border-radius: 50%;
	display: inline-block;
	text-align: center;
	font-size: 0;
	line-height: 0;
	padding: 8px 0 0 0;
}
.right_notice_top .rnt_more > a > img{
	width: 9px;
}
.right_notice_list{
	width: 100%;
	overflow: hidden;
	padding: 17px 0 0 0;
}
.right_notice_list dl{
	width: 100%;
	overflow: hidden;
	font-size: 17px;
	padding: 0 0 3px 0;
}
.right_notice_list dl dt{
	width: 75%;
	float: left;	
	color: #282828;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.right_notice_list dl dd{
	width: 25%;
	float: left;
	text-align: right;
	color: #878787;
}

@media (min-width: 1300px){
	.right_notice{
		width: 100%;
		overflow: hidden;
		padding: 30px 20px;
	}
	.right_notice_top .rnt_title{
		width: 70%;
		float: left;
		font-family: 'NanumSquareNeoBold';
		font-size: 22px;
		color: #000000;
	}
}
@media (min-width: 1400px){
	.right_notice{
		width: 100%;
		overflow: hidden;
		padding: 30px 30px;
	}
	.right_notice_top .rnt_title{
		width: 70%;
		float: left;
		font-family: 'NanumSquareNeoBold';
		font-size: 24px;
		color: #000000;
	}
}

/*================================
    right : 배너
================================*/
.right_banner02{
	width: 100%;
	overflow: hidden;
	border-top: 1px solid #dcdcdc;
}
.right_banner02 > .li_1{
	border-right: 1px solid #dcdcdc;
}
.right_banner02 > li .right_banner02_title img{
	width: 10px;
	margin: 0 0 0 10px;
}
.right_banner02 > li .right_banner02_icon{
	text-align: right;
	line-height: 0;
}

@media (min-width: 1300px){
	.right_banner02 > li{
		width: 50%;
		float: left;
		padding: 30px 20px;
	}
	.right_banner02 > li .right_banner02_title{
		font-family: 'NanumSquareNeoBold';
		font-size: 22px;
		color: #000000;
	}
	.right_banner02 > li .right_banner02_text{
		font-size: 15px;
		color: #6a6a6a;
		line-height: 20px;
		padding: 9px 0 15px 0;
	}
}
@media (min-width: 1400px){
	.right_banner02 > li{
		width: 50%;
		float: left;
		padding: 30px 30px;
	}
	.right_banner02 > li .right_banner02_title{
		font-family: 'NanumSquareNeoBold';
		font-size: 24px;
		color: #000000;
	}
	.right_banner02 > li .right_banner02_text{
		font-size: 16px;
		color: #6a6a6a;
		line-height: 22px;
		padding: 9px 0 15px 0;
	}
}