/*
	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';





/*인사말*/
.greeting_wrap{}
.greeting_wrap .v{
	height:48rem;
	background:url(../_img/sub/greeting_img1.jpg) no-repeat center center / cover;
	border-radius:0px 0px 5rem 5rem
}
.greeting_wrap .item{
	display:flex;
	justify-content: center;
	align-items:flex-start;
}
.greeting_wrap .item h4{
	background:#2e79ec;
	color:#fff;
	padding:5rem;
	font-size:3.4rem;
	font-weight:600;
	border-radius:2rem;
	line-height:1.4;
	transform: translateY(-50%);
}
.greeting_wrap .item h4 small{
	display:block;
	font-size:1.8rem;
	opacity:.5;
	margin-top:2rem;
	font-weight:300;
}

@media(max-width:991.98px){
	.greeting_wrap .v{
		height:38rem;
	}
	.greeting_wrap .item h4{
		padding:4rem;
		font-size:3rem;
	}
	.greeting_wrap .item h4 small{
		font-size:1.6rem;
	}
}
@media(max-width:576.98px){
	.greeting_wrap .v{
		height:30rem;
	}
	.greeting_wrap .item h4{
		padding:3rem;
		font-size:2.4rem;
	}
	.greeting_wrap .item h4 small{
		font-size:1.5rem;
	}
}




/*연혁*/
#sub_wrap.history{
	padding-left:5px;
	padding-right:5px;
}
.history_wrap{
	position:relative;
	
}
.history_wrap .item_container{
	position:relative;
	z-index:2;
}
.history_wrap .item_container .item{
	width:50%;
	text-align:right;
	padding:0 3rem;
	font-size:1.8rem;
	position:relative;
}
.history_wrap .item_container .item + .item{
	margin-top:6rem;
}
.history_wrap .item_container .item::after{
	content:"";
	position:absolute;
	width:10px;
	height:10px;
	background:#2e78ea;
	border-radius:100%;
	top:0;
	margin-top:8px;
}

.history_wrap .item_container .item .year{
	font-size:2.4rem;
	font-weight:500;
	margin-bottom:2rem;
}
.history_wrap .item_container .item > ul{
	list-style:none;
	padding:0;
}
.history_wrap .item_container .item > ul > li{
	padding:0px 10px;
	position:relative;
}
.history_wrap .item_container .item > ul > li::after{
	content:"·";
	position:absolute;
}
.history_wrap .item_container .item .img{
	border:1px solid #ddd;
	padding:2rem;
	display:inline-block;
	margin-top:2rem;
	max-width:36rem;
	width:100%;
	text-align:center;
}


.history_wrap .history_line{
	position:absolute;
	width:2px;
	height:100%;
	left:50%;
	top:0;
	margin-left:-1px;
	background:#e9e9e9;
}
.history_wrap .history_line::after{
	content:"";
	position:absolute;
	width:26px;
	height:26px;
	border:1px solid #2e78ea;
	border-radius:100%;
	left:50%;
	transform:translateX(-50%);
	background:#fff;
}
.history_wrap .history_line .bar{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	background:#2e78ea
}



.history_wrap .item_container .item:nth-child(2n){}
.history_wrap .item_container .item:nth-child(2n)::after{
	right:0;
	transform:translateX(50%);
}
.history_wrap .item_container .item:nth-child(2n) li::after{
	right:0;
}

.history_wrap .item_container .item:nth-child(2n+1){
	margin-left:auto;
	text-align:left;
}
.history_wrap .item_container .item:nth-child(2n+1)::after{
	left:0;
	transform:translateX(-50%);
}
.history_wrap .item_container .item:nth-child(2n+1) > ul > li::after{
	left:0;
}

@media(max-width:767.98px){
	.history_wrap .item_container .item .year{
		font-size:2rem;
	}
	.history_wrap .item_container .item {
		padding: 0 2rem;
		font-size: 1.5rem;
	}
	.history_wrap .item_container .item > ul > li {
		padding: 0px 6px;
		position: relative;
	}
	.history_wrap .item_container .item .img{
		padding:1rem;
	}
	.history_wrap .item_container .item + .item {
		margin-top: 4rem;
	}
	.history_wrap .item_container .item::after{
		width:6px;
		height:6px;
		margin-top:7px;
	}
	.history_wrap .history_line::after{
		content:"";
		position:absolute;
		width:20px;
		height:20px;
		border:1px solid #2e78ea;
		border-radius:100%;
		left:50%;
		transform:translateX(-50%);
		background:#fff;
	}
	.history_wrap .item_container .item .img img{
		width:100%;
	}
}





/*ci*/
.ci_wrap{}
.ci_wrap .sym_block,
.ci_wrap .sym_block2{
	display:flex;
	align-items: center;
	justify-content: center;
	height:30rem;
}
.ci_wrap .sym_block2 img{
	mix-blend-mode: multiply;
}
.ci_wrap .sym_block::after{
	background:#eaf7ff;
}
.ci_wrap .sym_block2::after{
	background:#f9f9f9;
}

.ci_wrap .sym_box{
	border:1px solid #ddd;
	background:url(../_img/comm/box_line.jpg) left top ;
	padding:5rem;
	display:flex;
	align-items: center;
	justify-content: center;
}
.ci_wrap .sym_box2{
	border:1px solid #ddd;
	padding:3rem;
	display:flex;
	align-items: center;
	justify-content: center;
}

@media(max-width:576.98px){
	.ci_wrap .sym_block,
	.ci_wrap .sym_block2{
		height:25rem;
	}
}


/*관련법령 및 정관*/
.law_wrap{}
.law_wrap a{
	display:block;
	padding:3rem 4rem;
	border:1px solid #dddddd;
	border-radius:1.8rem;
	position:relative;
	margin-bottom:3rem;
	min-height:20rem;
	transition:all .3s;
	background:#fff;
}
.law_wrap a:hover{
	border:1px solid #2e79ec;
	box-shadow: 0px 0px 20px rgba(46,121,236,.3);
}

.law_wrap a i{
	position:absolute;
	background:#ddd;
	color:#fff;
	width:6rem;
	height:6rem;
	border-radius:100%;
	display:flex;
	align-items: center;
	justify-content: center;
	font-size:2.4rem;
	right:4rem;
	bottom:3rem;
	transition: all .3s;
}
.law_wrap a:hover i{
	background:#2e79ec
}
.law_wrap a strong{
	font-size:2.4rem;
	font-weight:500;
	color:#000;
}

@media(max-width:1199.98px){
	.law_wrap a{
		padding:2rem 3rem;
		border-radius:1.5rem;
		min-height:18rem;
	}
	.law_wrap a strong{
		font-size:2rem;
	}
	.law_wrap a i{
		width:5rem;
		height:5rem;
		font-size:2rem;
		right:2rem;
		bottom:2rem;
	}
}



/*오시는길*/
.location_wrap{}
.location_wrap .sec_map{}
.location_wrap .sec_map .root_daum_roughmap{
	width:100% !important;
}
.location_wrap .sec_map .root_daum_roughmap .hide,
.location_wrap .map_border {
	display:none;
}
.location_wrap .sec_info .info{
	border-left:1px solid #ddd;
	padding-left:80px;
}

@media(max-width:1199.98px){
	.location_wrap .sec_info .info{
		padding-left:50px;
	}
}

@media(max-width:991.98px){
	.location_wrap .sec_info .info{
		padding-left:15px;
		border-left:0;
		margin-top:40px;
	}
	.location_wrap .sec_info .info .dp-flex{
		display:block
	}
}


/*소금품질검사*/
.quality_wrap{}
.quality_wrap .in_box{
	border:1px solid #ddd;
	padding:3rem;
	border-radius:3rem;
	margin-bottom:3rem;
	position:relative;
}
.quality_wrap > .row > div:nth-child(6) .in_box{
	padding:3.9rem 3rem;
}
.quality_wrap .in_box::after{
	content:"";
	font-family: "xeicon";
	position:absolute;
	width:40px;
	height:40px;
	border:1px solid #ddd;
	display:flex;
	align-items: center;
	justify-content: center;
	border-radius:100%;
	font-size:1.2rem;
	color:#2e79ec;
	background:#fff;
	z-index:1;
}
.quality_wrap .in_box.last::after{
	display:none;
}
.quality_wrap .dp-box{
	display:flex;
	align-items: center;
}
.quality_wrap .dp-box .num{
	font-weight:600;
	color:#2e79ec;
	width:8rem;
	flex-shrink: 0;
	text-align:center;
	padding-right:3rem;
}
.quality_wrap .dp-box .ico{}
.quality_wrap .dp-box .ico img{
	width:12rem;
}
.quality_wrap .dp-box .text{
	padding-left:4rem;
}
.quality_wrap .dp-box .text > p strong{
	font-weight:500;
	font-size:2rem;
}
.quality_wrap .dp-box .text > .desc{
	list-style:none;
	padding:0;
	font-size:1.8rem;
	line-height:1.7;
}
.quality_wrap .dp-box .text > .desc li{
	display:flex;
}
.quality_wrap .dp-box .text > .desc li > span{
	width:15px;
	flex-shrink: 0;
}
.quality_wrap .in_box > .photo{
	margin-top:3rem;
	padding-left:8rem;
}

.quality_wrap > .row > div:nth-child(1){order:1;}
.quality_wrap > .row > div:nth-child(2){order:1;}
.quality_wrap > .row > div:nth-child(3){order:4;}
.quality_wrap > .row > div:nth-child(4){order:3;}
.quality_wrap > .row > div:nth-child(5){order:5;}
.quality_wrap > .row > div:nth-child(6){order:6;}

.quality_wrap > .row > div:nth-child(1) .in_box::after{
	right:0;
	top:50%;
	transform:translate(50%, -50%) rotate(-90deg);
}
.quality_wrap > .row > div:nth-child(2) .in_box::after,
.quality_wrap > .row > div:nth-child(4) .in_box::after,
.quality_wrap > .row > div:nth-child(6) .in_box::after{
	left:50%;
	bottom:0;
	transform:translate(-50%, 50%);
}
.quality_wrap > .row > div:nth-child(3) .in_box::after{
	left:0;
	top:50%;
	transform:translate(-50%, -50%) rotate(90deg);
}
.quality_wrap > .row > div:nth-child(5) .in_box::after{
	right:0;
	top:0;
	transform:translate(50%, 8rem) rotate(-90deg);
}
@media(max-width:1199.98px){
	.quality_wrap .in_box::after{
		left:50% !important;
		right:auto !important;
		top:auto !important;
		bottom:0 !important;
		transform:rotate(0deg) translate(-50%, 50%)  !important;
	}
	.quality_wrap > .row > div:nth-child(6) .in_box {
		padding: 3rem 3rem;
	}
}
@media(max-width:991.98px){
	.quality_wrap .in_box::after {
		width: 30px;
		height: 30px;
	}
	.quality_wrap .in_box,
	.quality_wrap > .row > div:nth-child(6) .in_box {
		padding: 3rem 2rem;
	}
	.quality_wrap .dp-box .num {
		width: 6rem;
		padding-right: 1rem;
	}
	.quality_wrap .dp-box .ico img {
		width: 10rem;
	}
	.quality_wrap .dp-box .text {
		padding-left:3rem;
	}
	.quality_wrap .dp-box .text > p strong {
		font-size: 1.8rem;
	}
	.quality_wrap .dp-box .text > .desc {
		font-size: 1.6rem;
	}
}
@media(max-width:576.98px){
	.quality_wrap .in_box,
	.quality_wrap > .row > div:nth-child(6) .in_box {
		padding: 3rem 2rem 3rem .5rem;
	}
	.quality_wrap .dp-box .num {
		padding-right: 0rem;
	}
	.quality_wrap .dp-box .ico img {
		width: 8rem;
	}
	.quality_wrap .dp-box .text {
		padding-left:2rem;
	}
	.quality_wrap .in_box > .photo {
		margin-top: 3rem;
		padding-left: 6rem;
	}
}



/*seasalt_wrap*/
#sub_wrap.seasalt{
	padding-bottom:0;
}
.seasalt_wrap{}
.seasalt_wrap .sec01{
	padding-bottom:10rem;
}
.seasalt_wrap .sec01 .item{
	text-align:center;
}
.seasalt_wrap .sec01 .item .dp-flex{
	align-items: center;
	justify-content: center;
}
.seasalt_wrap .sec01 .item .dp-flex > div:nth-child(1){
	width:6.2rem;
	flex-shrink: 0;
	margin-right:4rem;
}
.seasalt_wrap .sec01 .item > div + div .dp-flex{
	border-left:1px solid #ddd;
}

.seasalt_wrap .sec02{
	padding:10rem 0 12rem 0;
}
.seasalt_wrap .sec02::after{
	background:#eaf7ff
}
.seasalt_wrap .nutrient{
	flex-wrap: wrap;
}
.seasalt_wrap .nutrient p{
	width:10rem;
	height:10rem;
	display:flex;
	align-items: center;
	justify-content: center;
	background:#fff;
	font-size:1.7rem;
	font-weight:500;
	border-radius:100%;
	margin-right:10px;
	margin-top:10px;
}
.seasalt_wrap .nutrient p:hover{
	background:#2e78ea;
	color:#fff;
}

@media(max-width:991.98px){
	.seasalt_wrap .sec01 .item .dp-flex > div:nth-child(1){
		width:5rem;
		flex-shrink: 0;
		margin-right:2rem;
	}
}
@media(max-width:767.98px){
	.seasalt_wrap .sec01 {
		padding-bottom: 8rem;
	}
	.seasalt_wrap .sec01 .item .dp-flex{
		flex-wrap:wrap;
		width:100%;
		border:none !important;
	}
	.seasalt_wrap .sec01 .item .dp-flex > div{
		width:100% !important;
		margin:0 !important;
		margin-top:10px !important;
	}
	.seasalt_wrap .nutrient p{
		width:8rem;
		height:8rem;
		font-size:1.6rem;
	}
}


/*production_wrap*/
.production_wrap{
	overflow:hidden;
	padding:0px 10px;
}
.production_wrap .thum{
	position:relative;
}
.production_wrap .thum .num{
	position:absolute;
	left:-10px;
	bottom:-10px;
	width:6.5rem;
	height:7rem;
	font-size:2.6rem;
	font-weight:500;
	color:#fff;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius:0px 0px 1.4rem 0;
}
.production_wrap .thum .bar{
	height:5px;
	position:absolute;
	left:0;
	bottom:0;
	width:calc(100% + 6rem);
}

.production_wrap .row > div:nth-child(4) .thum .bar,
.production_wrap .row > div:nth-child(8) .thum .bar{
	width:100%;
}

.production_wrap .thum img{
	width:100%;
}
.production_wrap dl{
	padding:3rem;
	border:1px solid #ddd;
	border-top:0;
	border-radius:0px 0px 2rem 2rem;
}
.production_wrap dl dt{
	font-size:2.6rem;
	font-weight:500;
	margin-bottom:1rem;
}
.production_wrap dl dd{
	line-height:1.6;
	font-size:1.8rem;
	font-weight:300;
}

@media(max-width:1440px){
	.production_wrap .row.row-xl {
		margin-left: -15px;
		margin-right: -15px;
	}
	.production_wrap .row.row-xl > [class^='col-'] {
		padding-left: 15px;
		padding-right: 15px;
	}
	.production_wrap .thum .bar{
		width:calc(100% + 4rem);
	}
	.production_wrap dl {
		padding: 3rem 2rem;
	}
}
@media(max-width:1199.98px){
	.production_wrap .thum .num{
		left:-6px;
		bottom:-6px;
		width:5rem;
		height:5.5rem;
		font-size:2rem;
	}
	.production_wrap dl dt{
		font-size:2.2rem;
		font-weight:500;
		margin-bottom:1rem;
	}
	.production_wrap dl dd{
		line-height:1.6;
		font-size:1.6rem;
		font-weight:300;
		min-height:8rem;
	}
	.production_wrap dl dd br{
		display:none;
	}
}
@media(max-width:991.98px){
	.production_wrap .thum .bar{
		height:3px;
		width:calc(100%);
	}
	.production_wrap dl dd{
		min-height:6rem;
	}
}

@media(max-width:767.98px){
	.production_wrap .row.row-xl {
		margin-left: -10px;
		margin-right: -10px;
	}
	.production_wrap .row.row-xl > [class^='col-'] {
		padding-left: 10px;
		padding-right: 10px;
	}
}
@media(max-width:576.98px){
	.production_wrap .thum .num{
		width:4.5rem;
		height:5rem;
		font-size:1.8rem;
	}
	.production_wrap dl dt{
		font-size:2rem;
	}
	.production_wrap dl dd{
		font-size:1.5rem;
	}
}



/*sale_wrap*/
#sub_wrap.sale{padding-bottom:0;}
.sale_wrap{
	padding-bottom:12rem;
}
.sale_wrap::after{
	background:#eaf7ff;
	top:auto;
	height:62%;
}

.sale_wrap .info{
	margin-top:14rem;
	list-style:none;
	padding:0;
}
.sale_wrap .info > li{
	display:flex;
	font-size:2rem;
}
.sale_wrap .info > li + li{
	margin-top:3rem;
}
.sale_wrap .info > li strong{
	flex-shrink: 0;
	width:16rem;
}

.sale_wrap .mySwiper{
	overflow:hidden;
	border-radius:6rem 0 0 0;
	position:relative;
}
.sale_wrap .mySwiper .control{
	position:absolute;
	right:0;
	bottom:0;
	z-index:5;
	display:flex;
}
.sale_wrap .mySwiper .control > div{
	width:7rem;
	height:7rem;
	background:rgba(0,0,0,.7);
	display:flex;
	align-items: center;
	justify-content: center;
	color:#fff;
	font-size:2rem;
	position:relative;
}
.sale_wrap .mySwiper .control > div:hover{
	color:#2e78ea
}
.sale_wrap .mySwiper .control > div:nth-child(1):after{
	content:"";
	position:absolute;
	right:0;
	top:50%;
	transform:translateY(-50%);
	height:2rem;
	border-right:1px solid rgba(255,255,255,.3);
}

@media(max-width:1199.98px){
	.sale_wrap .info{
		margin-top:5rem;
	}
	.sale_wrap .info > li + li {
		margin-top: 2rem;
	}
}
@media(max-width:991.98px){
	.sale_wrap .mySwiper .control > div{
		width:5rem;
		height:5rem;
		font-size:1.8rem;
	}
	.sale_wrap .info > li{
		font-size:1.8rem;
	}
}
@media(max-width:576.98px){
	.sale_wrap .info{
		margin-top:4rem;
	}
	.sale_wrap .info > li{
		font-size:1.7rem;
	}
	.sale_wrap .info > li strong {
		width: 13rem;
	}
}



/*business_wrap*/
.business_wrap{}
.business_wrap .title{
	justify-content: space-between;
}
.business_wrap .title .btn_go a{
	display:flex;
	align-items: center;
	justify-content: center;
	font-size:1.6rem;
	font-weight:500;
	color:#fff;
	background:#2e79ec;
	height:6rem;
	width:22rem;
}
.business_wrap .title .btn_go a i{
	margin-left:2rem;
}
.business_wrap .info p{
	color:#2e78ea;
}
.business_wrap .info .item{
	border:1px solid #2e78ea;
	display:block;
	width:100%;
	padding:15px 10px;
	text-align:center;
	font-size:1.8rem;
	border-radius:1rem;
	font-weight:500;
}
.business_wrap .info ul{
	list-style:none;
	padding:0;
}
.business_wrap .info ul li{
	display:flex;
	font-size:1.8rem;
}
.business_wrap .info ul li + li{
	margin-top:1rem;
}
.business_wrap .info ul li span{
	flex-shrink: 0;
	width:14px;
}

@media(max-width:1199.98px){
	.business_wrap .title{
		display:block;
	}
	.business_wrap .title p{
		margin-top:2rem;
	}
}
@media(max-width:991.98px){
	.business_wrap .info ul li,
	.business_wrap .info .item{
		font-size:1.6rem;
	}