/*================================================================================================
    TOP : 기본레이아웃
================================================================================================*/
.top{
	width: 100%;
	height: 70px;
	background: #FFFFFF;
	position: fixed;
	z-index: 99;	
}
.top .top_logo{
	width: 27%;
	float: left;
}
.top .top_menu{
	width: 73%;
	float: left;
	text-align: right;
}
.changed{
	border-bottom: 1px solid #e3e3e3;
}

@media (max-width: 575px){
	.top .top_logo{
		width: 45%;
		float: left;
	}
	.top .top_menu{
		width: 55%;
		float: left;
		text-align: right;
	}
}

/*================================================================================================
    TOP : 로고
================================================================================================*/
.top .top_logo{
	font-size: 0;
	line-height: 0;
}
.top .top_logo img{
	width: 100%;
	height: 69px;
}

/*================================================================================================
    공통 : 모바일메뉴
================================================================================================*/
html.open{
	overflow: hidden;
}
.moble_menu{
	display: inline-block;
	padding: 10px 0 0 0;
}
.moble_navbar{
	width: 30px;	
}
.moble_navbar > a{
	width: 100%;
	height: 45px;
	position: relative;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.moble_navbar > a > span{
	width: 100%;
	height: 3px;
	position: absolute;
	display: block;
	background-color: #010101;
	transition: all 0.5s;
}
.changed .moble_navbar > a > span{
	background-color: #010101;
}

.moble_navbar > a{
	width: 100%;
	height: 45px;
	position: relative;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.moble_navbar > a > span:nth-child(1){
	top: 11px;
	left: 0;
}
.moble_navbar > a > span:nth-child(2){
	top: calc(47%);
	left: 0;
}
.moble_navbar > a > span:nth-child(3){
	bottom: 11px;
	right: 0;
}
.moble_navbar.on > a > span:nth-child(1){
	transform: rotate(45deg);
	top: 50%;
	left: 0;
}
.moble_navbar.on > a > span:nth-child(2){
	opacity: 0;
	left: 0;
}
.moble_navbar.on > a > span:nth-child(3){
	transform: rotate(-45deg);
	bottom: calc(50% - 2px);
	right: 0;
}

.moble_menu .on > a > span{
	background-color: #000;
}

.mobile-gnb-wrap{
	width: 100%;
	height: 100%;
	z-index: 105;
	position: fixed;
	top: -100%;
	left: 0;
	display: block;
	background-color:#fff;
	transition: top 0.5s;
}
.mobile-gnb-wrap.on {
	top: 70px;	
}
.mobile-gnb-wrap .mobile-gnb{
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-top: 40px;
}
.mobile-gnb-wrap .mobile-gnb_list{
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;	
}
.mobile-gnb-wrap .mobile-gnb_item{
	width: 100%;
	height: auto;	
}
.mobile-gnb-wrap .mobile-gnb_link {
	color: #151515;
	display: flex;
	align-items: center;
	font-weight: 600;
	padding: 0px 20px;
	height: auto;
	position: relative;
	width: 100%;
	padding-bottom: 20px;
	padding-top: 20px;
	font-size:16px
}
.mobile-gnb-wrap .mobile-gnb_link:after{
	content: "";
	background: url(https://upsisa.ybmnet.co.kr/new_business/ybmengloo_com_PHP/images/common/i-chevron-down-bk.svg);
	display: inline-block;
	position: static;
	width: 16px ;
	height: 16px;
	transform: translateX(0);
    vertical-align: middle;
	line-height: 1;
	margin-left: auto;
	transition: all .3s;
}
.mobile-gnb-wrap.std .mobile-gnb_link:after, .mobile-gnb-wrap.par .mobile-gnb_link:after{
	transform: rotate(-90deg);
}
.mobile-gnb-wrap .mobile-gnb_item.open .mobile-gnb_link:after{
	transform: rotate(180deg);
	transition: all .3s;
}

.mobile-gnb-wrap .moblieSnb-menu{
	position: static;
	transform: none;
	visibility: visible;
	display: none;
	background-color: #fffaf4;
	padding-bottom: 25px;
	padding-top: 25px;
}
.mobile-gnb-wrap .moblieSnb-menu_item{
	text-align: left;
	padding: 0 30px;
}
.mobile-gnb-wrap .moblieSnb-menu_item + .moblieSnb-menu_item{
	margin-top: 15px;
}
.mobile-gnb-wrap .moblieSnb-menu_link{
	font-size: 14px;
	color: #333;
	white-space: nowrap;
	font-weight: 600;
}
.mobile-gnb-wrap .mobile-gnb_item.open .moblieSnb-menu {
	display: block;
}

/*================================================================================================
    하단배너
================================================================================================*/
.bottom_banner{
	width: 100%;
	overflow: hidden;
	background-color: rgba(243, 246, 248, 1.0);
	padding: 2.105rem 0 0 0;
}
.bottom_banner > .wrap > ul{
	width: 101%;
	overflow: hidden;
}
.bottom_banner > .wrap > ul > li{
	width: 50%;
	padding: 0 1% 10px 0;
	float: left;
}
.bottom_banner > .wrap > ul > li a{
	display: block;
}
.bottom_banner > .wrap > ul > li a > dl{
	width: 100%;
	overflow: hidden;
	background-color: rgba(255, 255, 255, 1.0);
	border-radius: 10px;
	padding: 1.579rem 1.579rem;
}
.bottom_banner > .wrap > ul > li a > dl > dt{
	width: 32%;
	float: left;
	font-size: 0;
	line-height: 0;
}
.bottom_banner > .wrap > ul > li a > dl > dd{
	width: 68%;
	float: left;
}
.bottom_banner > .wrap > ul > li a > dl > dt img{
	height: 50px;
}
.bottom_banner > .wrap > ul > li a > dl > dd > .bottom_banner_title{
	font-weight: 500;
	font-size: 1rem;
	color: #010101;
}
.bottom_banner > .wrap > ul > li a > dl > dd > .bottom_banner_text{
	font-size: 0.842rem;
	color: #585858;
}

@media (max-width: 575px){
	.bottom_banner > .wrap > ul{
		width: 100%;
		overflow: hidden;
	}
	.bottom_banner > .wrap > ul > li{
		width: 100%;
		padding: 0 0% 10px 0;
		float: left;
	}
}


/*================================================================================================
    하단링크
================================================================================================*/
.bottom_link{
	width: 100%;
	overflow: hidden;
	background-color: rgba(243, 246, 248, 1.0);
	padding: 0.789rem 0 2.368rem 0;
}
.bottom_link > .wrap{
	background-color: rgba(255, 255, 255, 1.0);
	border-radius: 10px;
	padding: 0.526rem 1.053rem;
}
.bottom_link > .wrap > ul{
	width: 104%;
	overflow: hidden;	
}
.bottom_link > .wrap > ul > li{
	width: 33.33333333333333%;
	padding: 0 4% 0 0;
	float: left;
}
.bottom_link > .wrap > ul > li img{
	width: 100%;
}

@media (max-width: 575px){
	.bottom_link{
		width: 100%;
		overflow: hidden;
		background-color: rgba(243, 246, 248, 1.0);
		padding: 0.789rem 15px 2.368rem 15px;
	}
	.bottom_link > .wrap{
		background-color: rgba(255, 255, 255, 1.0);
		border-radius: 10px;
		padding: 0.526rem 1.053rem;		
	}
	.bottom_link > .wrap > ul{
		width: 102%;
		overflow: hidden;	
	}
	.bottom_link > .wrap > ul > li{
		width: 50%;
		padding: 0 2% 0 0;
		float: left;
	}
}

/*================================================================================================
    카피라이터 메뉴,sns : 기본레이아웃
================================================================================================*/
.compyright_top{
	width: 100%;
	overflow: hidden;
	border-bottom: 1px solid #dadada;
}
.compyright_top .compyright_top_menu{
	width: 70%;
	float: left;
}
.compyright_top .compyright_top_sns{
	width: 30%;
	float: left;
	text-align: right;
}

@media (max-width: 575px){
	.compyright_top .compyright_top_menu{
		width: 80%;
		float: left;
	}
	.compyright_top .compyright_top_sns{
		width: 20%;
		float: left;
		text-align: right;
	}
}

/*================================================================================================
    카피라이터 메뉴
================================================================================================*/
.compyright_top .compyright_top_menu ul li{
	float: left;
}
.compyright_top .compyright_top_menu ul li a{
	font-size: 0.895rem;
	color: #292929;
	line-height: 1rem;
	display: block;
	padding: 1.474rem 1.842rem 1.579rem 0;
}

@media (max-width: 575px){
	.compyright_top .compyright_top_menu ul li a{
		font-size: 0.842rem;
		color: #292929;
		line-height: 1rem;
		display: block;
		padding: 1.316rem 0.789rem 0.789rem 0;
	}
	.compyright_top .compyright_top_menu ul .li_e a{
		padding-right: 0;
	}
}

/*================================================================================================
    카피라이터 sns
================================================================================================*/
.compyright_top .compyright_top_sns a{
	width: 38px;
	height: 38px;
	background-color: rgba(242, 242, 242, 1.0);
	border-radius: 50%;
	display: inline-block;
	text-align: center;
	padding: 0.526rem 0 0 0;
	margin: 1.053rem 0 0 0;
}

@media (max-width: 575px){
	.compyright_top .compyright_top_sns a{
		width: 32px;
		height: 32px;
		background-color: rgba(242, 242, 242, 1.0);
		border-radius: 50%;
		display: inline-block;
		text-align: center;
		padding: 0.526rem 0 0 0;
		margin: 0.789rem 0 0.789rem 0;
	}
}

/*================================================================================================
    카피라이터 정보
================================================================================================*/
.copyright{
	width: 100%;
	overflow: hidden;
	padding: 2.105rem 0 1.579rem 0;
}
.copyright .copyright_left{
	width: 100%;
	padding: 0 0 1.053rem 0;
}
.copyright .copyright_center{
	width: 100%;
	float: left;
}
.copyright .copyright_right{
	width: 100%;
	float: left;
	text-align: right;
}
.copyright .copyright_left img{
	width: 100%;
	max-width: 188px;
}
.copyright .copyright_center p{
	font-size: 0.842rem;
	color: #7c7c7c;
	line-height: 1.474rem;
}
.copyright .copyright_center .p_4{
	padding: 0.895rem 0 0 0;
}
.copyright .copyright_center p span{
	padding: 0 1.053rem 0 0;
}
.copyright .copyright_right p a{
	font-size: 0.842rem;
	color: #292929;
	line-height: 1.474rem;
}

@media (max-width: 575px){
	.copyright .copyright_right{
		width: 100%;
		float: left;
		text-align: right;
		padding: 0.526rem 0 0 0;
	}
	.copyright .copyright_center p{
		font-size: 0.842rem;
		color: #7c7c7c;
		line-height: 1.263rem;
	}
}