@charset "utf-8";

/* ===================================================================
 *  01. helper  
 *  곽병문
 *  edit 2019.11.18
 * ------------------------------------------------------------------- */
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url("../css/preloader.gif") center no-repeat #fff;
}



.no_shadow
{
	-webkit-box-shadow: none!important;
	box-shadow: none!important;

	
}

.ff
{
	-webkit-transform:skew(-0.001deg) ;
	-ms-transform:skew(-0.001deg) ;
	-o-transform: skew(-0.001deg);
	transform:skew(-0.001deg) ;
}

[aria-current="page"]
{
	font-weight: bold!important;
}

.trans
{
	background-color: transparent!important;
	position: relative;
}
.allcenter
{
	text-align: center;
	align-items: center;
	display: flex;
	display: -webkit-flex;
	-ms-flex-align: center;
	-webkit-flex-align: center;	
	-webkit-align-items: center;
	-webkit-box-align: center;
	justify-content: center;
}
/*fancy error control*/

.fancybox-navigation .fancybox-button
{
	   
   z-index: -99999!important;
	
}
/*history*/
.history_table
{
	border-bottom: 2px solid #444;
	border-top: 2px solid #444;
	margin-bottom: 20px;
	width: 100%;
}
.history_table .th_ask,
.history_table .th_chk
{
	width: 60px !important;
}
.history_td
{
	border-bottom: 0px !important;
	margin: 0px;
	padding: 0px !important;
}
.history_list
{
	list-style: none;
	margin: 0px;
	padding: 0px;
	width: 100%;
}
.history_list li
{
	margin: 0px;
	min-height: 50px;
	overflow: hidden;
	padding: 0px;
	position: relative;
	transition-duration: 0.2s;
	transition-timing-function: ease;
	webkit-transition-duration: 0.2s;
	webkit-transition-timing-function: ease;
	width: 100%;
}
.history_list li:hover
{
	background: #191919;
	transition-duration: 0.2s;
	transition-timing-function: ease;
	webkit-transition-duration: 0.2s;
	webkit-transition-timing-function: ease;
}
.history_list li dl
{
	margin: 0px;
	overflow: hidden;
	padding: 0px;
	text-align: left;
	width: 100%;
}
.history_list li dl dt
{
	color: #999;
	float: left;
	font-family: 'Century Gothic','Malgun Gothic';
	font-size: 30px;
	font-weight: bold;
	margin: 0px;
	padding: 25px 20px 20px;
	position: relative;
	text-align: right;
	transition-duration: 0.2s;
	transition-timing-function: ease;
	webkit-transition-duration: 0.2s;
	webkit-transition-timing-function: ease;
	width: 50%;
}
.history_list li dl dd
{
	color: #999;
	float: left;
	font-size: 13px;
	line-height: 1.8em;
	margin: 0px;
	padding: 30px 20px 20px;
	text-align: left;
	width: 50%;
}
.history_list li:nth-child(even) dl dt
{
	float: right;
	text-align: left;
}
.history_list li:nth-child(even) dl dd
{
	float: right;
	text-align: right;
}
.history_list li .history_chk
{
	left: 0px;
	position: absolute;
	top: 0px;
}
.history_list li .hstr_line
{
	background: #666;
	bottom: 0px;
	left: 50%;
	position: absolute;
	top: 0px;
	width: 1px;
}
.history_list li .hstr_dot
{
	background: #fff;
	border: 5px solid #666;
	border-radius: 50%;
	height: 18px;
	left: 50%;
	margin-left: -9px;
	position: absolute;
	top: 36px;
	transition-duration: 0.2s;
	transition-timing-function: ease;
	webkit-transition-duration: 0.2s;
	webkit-transition-timing-function: ease;
	width: 18px;
}
.history_list li:hover dl dt
{
	color: #fff;
	transition-duration: 0.2s;
	transition-timing-function: ease;
	webkit-transition-duration: 0.2s;
	webkit-transition-timing-function: ease;
}
.history_list li:hover .hstr_dot
{
	border: 5px solid #444;
	color: #fff;
	transition-duration: 0.2s;
	transition-timing-function: ease;
	webkit-transition-duration: 0.2s;
	webkit-transition-timing-function: ease;
}
.history_list li.bo_notice
{
	border-bottom: 2px dashed #444;
	padding: 30px 10px;
}
.history_list li.bo_notice .history_h2
{
	color: #ddd;
	font-size: 28px;
	padding: 0 15px 20px;
	text-align: center;
}
.history_list li.bo_notice .history_cont
{
	color: #999;
	font-size: 13px;
	text-align: center;
	width: 100%;
}
.history_list li:hover.bo_notice
{
	background: none;
}
.history_list li a.btn_b02
{
	clear: both;
	float: right;
	margin-top: 10px;
}
@media all and (max-width: 650px)
{
	.history_list li
	{
	}
	.history_list li dl dt
	{
		float: none !important;
		padding-bottom: 0px;
		padding-top: 30px;
		text-align: center !important;
		width: 100%;
	}
	.history_list li dl dd
	{
		float: none !important;
		margin: 15px;
		padding-top: 10px;
		position: relative;
		text-align: center !important;
		width: auto;
		z-index: 1;
	}
	.history_list li .hstr_line
	{
		background: #242424;
		border-bottom: 2px dashed #444;
		bottom: auto;
		height: 18px;
		left: 0px;
		top: 0px;
		width: 100%;
	}
	.history_list li .hstr_dot
	{
		top: 8px;
	}
	.history_list li.bo_notice
	{
		border-bottom: 0px;
	}
}
/* ------------------------------------------------------------------- 
 * links 
 * ------------------------------------------------------------------- */

a{
	color: #333333;
	line-height: inherit;
	text-decoration: none!important;	
	-webkit-text-decoration-skip: objects;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
a:hover,
a:focus,
button:focus
{
	color: crimson;
    outline: none;	
	text-decoration: none;
}


/*button*/
/*-- 큰버튼으로 최종결정버튼에 활용--*/
[data-btn] {
  display: inline-block;
  padding: 12px 18px;
  text-decoration: none;
  position: relative;
  border: 2px solid #555;
  border-radius: 3px;
  text-transform: uppercase;
  text-align: left;
  color: #555;
  overflow: hidden;
}

[data-btn].cancel,[data-btn].cancel:before, [data-btn].cancel:after
{
 color: gray;
  background-color:rgba(87,87,87,1.00);	
}



/* ===================================================================
 *  02. basic  
 *  곽병문
 *  edit 2019.11.18
 * ------------------------------------------------------------------- */


@media only screen and (max-width:758px)
{
	a, button, input, select, textarea,
		a:focus, button:focus, input:focus, select:focus, textarea:focus
	{
		outline: none!important;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
	}
}


	/* 우측 공통 -  바로가기 모음 */
@media only screen and (min-width:1201px)
{
	.not_scrolling #floating
	{
		z-index: 50;
	}
	#floating
	{
		background-color: #19161c;
		height: 100%;
		position: fixed;
		right: -110px;
		top: 0;		
		-webkit-transition: all 0.3s ease-in-out;
		-transition: all 0.3s ease-in-out;
		width: 170px;
		z-index: 19900;
		
	}
	#floating .active_text
	{
		display: block;
		opacity: 0;
		text-align: left;
		transform: scaleX(0);
		transition: opacity 0.1s linear;
		visibility: hidden;
	}
	#floating .quick-head
	{
		background:crimson;
		height: 130px;
		position: relative;
		padding: 0 1.2rem;
	}
	#floating .quick-head:before
	{
		border-bottom: 1.2rem solid #19161c;
		border-left: 60px solid transparent;
		bottom: 0;	
		display: block;
		left: 0;
		position: absolute;
		width: 100%;
	}


	#floating .quick-head  strong
	{
		color: #fff!important;
		display: block;
		font-size:1rem;
		line-height: 130%;
		text-align: center;		  
	    padding-top: 2.1rem;
		font-weight: 800!important;
		cursor: pointer;
		width:1rem;
	}

	
	#floating ul li
	{
		border-bottom:1px solid rgba(38,35,41,1);
		background-color: #19161c;
		align-content: center;
		position: relative;
	}
	#floating ul li .cart_cnt
	{
		position: absolute;
		z-index: 2;
		top:10%;
		background-color:rgba(217,16,19,1.00);
		display: block;
		left:2rem;
		width: 20px;		
		float: left;
		height:20px!important;
		color: white;
		border-radius: 50%;
		text-align: center;
		font-size: 0.6vw;
		line-height: 22px;
	}
	#floating ul li a
	{
		
		display: block;
		height: 65px;
		line-height: 65px;
		padding: 1.3rem 0.8rem 0 1.2rem;
		position: relative;
		text-align: left;
		text-decoration: none;
		width:100%;
		
	}
	#floating ul li a span
	{
	
		float: left;
		display: block;
		width:30%;
		height:100%;
		font-size: 0.96rem;
		
			white-space: nowrap;
	
		
	}
	#floating ul li:nth-child(4){background-color:gold;}
	#floating ul li:nth-child(4) svg{width:24px;float:left;margin: 0;height: 26px;margin-right: 1em;}
	#floating ul li a span[class^="ti-"]
	{
		font-size: 1.2rem!important;
			flex-grow: 1;
		color:#fff
	}
	
	#floating ul li a:hover,
		#floating ul li a:focus
	{
		background-color:rgba(243,243,243,1.00);
		color:gray
	}
	#floating ul li a:hover:before,
		#floating ul li a:focus:before
	{
		opacity: 1;
	}
	#floating ul li a:hover:after,
		#floating ul li a:focus:after
	{
		border: 1px solid rgba(222,222,222,0.5);
		display: block;
		height: calc(100% - 10px);
		left: 5px;
		position: absolute;
		top: 5px;
		width: calc(100% - 10px);
	}
	#floating.active
	{
		right: 0;
	}
	#floating.active .active_text
	{
		opacity: 1;
		transform: scaleX(1);
		visibility: visible;
		line-height: 22px;
		color:silver
	}
	#floating.active a:hover .active_text
	{
		color:rgba(15,15,15,1)!important;
	}
	#floating.active .quick-head
	{
		
		padding: 0 1.2rem;
	}
	#floating.active .quick-head:before
	{
		display: none!important;
	}

	#floating.active ul li:hover a span[class^="ti-"]
	{
		
		color:crimson
	}

	#floating.active .quick-head strong
	{
		color: #fff;
		display: block;		
		-webkit-writing-mode: lr-tb;
		-ms-writing-mode: lr-tb;
		writing-mode: lr-tb;
		opacity: 1;
		font-size: 1.6rem;
		padding-top: 3rem;
		white-space: nowrap;
		width:100%;
		text-align: center;
	}
}

@media only screen and (max-width:1440px){
	#floating{display: none;}	
}

/*부트스트랩 테이블 하단 보더*/
.table-bottom-border
{
	border-bottom:1px solid #dee2e6
}


/*작은스마트폰 (세로모드, 360px 이하)*/
@media only screen and (min-width: 575.98px) {
}

/* 작은스마트폰 (가로모드, 360px 이상)*/
@media only screen and (min-width: 768px) and (max-width: 768px)  {
	
}

/*테블랫 (360px 이상 */
@media only screen and (min-width: 768px) and (max-width: 991.98px)  {

}

/* 데스크탑 (992px 이상)*/
@media  only screen and (min-width: 992px) and (max-width: 1199.98px) {
	

}
/* 해상도높은 데스크탑 (1440px 이상)*/
@media  only screen and (min-width: 1440px) {
	
	
}

/*모바일과 pc구분*/
/*태블릿+PC*/
@media  only screen and (min-width: 768px)  {

	.pc{
		display:block
	}
	.mobile
	{
		display: none!important;
		height: 0;
		visibility: hidden
	}
	}
/*모바일*/
@media  only screen and (max-width: 768px) {
	
	.pc{
		display: none!important;
		height: 0;
		visibility: hidden
	}
	.mobile
	{
		display: block;
	}
	.mo-line > div
	{
		border-bottom: 1px solid rgba(223,223,223,1.00);
		background-color:rgba(252,252,252,1.00);
	}
	.mo-inner
	{
		padding-right: 1rem!important;
		padding-left: 1rem!important;
	}
}

/*레이아웃*/



@media  only screen and (min-width: 768px)  {

header#header>div>div>div,main#main>section:not(.mainfull),footer#footer>section>div,section#container>div
{
	position: relative;
	max-width: 1440px;
	min-width: 768px;	
	width:100%;
	margin: 0 auto;
}
	}
/*모바일*/
@media  only screen and (max-width: 768px) {
header#header>div>div>div,main#main>section:not(.mainfull),footer#footer>section>div,section#container>div
{
	position: relative;
		
	width:100%;
	margin: 0;
	
	display: block;
}

}


/* ===================================================================
 *  03. header  
 *  곽병문
 *  edit 2019.11.18
 * ------------------------------------------------------------------- */
header
{
width:100%;
position: absolute;
	top:0px;
	left: 0px;

display: block;
	z-index: 9000;
}
header #header-top
{
	;
    width: 100%;
    margin: 0 auto;	
	background-color:rgba(253,253,253,1);
	-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
border-bottom: 1px solid rgba(241,241,241,1.00);
}
header #header-top  p
{
	font-size: 0.76em;
	color:gray;
	height: 36px;
	line-height: 36px;
	font-weight: bold;
	
}
header #header-top  p span
{
color:gray;	
}

header #header-top  nav
{
	width: 18.2rem;
	float: right;
	
}

header #header-top a
{
	
	font-size: 0.76rem;
	display: block;
	min-width:40px!important;
	
	text-align: center;
	
}
header #header-top a span
{
	color:gray;

}
header #header-top a span[class^="ti"]
{
	font-size: 1rem!important;
}
header #header-top a:hover span{
	color:ivory!important
}
header #header-nav
{
	width:100%;	
	background-color:rgba(255,255,255,1.0);
	position: relative;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	z-index: 3
	
}
@media  only screen and (min-width: 768px)  {
	header #header-top a
{
	
	height:36px;
	line-height: 36px;
}
header #header-top a span
{
	
	line-height: 36px;
}
header #header-top a:hover span.pc
{
	
	color:black!important
}
	
header #header-top
{
	
	height:36px;
	}
	header #header-nav
	{
		height:92px;
	}
}
@media  only screen and (max-width: 768px)  {
	header #header-top a
{
		
	height:30px;
	line-height: 30px;
}
header #header-top a span
{
	line-height: 30px;
}
	header #header-top
{
	
	height:0px!important;
	}
	header #header-nav
	{
		height:55px;
		
	}
	.mobile-inner .inner{
		padding: 0 16px;
	}
	header #header-nav .logo a{
		
		height:32px;
		margin: auto;
	}
		header #header-nav .logo
	{
		margin-top:-5px;
	}
  header #header-nav button
	{
		width:46px!important;
	    height: auto;
	  overflow: hidden;
	}

	header #header-nav.fixed  .logo{
		margin-top: 0.2rem;
	}
	
	.mobile-func
	{
	position: relative;
		width: 100%;
	}
	.mobile-func li
	{
		min-height:36px;
		line-height: 36px;
		padding: 0.3em 0.1em;
	}
	.mobile-func > li> a
	{
	
	height: 36px;	
	line-height: 36px;
		display: table-cell;
		font-size: 1.2em;
	}
		.mobile-func > li> a > span
	{
		margin-right: 2em;
	}
	.header-navigation
{
	justify-content: space-between
}
	}
/*me*/
header #header-nav::after {
  clear: both;
  content: "";
  display: block;
}

@media screen and (max-width: 768px) and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2)
{
	header #header-nav.fixed {
		height:55px;
	}

}
	@media screen and (min-width: 768px)
	{
		header #header-nav.fixed {
			height:86px;
		}
		}
header #header-nav.fixed {
  
	position: fixed;
	top:0px;
	left:0px;

	z-index: 3;
	-webkit-transform: translateY(0%);
      -ms-transform: translateY(0%);
          transform: translateY(0%);
	-webkit-box-shadow: 0px 6px 17px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 6px 17px -12px rgba(0,0,0,0.75);
box-shadow: 0px 6px 17px -12px rgba(0,0,0,0.75);

-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
	
}
#header-nav .logo
{
	display: block;
	height: 58px;
	
	z-index: 2;
}
@media  only screen and (min-width: 768px)  {

#header-nav .logo
{
	
	margin-left: 1.2rem;
	

}

.header-navigation
{
	width:100%;	
	display: block;
	-ms-align-items: center;
	align-items:center ;
	height:92px;
	
	
}	
}
@media  only screen and (max-width: 768px)  {
	
	#header-nav .logo
{
	
	margin: 0 auto!important;
	
	
	display: block;
	text-align: center;
	overflow: hidden;
	text-align: center;
	align-items: center;
	display: flex;
	display: -webkit-flex;
	-ms-flex-align: center;
	-webkit-flex-align: center;	
	-webkit-align-items: center;
	-webkit-box-align: center;
	justify-content: center;
	
}
		#header-nav .logo a
{
	
	

	margin: 0 auto;
	display: block;
	width: 100%;
	height: 100%
	
}
			#header-nav .logo a img
	{
		max-height: 100%;
	}
	
.header-navigation
{
	width:100%;	
	display: block;
	-ms-align-items: center;
	align-items:center ;
	height:55px;
	
	
}
}
#header-nav .logo a
{
	
	background-position: 0 0;
	-webkit-background-size: cover;
	background-size: cover;
	background-repeat: no-repeat;
	display: block;
	
	width: 300px;
	
}

nav#gnd > [role="menubar"]
{
	
	width: 360px;
	
	margin-top: 1rem;
	overflow: visible;
	
}
nav#gnd >[role="menubar"] > [role="none"]
{
	justify-content: space-around;
	-ms-align-items: center;
	align-items: center;
	width: 33%;
}
nav#gnd >[role="menubar"] > [role="none"]:hover ul
{
	display: block;
	transition:.3s; 
}
nav#gnd >[role="menubar"] > [role="none"] span
{
	display: block;
}
nav#gnd > [role="menubar"] > [role="none"] span a
{
	color: #111;
	display: block;
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 90px;
	padding: 0px;
	text-align: center;

}
a.headlink:hover,a.headlink:focus
{
	 color: crimson!important;
}

ul[role="menubar"] ul[role="menu"] a[aria-haspopup="true"]::after {
  content:"";
 
}

nav#gnd >[role="menubar"] > [role="none"] .headlink
{
	display: block;
	height: 100%;	
	position: relative;
	text-align: center;
	text-decoration: none;
}


ul[role="menu"]
{
	background: #fff;
	display: none;
	margin: 0;
	white-space: nowrap;
	width: auto;
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
	height: auto !important;
	left: 0;
	min-width: 150px;
	padding: 1.2rem 10px;
	position: absolute;
	top: 70px;
	z-index: 9999;
}
ul[role="menu"]:before
{
	background: url("../images/arr.png") no-repeat;
	content: '';
	height: 8px;
	left: calc(50% - 1.2rem);
	position: absolute;
	top: -8px;
	width: 15px;
}

 ul[role="menu"] li
{
	float: none;
	height: 100%;
	white-space: nowrap;
	position: relative;
}
 ul[role="menu"] li a
{
	font-size: 0.86rem;
	height: 100%;
	font-weight: normal;
	color:#333;
	line-height: 130%;
	white-space: nowrap;
	width: 100%;
	zoom: 1;
	padding: 0.4rem 0;
	display: block;
}
nav#gnd >[role="menubar"] > [role="none"]:hover ul li span
{
	display: none;
}
 ul[role="menu"] li a:hover,  ul[role="menu"] li.on a
{
	font-weight: 800;
	color:crimson
}



.btnAll
{
	background-color: transparent;
	height: 50px;
	margin-left: 5px;
	margin-top:0px;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	border: none;
	width: 50px!important;
	
}

.btnAll span
{
	background-color: transparent;
	border: 0;
	border-bottom: 2px solid #111;
	border-top: 2px solid #111;
	display: block;
	font-size: 0;
	height: 26px;
	margin: 0 auto;
	-webkit-transition: border-color 150ms ease-out, transform 150ms ease-out;
	-moz-transition: border-color 150ms ease-out, transform 150ms ease-out;
	-ms-transition: border-color 150ms ease-out, transform 150ms ease-out;
	-o-transition: border-color 150ms ease-out, transform 150ms ease-out;
	outline: 0;
	position: relative;
	transition: border-color 150ms ease-out, transform 150ms ease-out;

	width: 30px;
}
.btnAll span:after,
.btnAll span:before
{
	border-bottom: 2px solid #111;
	bottom: 10px;
	content: '';
	height: 0;
	left: 0;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	position: absolute;
	right: 0;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.btnAll span::after,
.btnAll span::before
{
	border-bottom: 2px solid #111;
	bottom: 10px;
	content: '';
	height: 0;
	left: 0;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	position: absolute;
	right: 0;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	}
.btnAll.on span
{
	border-color: transparent;
}
.btnAll.on span::after
{
	-moz-transform: rotate3d(0, 0, 1, 45deg);
	-ms-transform: rotate3d(0, 0, 1, 45deg);
	-o-transform: rotate3d(0, 0, 1, 45deg);
	-webkit-transform: rotate3d(0, 0, 1, 45deg);
	transform: rotate3d(0, 0, 1, 45deg);
}
.btnAll.on span::before
{
	-moz-transform: rotate3d(0, 0, 1, -45deg);
	-ms-transform: rotate3d(0, 0, 1, -45deg);
	-o-transform: rotate3d(0, 0, 1, -45deg);
	-webkit-transform: rotate3d(0, 0, 1, -45deg);
     transform: rotate3d(0, 0, 1, -45deg);

}
.btnAll.on span:after
{
	-moz-transform: rotate3d(0, 0, 1, 45deg);
	-ms-transform: rotate3d(0, 0, 1, 45deg);
	-o-transform: rotate3d(0, 0, 1, 45deg);
	-webkit-transform: rotate3d(0, 0, 1, 45deg);
	transform: rotate3d(0, 0, 1, 45deg);
	
}
.btnAll.on span:before
{
	-moz-transform: rotate3d(0, 0, 1, -45deg);
	-ms-transform: rotate3d(0, 0, 1, -45deg);
	-o-transform: rotate3d(0, 0, 1, -45deg);
	-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);

}


#allMenu
{
	background-color: rgba(0,0,0,0.5);
	bottom: 0;
	display: none;
	height: 100vh;
	left: 0;
	padding: 5rem 8% 1.2rem;
	position: fixed;
	right: 0;
	text-align: left;
	top: 0rem;
	z-index: 10000;
}
#allMenu .closew
{
		z-index: 9999;
	float: right;
}
#allMenu .closew span
{
	font-size: 2rem;

}
#allMenu .inner
{
	background: #fff;
	overflow: hidden;
	padding: 3rem 3rem;
	min-height:50vh
}
#allMenu .inner .allTit
{
	border-bottom: 3px solid rgba(5,5,5,1.00);
	color: #111;
	font-size: 2.3rem;
	font-weight: 900;
	padding: 0 2rem 1.25rem;
}

#allMenu .inner h3
{
	font-size: 1.3rem;
	font-weight: bold;
	text-align: left;
	padding: 0  .2rem 1.25rem;
	border-bottom: 1px solid rgba(5,5,5,0.10);
}
#allMenu .inner h3 a:after
{
	content: "\e65d";
	font-family: 'themify';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1.2;
	float: right;
	opacity: 0.5;
}
#allMenu .inner .allMenu
{
	width:100%;
	
	min-width: 768px;
	display: block;
	padding: 1rem;
	font-size: 1rem;
}
#allMenu .inner .allMenu > div
{
	width:25%;
	padding: 1rem;
}
#allMenu .inner .allMenu a
{
	color:#444;
	width:100%
}
#allMenu .inner .allMenu a:focus,#allMenu .inner .allMenu a:hover{
	color:crimson
}
#allMenu .inner .allMenu li
{
	padding: 0.6rem 0;
}

@media all and (max-width:1400px){
	#allMenu .inner {padding:53px 6% 150px;}

}
@media all and (max-width:1280px){
	#allMenu {padding:100px 5% 1.2rem;}
	#allMenu .inner {padding:53px 5% 150px;}
}
@media all and (max-width:1100px){

}
@media all and (max-width:758px){
	#allMenu {display: none!important;}
}

.ullist, .ollist {
    margin-left: 1.25rem;
    list-style-type: disc;
    margin-bottom: 1rem;
    list-style-position: outside;
    line-height: 1.6;
}
.ullist li,.ollist li
{
	font-size: 1rem;
	color:rgba(81,81,81,1.00);
	line-height: 180%;
}

.ensure img
{
	width: 100%;
	border: 1px solid rgba(248,248,248,1.00);
	margin-right: 1em;
	max-width: 100%;
}
/* ===================================================================
 *  04. footer  
 *  곽병문
 *  edit 2019.11.18
 * ------------------------------------------------------------------- */
footer
{
	background-color: rgba(0,0,0,1);
	padding: 0 0 3rem 0;
	width: 100%;
	
}
footer section:not(.foot3)
{
	-ms-align-items: center;
	align-items:center ;
}
div[class^="foot"] .inner
{
	position: relative;
}
@media all and (min-width:768px){
	.foot1 > div{
		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
	}
}
@media all and (max-width:758px){
	.foot1> div{
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		
	}
	.foot1> div > .item{
		padding: 0 16px;
		border-bottom: 1px solid rgba(241,241,241,1.00);
	}
	footer  inner
	{
		padding: 0 16px;
	}
	.foot2 .inner > div
	{
		text-align: center!important;
	}
}
.foot1
{
	min-height:94px;
	background-color: #fff;
	font-size: 0.9rem;
	border-top: 1px rgba(239,239,239,1.00) solid;
}
.foot1 .item
{
	
	height:94px;
	flex-grow: 1 ;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	align-items: center
	
}
.foot1 .item dl
{
	padding: 0;
	margin: 0;
   overflow: hidden;
	width:100%;
	font-size: 1rem;
}
.foot1 .item dt
{
	display: inline-block;
	text-align: center;
	font-weight:600;	
	padding-right: 1rem;
	
}
.foot1 .item dd
{
	display: inline-block;
	text-align: left;
	padding-left: 1rem;
	padding-top: 0.5em;
	font-size: 1em;

	
}
.foot1 .item dt span
{
	margin-right: .5rem;
}
a.more{
	position: absolute;
	z-index: 1;
	right:1rem;
	top:0%;
	height: 100%;
line-height: 94px;
}
a:hover.more
{
	color:rgba(162,20,22,1.00)
}
.foot2 .inner > div
{
	flex-grow: 1;
	height: inherit;
	line-height: 68px;
	font-size: 0.9rem;
}
.foot2 .inner > div:nth-child(2)
{
	text-align: right;
	color:white
}
.foot2 .inner a
{
	color:darkgray;
	margin-right: 1rem;
}
.foot3 .inner,.foot2 .inner
{
	height:68px;
	border-bottom: 1px solid rgba(38,38,38,1);
	position: relative;
}
.foot3
{
	position: relative;
	
}
.foot3 .inner
{
	
	width:100%;
	display: block;
}
.foot3 > .inner >  ul
{
	padding: 0;
	margin: 0;		
	width:auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;

	justify-content: center; align-items: center; 

	
}

.foot3 > .inner >  ul > li
{
	padding: 0 1rem;
	-ms-align-items: center;
	color: white

}

.foot3 > .inner >  ul > li > a
{
	color:gray
}
.foot3 > .inner >  ul > li > span:not(.en)
{
	
	color: wheat
}
.foot3 > .inner >  ul > li > span.en
{font-weight: bold;
font-size: 1.2rem;
color: rgba(232,3,67,1.00)}

@media only screen and (max-width:375px){
	.foot3 *{font-size: 0.94em!important;}
	.foot4 *{font-size: 0.86em!important;}
}

@media  only screen and (max-width: 768px) {
	.foot4 .inner{
	min-height:124px;
	padding: 2rem 16px;
		font-size: 0.78rem;
	color:rgba(232,232,232,1);
		text-align: center;
	
}
}
@media  only screen and (max-width: 768px) {
	.foot4 .inner{
	min-height:124px;
	padding: 2rem 16px;
		font-size: 0.86rem;
	color:rgba(232,232,232,1);
		text-align: center;
	
}
	.auth{
	position: relative;
	margin: 1rem auto 0;
	width:99px;
	height:47px
}
}
@media  only screen and (min-width: 768px) {
.foot4 .inner{
	min-height:124px;
	padding-top: 45px;
	color:rgba(232,232,232,1);
	
}
	.auth{
	position: absolute;
	z-index: 33;
	top:3rem;
	right:0px;
	width:99px;
	height:47px
}
}
.foot4 .inner p,.foot4 .inner address
{
	margin: 0;
	line-height: 130%;
	font-size: 0.9rem;
	color:rgba(232,232,232,1)
}
.foot4 .inner copyright
{
	margin-top: 0.6rem;
	font-size: 0.9rem;
	display: block;
}
.foot4 a
{
	color:gold
}
/* ===================================================================
 *  05. main  
 *  곽병문
 *  edit 2019.11.18
 * ------------------------------------------------------------------- */

header,footer,main
{
	width:100%;
}

#vis
{
	height: 100vh;
	display: block;


}
@media all and (min-width:768px){
#vegasSliderInner
{
		color:white;
  animation: jackInTheBox; 
  animation-duration: 1s;
	animate-delay: 3s;
	font-size: 4.2rem;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.1)
}
}

@media all and (max-width:758px){
	
	
#vis
{
	height: 94vh!important;
	display: block;


}
	
#vegasSliderInner
{
		color:white;
  animation: jackInTheBox; 
  animation-duration: 1s;
	animate-delay: 3s;
	font-size: 2.6rem;
	white-space: nowrap;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.1)
}
}

.vegas-content
{
	
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	width:100%;
	height: 100%;
	align-content: center;
	justify-content: center
}
/*
 @supports (-webkit-appearance:none){
	 .main-visual picture{
		 
	 }
}
*/


/**/
@media all and (min-width:768px){
	.inner{
	width:100%;
	position: relative;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

.main-choice
{
	padding-bottom: 80px;
}
	}
@media all and (max-width:768px){
#submain	.inner{
	width:100%;
	position: relative;
	margin: 0;
	padding: 0 0.6em;
	overflow: hidden;
}

.main-choice
{
	padding-bottom: 20px;
}
	}


.main-choice:after{    content: '';
    display: block;
    clear: both;
    overflow: hidden}
.main-choice h2
{
	
	line-height: 130%;
	font-weight: bold;
	color:black;
	white-space: nowrap;
	text-transform:uppercase;
	overflow: hidden;
	margin: 1.6rem 0 1.4rem;
	text-align: center;
	display: table-cell;
	letter-spacing: -1px;
	
}
@media all and (min-width:998px)
{
	.main-choice h2{font-size: 2.8em;}
	.main-choice img[src$=".svg"]
{width:50px;margin-left: 1em;}

}
@media all and (max-width:998px)
{
	.main-choice h2{font-size: 2.0em;}
	.main-choice img[src$=".svg"]
{width:36px;margin-left: 1em;}

}


.inner p
{
	line-height: 130%;
}


/*테블랫 (360px 이상 */
@media only screen and (min-width: 768px) and (max-width: 991.98px)  {
	.tablet {display: none!important;}
}

/* 데스크탑 (992px 이상)*/
@media  only screen and (min-width: 992px) and (max-width: 1199.98px) {
	

}

.main-choice .pig { position:relative; z-index:100; }
.main-choice .pig .pig-info { position: absolute;z-index: 1000;width:auto;height:200px;left:0px;bottom: 0px;padding: 1.2em;text-shadow:1 1 1 rgba(0,0,0,.5);  }
.main-choice .pig .pig-info h3{font-size: 2.5em;font-weight: bold;color: white}
.main-choice .pig .pig-info p{color:white!important}
.main-choice .pig .pig-info p strong{color:gold!important;text-decoration: underline;font-size: 110%;}
.main-choice .pig.fix { position:fixed; top:230px; }
.main-choice .pig.absolute { position:absolute;top:1160px; }


@media  only screen and (min-width: 768px)  {
.pm-banner img
{
	width:600px;
	height: 600px;
}
.main-best > div,.foot2>div>div
{
	width:100%;	
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
}
	.main-best .inner > div:nth-child(2)
{
	background-color: rgba(34,34,34,1.0);
	padding: 0.5rem;
	width:600px;
	height: 600px
}
	
	}

/*태블릿*/
@media (min-width: 768px) and (max-width: 1024px) {



}

/*모바일*/
@media  only screen and (max-width: 768px) {
	.pm-banner img
{
	width:100%!important
}
	
	.main-best > div,.foot2>div>div	{
	width:100%;	
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
}
	
	.main-best .inner > div:nth-child(2)
{
	background-color: rgba(34,34,34,1.0);
	padding: 0.5rem;
	width:100%;
}
}






.product-list .item figure
{
	width:100%!important
}
.product-list   img
{
	width: 100%;
	max-width: 860px;
}
.product-list > .item > a{
	display: block;
	overflow: hidden;
	border:1px dotted transparent;
}

/*공통*/

.textbox
{
	display: block;
	margin-top: 1.3rem;
	min-height:108px;	
	padding-bottom: 0.5rem;
	width:100%!important
}
.textbox h3,.textbox h3 label
{
display: block;
	overflow: hidden;
	
	color:rgba(10,10,10,1);
	white-space: nowrap;
	text-overflow: ellipsis;		
	font-size: 1.1rem;
	font-weight:bold;
	line-height: 130%!important;
	min-height:24px!important;
	letter-spacing: -0.1px;
}
.textbox h3 a
{
color:black;
	
	display: block;
	
	width: 100%;

}
 .textbox h3 a:hover,.textbox h3 a:focus
{
color:crimson;	
}
.textbox .desc
{
	color: rgba(143,143,143,1.0);
	line-height: 130%;
	font-size: 0.8rem;
	overflow: hidden;
	margin-bottom: 0.2rem!important;
	height:36px;
	white-space: nowrap;
	text-overflow: ellipsis;
	letter-spacing: normal!important;
}
.textbox .measure
{
	margin-bottom: 0.3rem!important;
	font-size: 0.8rem!important;
}
.best-slider .measure
{
	color:antiquewhite!important
}
.textbox .price
{
	color:crimson;
	line-height: 130%;
	
		font-weight: 500;
	margin-bottom: 0.1rem!important;
}
.textbox .emoney
{
	color:crimson;
	line-height: 130%;
	font-size: 0.8rem;
	font-weight: 300;
	margin-bottom: 0.2rem!important;
}
.textbox .maxprice
{
	margin: 0rem!important;
	font-size: 0.8rem;
	text-decoration: line-through;
	color: rgba(124,124,124,1.00)
}
.button-box
{
	display: block;
	width:100%;
	height:100%;
	position: absolute;
	z-index: 111;
	right:0;
	top:0;
}

.button-box a
{
	display: block;
	float: left;
	
	border-radius: 50%;	
	background-color:rgba(0,0,0,0.5);
	text-align: center;
	justify-content: center;
	
	-webkit-transition:  0.2s ease-in-out;
	-o-transition:  0.2s ease-in-out;
	transition:  0.2s ease-in-out;
}

	
	.button-box a{
	width:5em!important;
	height:5em!important;
			line-height: 5em;
		margin-right: 0.5rem;
		}


.button-box a svg
{
	fill:gold;
	font-size: 1.468em;
}
.button-box a:hover,.button-box a:focus
{

background-color:rgba(0,0,0,1);
}

.button-box a:hover span,.button-box a:focus span
{
color:rgba(255,204,51,1);
	
}





.main-contents
{
	width:100%;
	
	background-attachment: fixed;
	background-image: url("../images/main-parrel.jpg");
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	background-size: cover;
	
}

@supports (-webkit-touch-callout: none) {
	.main-contents{
	background-attachment: scroll!important;
	}
}


@media  only screen and (min-width: 768px) {
.main-contents .inner
{
	min-height:412px;
	width:100%;
	max-width:1440px;
	min-width: 768px;
	margin: 0 auto;

}

	.main-contents .inner > div{
	width:100%;
	padding: 1.2rem 0 0 2rem;
}
	.product-list
	{
		justify-content:flex-start
	}
	.textbox .price
{
	
	font-size: 1.5em;
	
}

}
@media  only screen and (max-width: 768px) {
.main-contents .inner
{
	min-height:512px;
	width:100%;
flex-direction: column;
	margin: 0 auto;
	justify-content:flex-start
}
.main-contents .inner > div 
{
	width:100%;
	overflow: hidden;
	padding: .5rem;
	
}
	.main-choice .inner
	{
	width:100%;

	margin: 0 auto ;
	justify-content:flex-start
	}
	.main-choice .inner > div
	{
		
	width:100%;
	overflow: hidden;
	padding: .5rem;
	}
.textbox .price
{
	
	font-size: 1.3em;
		
}
}
@media only screen and (orientation: landscape) and (max-width: 768px)  {
	.main-contents .inner
{
	min-height:312px;
	}
	.main-contents .inner > div 
{
	width:25%;
	overflow: hidden;
	padding: .5rem;
	
}
product-list
	{
		justify-content: space-between
	}	
	
		.main-choice .inner > div
	{
		
	width:33%;
	overflow: hidden;
	padding: .5rem;
	}
	
}
/*새싹삼*/
.main-contents .inner > div 
{
	-webkit-transition: all ease 1s;
	-o-transition: all ease 1s;
	transition: all ease 1s;
	object-fit: fill;
	
}
.main-contents .inner > div h2
{
	color: crimson;
	line-height: 200%;
}
.main-contents .inner > div h3
{
	color: crimson;
	font-weight: bold;
	font-size: 2.6em;
	line-height: 110%;
	margin-bottom: 1.3rem;
}
.main-contents .inner > div p
{
	
	font-weight: lighter;
}
.main-contents .inner > div p.sam-head
{
	color:#fff;
	padding: 0.2em;
	background-color: rgba(0,0,0,0.5);
}
.main-contents .inner > div p.sam-foot
{
	color:#f06;
}
.main-contents .inner > div p.sam-foot strong
{
	font-weight: bold!important;
	color:inherit
}
.main-contents .inner > div  .sam-wrap
{
	display: block;
	margin: 3rem 0;
}

.main-contents .inner > div  .sam-wrap a{
	color:white!important;
}
@media only screen and  (min-width: 768px)  {
	
	.main-contents .inner > div  .sam-wrap > div
{
	border-radius: 50%;	
	overflow: hidden;
	width:196px;
	height:196px;
	position: relative;
}
}
@media only screen and  (max-width: 768px)  {
	
	.main-contents .inner > div  .sam-wrap > div
{
	border-radius: 50%;	
	overflow: hidden;
	width:30%;
	position: relative;
}
}




.sam-photo {

  margin: 2em auto;
  opacity: 0;
  transform: translateY(4em) rotateZ(-5deg);
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              opacity .3s .25s ease-out;
  max-width: 600px;
  width: 90%;
  will-change: transform, opacity;
}

.sam-photo.is-visible {
  opacity: 1;
  transform: rotateZ(-2deg);
}

.sam-wrap figure {
		width: 100%;
		position: relative;
margin: 0!important;
	cursor: pointer
	}
	



.sam-wrap figure .overlay {
		position: absolute;
	bottom: 0;
		left: 0;
		right: 0;
		overflow: hidden;
		width: 100%;
		height: 0;
		color: #fff;	
		background: rgba(0, 0, 0, 0.6);
      
	-webkit-transition: .6s ease;
	-o-transition: .6s ease;
	transition: .6s ease;

	}
.sam-wrap	figure .overlay .description {
		font-size: 1.2rem;
		position: absolute;
		top: 50%;
		left: 50%;
	color: white;
	font-weight: bold;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		text-align: center;
	}
	

.sam-wrap figure:hover .overlay {
		display: block;
		height: 100%;
	opacity: 1!important;
	}


/* ===================================================================
 *  06. sub  
 *  곽병문
 *  edit 2019.11.18
 * ------------------------------------------------------------------- */

@media  only screen and (min-width: 768px)  {

#submain
{
	position: relative;
	overflow: hidden;
	padding: 0;
	margin: 0;	
	min-width: 768px;
	width: 100%;
}
#submain > section:not(.subfull),#subhead
{
	position: inherit;
	max-width: 1440px;
	width:100%;
	min-width: 768px;
	display: block;
	background-color: #fff;
	margin: 0 auto;
	min-height: 10vh;
	
}
	.subvisual
{
	width:100%;
	min-width: 768px;
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
		background-image: url("../images/company.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	-webkit-background-size: cover;
	background-size:cover ;
	overflow: hidden;
	
}
.subvisual .inner
{
	width:100%;
	min-width: 768px;
	padding: 0;
	margin: 0;
	position: relative;
    background-color:rgba(51,153,255,0.1);
	max-height:498px;
	height: 100%;
	min-height: 364px;
}
	
	.textwrap
{
	width:60%;
	height:100%;
	margin: 3% auto;
	
}
	.textwrap h3
{
	font-weight:bold;
		color:black!important;
	font-size: 2.4rem;
	

}
	.textwrap p
	{
		font-weight:normal;
		
		font-size: 1.6rem;


	}
	.pagetitle
{
	margin: 2rem 0;
	text-align: center;
	font-size: 2.1rem;
	font-weight: bold;
}
}

@media  only screen and (max-width: 768px)  {

#submain
{
	position: relative;
	overflow: hidden;
	padding: 0;
	margin: 0;		
	width: 100%;
}
#submain > section:not(.subfull),#subhead
{
	position: inherit;
	width:100%;
	display: block;
	background-color: #fff;
	margin: 0 auto;
	min-height: 10vh;
	
}
	.subvisual
{
	width:100%;	
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
	background-image: url("../images/company.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	-webkit-background-size: cover;
	background-size:cover ;
	overflow: hidden;
	
}
.subvisual .inner
{
	width:100%;	
	padding: 0;
	margin: 0;
	position: relative;
    background-color:rgba(0,0,0,0.3);
	max-height:498px;
	height: 100%;
	min-height: 264px;
}
	.textwrap
{
	width:80%;
	height:100%;
	margin: 15% auto;
	
}
	
	.textwrap h2
{
	font-weight:700;
	font-size: 1.6rem;
	

}
.pagetitle
{
	margin: 1.5rem 0;
	text-align: center;
	font-size: 1.8rem;
	font-weight: bold;
}

}

#submain > section > .container > h3
{
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0.5rem 0;
	line-height: 130%;
}
#submain > section:last-child
{
	padding-bottom: 3rem;
}



.textwrap *
{
	color:white!important
}
[aria-label="breadcrumbs"]
{
	width:auto;
	display: block;
	padding: 1rem 0;
	height:30px;
}

[aria-label="breadcrumbs"] ol
{
	padding: 0;
	margin: 0;
	width:auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	
	
}
[aria-label="breadcrumbs"] li
{
	display:block;
	float: left;
	font-size: 0.360rem;
	position: relative;
	line-height: 1!important;
	-ms-align-items: center;
	align-items:center ;
	color: white!important;
}



[aria-label="breadcrumbs"] li a
{
	color:rgba(255,255,255,0.8);
	letter-spacing: -1px;
}
[aria-label="breadcrumbs"]  span
{
	font-size: .685rem!important;
		color:rgba(255,255,255,0.60);
}
[aria-label="breadcrumbs"] [aria-current="location"]
{
	font-weight: bold!important;
		color:rgba(255,255,255,1);
	
}
[aria-label="breadcrumbs"] li:nth-child(2n)
{
	padding: 0 .3rem;
}
[aria-label="breadcrumbs"] li button
{
	font-size: 0.360rem!important;
	color:rgba(255,255,255,0.60)!important;
	letter-spacing: -1px;
	border: none!important;
	padding: 0!important;
	margin-top: -5px!important;
	background-color: transparent!important;
}

[aria-label="breadcrumbs"] li .dropdown
{
	font-size: 1rem;
}

/*타이틀공통*/
#Alltitle
{

	margin-bottom: 0rem; 
	background-attachment: fixed;
	-webkit-background-size:contain;
	background-size:contain;
	background-position:top center;
	background-repeat: no-repeat;
}

/**/
#Alltitle .innerwrap
{
		width:100%;
	
	position: relative;
		max-height: 420px;
		height: 100%;
		min-height: 180px;
}

#titleg
{
	margin: 0rem;
	height: 100%;
	text-align: center;

}

@media  only screen and (min-width: 768px)  {
	#Alltitle
	{
		height: 420px;
	
	}
	#Alltitle .inner
{
    width:100%;
	max-width: 1440px;
	min-width: 768px;
	margin: 0 auto;
	overflow: visible;
	padding-bottom: 2rem;
	height: 100%;
	
}
	
#Alltitle h2
{
	color:rgba(0,0,0,1)!important;
	font-size: 3.6em!important;
	line-height: 150%;
	font-weight: bold;
	margin-top: 1em;;
	text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;
	
}
}
@media all and (max-width:768px){
.prd-name
{
	margin-top: 1em;
	margin-bottom: 20px;
}
}
@media all and (min-width:768px){
.prd-name
{
	margin-top: 100px;
	margin-bottom: 20px;
}
}
.prd-name h2
{
	font-size: 2em!important;
	font-weight: bolder;
}
@media  only screen and (max-width: 768px)  {
	
	#Alltitle
	{
		height:200px;
	}
	
	#Alltitle .inner{
    width:100%;	
	margin: 0;
	overflow: hidden;
		height: 100%;
	padding-bottom: 1rem;

	
}
	
#Alltitle h2
{
	color:white!important;
	font-size: 2.0rem!important;
	font-weight: bold;
	letter-spacing: -1px;
	text-align: center;
	padding-top: 2.5rem;
	text-shadow: -1px -1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000;
}
}

#titleg h2
{
	font-size: 1.3rem;	
	color:darkslategrey;
	letter-spacing: 1px;
	
}

/*서브콘텐츠공통*/
.subcontents
{
	position: relative;
	overflow: hidden;
	line-height: 130%;
}

.subcontents h4,.container h4
{
	font-size: 1.3rem;
	line-height: 130%;
	font-weight: bolder;
	margin: .5rem 0 1.2rem;
	display: block;
	float: none;
}
.subcontents p,.container p
{
	line-height: 180%;
	font-size: 1rem;
	color:rgba(54,54,54,0.8);
	word-break: keep-all
}

.ullist li,.ollist li
{
	font-size: 1rem;
	color:rgba(81,81,81,1.00);
	line-height: 180%;
}

/*회사소개*/
.company
{
	margin: 0rem auto 0!important;
	border-radius: 1.3rem 1.3rem 0 0;
	z-index: 1;
	min-height: 12vh;
	padding-top: 1rem;
}

	@media all and (min-width:768px){
		.map iframe {height:270px;}
	}
	@media all and (min-width:1024px){
		.map iframe {height:400px;overflow:hidden}
	}
/*서브탭으로변경*/
#subheadwrap
{
	margin-bottom: 3rem;
	position: relative;
	padding: 0 0 1rem 0;
	overflow: hidden;
	margin-top: -0.5rem!important;
	
}
#subheadwrap [role="menu"] .sub-nav
{
	width:100%;
	margin: 0;
	display: table;
	border:1px solid rgba(236,236,236,1.00);
	background-color: rgba(236,236,236,0.40);
	border-top: none!important;
	z-index: 1;
	padding: 0;
}
@media all and (min-width:968px){
.item--11
{
	width:8%!important
}
.item--6
{
	width:15%!important
}
.item--5
{
	width:19%!important;
}
.item--4
{
	width: 23%!important;
}
.item--3
{
	width: 32%!important;
}
.item--2
{
	width: 48%!important;
}
	
.item--30
{
	width: 27%!important
}	
.item--40
{
	width: 37%!important
}
.item--50
{
	width: 47%!important
}
.item--60
{
	width: 60%!important
}
	.item--100
{
	width: 100%!important
}
}
@media all and (max-width:768px)
{
	.mitem-100 	{width:100%!important}
	.mitem-30 {width:27%!important}
	.mitem-50 {width:47%!important}
	.mitem-70{width: 68% !important;}
	.mitem-30 ul {display: none!important;}
	.minwidth15{min-width: 114px;}
}

	@media all and (min-width:768px){
#subheadwrap [role="menu"] .sub-nav
{

	overflow: hidden;
}
			
}
	@media all and (max-width:758px){
#subheadwrap [role="menu"] ul
{

	overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	justify-content:flex-start
}
		
}
#subheadwrap [role="menu"] h3
{
	font-size: 1.23rem;
}
#subheadwrap [role="menu"] .sub-nav div
{
	height:46px;
	border-right: 1px solid rgba(236,236,236,1.00);
	padding: 0;
	background: #fff;
	
	text-align: center;
	
}
	@media all and (max-width:758px){
		#subheadwrap [role="menu"] .sub-nav div:last-child
{
border-right:1px solid rgba(236,236,236,1.00)!important;	
}
		#subheadwrap [role="menu"] .sub-nav div a
{
	

	display: block;
	width:100%;
	height:46px;
	font-weight: normal;
	padding: 0 1rem;
	justify-content: center;
	align-items: center;
	line-height: 46px;
}
}
#subheadwrap [role="menu"] .sub-nav div:last-child
{
border-right:none;	
}
#subheadwrap [role="menu"] .sub-nav div:hover{
	background-color:rgba(243,243,243,1.00);
}
#subheadwrap [role="menu"] .sub-nav div a
{
	font-size: 1rem;
	display: block;
	width:100%;
	height:46px;

	font-weight: normal;
	padding: 0rem;
	justify-content: center;
	align-items: center;
	line-height: 46px;
}
#subheadwrap [role="menu"] .sub-nav div a span
{
	display: block;
	height: inherit;
	line-height: 46px;
		overflow: hidden;
	text-overflow:ellipsis;
		white-space: nowrap;
	font-size: 1em!important;
}
#subheadwrap [role="menu"] .sub-nav div a[aria-current="page"] 
{
	background-color: crimson;
	
	font-weight: bold;
}
#subheadwrap [role="menu"] .sub-nav div a[aria-current="page"]  span
{
color:white!important;	
}
#subheadwrap > section
{
	float: left;
	display: block;	
	width:100%px;
}
#subheadwrap > section > .inner
{
	padding:0 1rem;
	position: relative;
}

/*
서브공통콘텐츠 타이틀
 */

.subcotnents-title
{
	position:relative;
	display: block;
	line-height: 110%;
}
.subcotnents-title h3
{
	font-size: 15px;
	color:gray;
	letter-spacing: 0.2px;
	margin-bottom: 2rem;
	line-height: 130%;
	font-weight: 300!important;
	font-variant: small-caps;
}
.subcotnents-title p
{
	color: #101010;
	font-weight: 700;
	font-size: 1.6em;
	line-height: 130%;
	margin-top: 1rem;


}
.subcotnents-title p::before
{
	position: absolute;
	content: '';
	z-index: 1;
	width:20px;
	height:3px;
	color: crimson;
	background:  crimson;
	top:-5px;
	left:0px;
}
.subcotnents p
{
	line-height: 150%;
	word-break: keep-all;
}

.ingredient thead th
{
	background: linear-gradient(to top right, #fff calc(50% - 1px), #dee2e6, #fff calc(50% + 1px) );
	position: relative;
}
.ingredient thead th::before
{
	content:'비교' ;
	position: absolute;
	z-index: 1;
	top:50%;
	left:20%;
}
.ingredient thead th::after
{
	content:'성분' ;
	position: absolute;
	z-index: 1;
	top:30%;
	right:20%;
}
.ingredient thead th,.ingredient thead td{
	border-bottom:none!important; ;
}

.origin
{
	font-size: 12px;
	font-style: italic;
}


.eating > div
{
	margin-bottom: 1rem;
}
.ceo-content h4
{
	font-size: 3rem;
	margin-bottom: 2rem;
}
.ceo-content p{
	line-height: 150%;
	color:gray;
}
@media only screen and (max-width: 768px) {
	.eating > div
	{
		width:49%
	}
	.subcotnents-title,.subcotnents
	{
		padding: 0 10px!important;
	}
	.ceo-wrap > div
	{
		width:100%;
		margin-bottom: 2rem;
	}
}
@media only screen and (min-width: 768px) {
	.eating > div
	{
		width:24%
	}
	.ceo-wrap > div
	{
		width:49%
	}
}


@media screen and (max-width:758px){
	.mobile-padding
	{
		padding: 0 12px;
	}
}
/*서브1 회사소개*/
.ceo strong
{
	font-family: 'Nanum Myeongjo', serif!important;
	font-size: 1.24rem;
}
.moto
{
	display: block;
	margin: 0.2rem 0 1rem;
	padding: 1.2rem 0;
	border-bottom: 1px dotted rgba(229,229,229,1.00);
	
}
.moto h3
{
	font-size: 3rem;
	font-weight: bold;
}
.moto p
{
	font-family: 'Nanum Myeongjo', serif!important;
	font-size: 1.6rem;
}

/*서브탑공통*/
@media  only screen and (min-width: 768px)  {

section[class*="sub0"]
{
	
	background-repeat:no-repeat;
	background-position: 0 0;
	height: 300px;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	background-size: cover;
}
}
@media  only screen and (max-width: 768px)  {

section[class*="sub0"]
{
	
	background-repeat:no-repeat;
	background-position: 100% 0%;
	height: 150px;
	-webkit-background-size:cover;
	background-size:cover;
	overflow: hidden;
	
}
}
/*서브3*/

.sub03
{
	background:#ffcccc url("../images/sub03.jpg");

}

/*tab*/
.tabbable-panel
{
	border: 0px solid #eee;
	padding: 1rem;
}
.tabbable-line > .nav-tabs
{
	border: none;
	margin: 0px;
}
.tabbable-line > [role="tablist"] > li
{
	margin-right: 2px;
	display: inline-block;
	width:24.46%;
	height:3.6rem ;
}
.tabbable-line > [role="tablist"] > li > a
{
	border: 0;
	color: #737373;
	display: block;
	width:100%;
	font-weight: 400;
	text-align: center;
	line-height: 3.6rem;
	border-bottom: 4px solid #fff;
	
}


.tabbable-line > [role="tablist"].open > a, .tabbable-line > [role="tablist"] > li:hover > a
{
	
	color: #333333;
	border-bottom: 4px solid rgb(80,144,247);
}

.tabbable-line > [role="tablist"].open .dropdown-menu, .tabbable-line > [role="tablist"] > li:hover .dropdown-menu
{
	margin-top: 0px;
}
.tabbable-line > [role="tablist"] li a.active
{
	border-bottom: 4px solid #32465B;
	position: relative;
}


.tabbable-line > .tab-content
{
	background-color: #fff;
	border: 0;
	border-top: 1px solid #eee;
	margin-top: 4px;
	padding: 15px 0;
}
.portlet .tabbable-line > .tab-content
{
	padding-bottom: 0;
}

/*서브4*/
.sub04
{
	background:#94ebe6 url("../images/sub04.jpg");
	
}

/*서브2 쇼핑몰 */
.sub02
{
	background:#ffe451 url("../images/sub02.jpg");

}
.shopbody > .inner
{
	margin-top: 0.5rem;
}

/*서브5*/

/*회원가입단계*/
.steps {
	 background: #eee;
	 border-top: 1px solid #bbb;
	 border-bottom: 1px solid #bbb;
	 text-align: center;
	margin-bottom: 2rem;
}
 .steps ol {
	 display: flex;
	 flex-flow: wrap;
	 list-style: none;
	 padding: 0;
	 margin: 0;
}
 .steps li {
	 border-right: 1px solid #bbb;
	 flex-grow: 1;
}
 .steps li:first-child {
	 border-left: 1px solid #bbb;
}
 .steps a {
	 color: #222;
	 display: block;
	 padding: 0.8em 1em;
	 position: relative;
	 text-decoration: none;
}
 .steps a:after {
	 background: #000;
	 content: "";
	 left: 0;
	 right: 0;
	 height: 0px;
	 bottom: 0;
	 position: absolute;
	 transition: height 0.2s ease-in-out;
}
 .steps a:hover:after, .steps a:focus:after {
	 height: 4px;
}
 .steps a.is-active, .steps a[aria-current="step"] {
	 background: #333;
	 color: #fff;
}
 .steps a.is-active:hover:after, .steps a[aria-current="step"]:hover:after, .steps a.is-active:focus:after, .steps a[aria-current="step"]:focus:after {
	 background: #fff;
}
 

.sub05
{
	background:#bff2d8 url("../images/sub05.jpg");
	
}
/*담당자*/
.business li
{
	padding: 0.4rem;
	line-height: 130%;
}
/*상세상품기본정보*/
.product-table 
{
	font-size: 0.96rem!important;
	/*width: 800px!important;*/
}

@media only screen and (max-width: 768px)
{

	.product-table th,.product-table td{
		display: block!important;
		width:100% !important;
		text-align: left!important;
	}
}
.product-table tbody th
{
	text-align: center;
	background-color:rgba(248,248,248,1.00);
	white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	
	
}
.product-table tbody th span
{
	color: #333;
	
	
}
.product-table
{
	border-bottom: 1px solid #dee2e6;
}
/*상세보기탭*/
.detailTab
{
	margin-bottom: 20px;
	padding: 100px 0 20px;
}
.detailTab .tab_margin
{
	background: #222;
	display: block;
	height: 1px;
	margin: 0 0 -40px;
	width: 100%;
}
@media  only screen and (min-width: 768px)  {
.detailTab .detail_tap_inner
{
	margin: 0 auto;
	padding: 0 !important;
	width: 60%;
}
}

@media  only screen and (max-width: 768px)  {
.detailTab .detail_tap_inner
{
	margin: 0 auto;
	padding: 0 !important;
	width: 86%;
}
}
.detailTab .detail_tap_inner .menu
{
	display: table;
	table-layout: fixed;
	width: 100%;
}
.detailTab .detail_tap_inner .menu li
{
	background: #fafafa;
	border-bottom: 1px solid #222;
	border-left: 1px solid #e8e8e8;
	border-top: 1px solid #e8e8e8;
	display: table-cell;
	float: none;
	text-align: center;
	vertical-align: middle;
	width: 20.5%;
}
.detailTab .detail_tap_inner .menu li a
{
	border: 0;
	display: inline-block;
	font-size: 0.86rem;
	line-height: 16px;
	margin: 0;
	min-width: 0;
	padding: 11px 0;
	text-decoration: none;
	width: 100%;
color:#333
}
.detailTab .detail_tap_inner .menu li:last-child
{
	border-right: 1px solid #e8e8e8;
}
.detailTab .detail_tap_inner .menu li.selected
{
	background: #fff;
	border-bottom: 0 !important;
	border-left: 1px solid #222;
	border-right: 1px solid #222;
	border-top: 1px solid #222;
	color: #000;
	font-weight: 600;
	position: relative;
	top: 0;
}
.shop-divide
{
	height:1.0rem;
	background:  rgba(244,244,244,1.00);
	padding-top: 1rem;
}
#shop-viewpage h2
{
	font-size: 1.5rem;
}
#shop-viewpage h3
{
	font-size: 1.25rem;
}
#shop-viewpage h4
{
	font-size: 1.15rem;
}
#shop-viewpage h5
{
	font-size: 1.1rem;
	font-weight: bold;
}

#prdDetail img
{
	margin: 0 auto;
	display: block;
}

/***************************************기존 소스 중 보강 수정*************************************************************************/
.glores-A-related
{
	padding: 1rem  0!important;
}
.glores-A-related h3:before
{
	position: absolute;
	z-index: 1;
	top:-1.2rem;
	left:calc(50% - 23px);
	border-top: 1px solid rgba(102,102,102,0.60);
	width:46px;
}
.glores-A-related>div
{
	border: none!important;
}
.glores-A-img figure img
{
	max-width:540px;
	width:100%;
}
/*상품상세상단 sort*/
.farm-A-goods-sort *
{
	line-height: 250%;
	font-size: 0.8rem!important;
}
.farm-A-goods-sort strong
{
	font-weight: bold!important;
	color: crimson!important
}
/*빈상품*/
.farm-A-empty
{
	height:300px;
	text-align: center;
	color: 1rem;
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	align-items: center;
	border-bottom: 1px solid #eaeaea;
}

/*회원탈퇴*/
.glores-A-terms  strong
{
	font-weight: bold;
	font-size: 1.1rem;
}
.glores-A-terms *
{
	font-size: 0.86rem;
	line-height: 150%!important;
}
/*관심상품썸네일*/
.glores-A-table>tbody>tr>td.glores-A-goods-img a:first-child img, .glores-A-table>tbody>tr>td.glores-A-goods-img2 a:first-child img
{
width:40px!important;
	height:40px!important;
	margin-right: 10px!important;
	padding: 0!important;
}
.glores-A-table
{
border-collapse: collapse!important
}
.glores-A-goods-img
{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	align-items: center
}


/*로그인*/


.glores-A-login
	{
		margin: 0 auto!important;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	
		justify-content:flex-start
	}
@media  only screen and (min-width: 768px)  {
	.glores-A-login > div
	{
		width: 50%!important;
		margin: 0 auto!important;
	}
}

@media  only screen and (max-width: 768px)  {
	.glores-A-login
	{
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
	}
	.glores-A-login > div
	{
		width: 100%;
	}
}
.glores-A-login .login-input-box
	{
		width: 100%!important;
	}
.glores-A-login
	{
	margin: 0rem auto!important;

	}

/*input 조정*/
.glores-A-input-txt
{
	height: auto!important;
}
.glores-A-form>tbody>tr>td p
{
	line-height: 130%!important	;
}
.glores-A-form  select
{
height: 2rem	
}


/*약관*/
.privacyBody h4, .agreementBody h4
{
	font-size: 1.2rem!important;
		font-weight: bold;
}
.privacyBody ol, .agreementBody ol
{
	list-style: decimal-leading-zero!important
}
.privacyBody ul, .agreementBody ul
{
	list-style: lower-alpha!important;
	margin: .5rem 0!important;
}
.privacyBody  li, .agreementBody li 
{
	line-height: 180%!important;
	word-break: keep-all!important;
	font-size: inherit!important;
}
.privacyBody p, .agreementBody p
{
font-size: 0.92rem!important;
	line-height: 160%!important;
	word-break: keep-all!important
}

/*상품배송비*/
select[name="gv_move_sel"]
{
	pointer-events: none;
	  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
	border: none!important;
	background-color:transparent!important;
	
	
}


select[name="gv_move_sel"]::-ms-expand {
        display: none;
}
/*********************************************************************/
/*게시판 제목 버튼 조정*/
.board-top-line
{
	border-top: 2px rgba(152,152,152,1.00) solid!important;
}
.border-bottom-line
{
	border-bottom: 1px solid #eaeaea!important;
}
.noneLst
{
	border-top: 1px #cccccc solid!important;
}


#sidebar {
    width: 250px;
    position: fixed;
    top: 0;
    left: -250px;
    height: 100vh;
    z-index: 99998;
    background: #eaeaea;
    color: #fff;
    transition: all 0.3s;
    overflow-y: scroll;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}
#sidebar h3
{
	font-weight: bold;
	color: white
}
#sidebar.active {
    left: 0;
}

#dismiss {
    width: 35px;
    height: 35px;
    line-height: 37px;
    text-align: center;
    
    position: absolute;
    top: 1rem;
    right: 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	z-index: 99999;
}
#dismiss span
{
	font-size: 1.2rem!important;
	color: white
}

#dismiss:hover {
    background: #fff;
    color:rgba(244,23,71,1.00);
}

.overlay {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    z-index: 99997;
    opacity: 0;
    transition: all 0.5s ease-in-out;
	top:0px;
	left:0px;
}
.overlay.active {
    display: block;
    opacity: 1;
}

#sidebar .sidebar-header {
    padding: 1rem;
    background-color:crimson;
	color: white
}

#sidebar ul.components {
padding: 0rem;
}


#sidebar ul li a {
 
    font-size: 1.0em;
    display: block;
	color:#333;
	padding: 1rem 0.6rem;
}
#sidebar> div > div  li
{
	border-bottom: 1px solid rgba(217,217,217,1.00)
}
#sidebar ul li a:hover {
    color: #7386D5;
    background: #fff;
}

#sidebar ul li.active> span > a,
#sidebar ul li> span > a[aria-expanded="true"] {
    color: #000;
	font-weight: bold;
   background-color: rgba(255,255,255,1.00)
}
#sidebar   .collapse
{

}
#sidebar   .collapse li a
{

	
	
}
#sidebar   .collapse li{
	background-color:transparent!important;
}
#sidebar ul li> span > a[data-toggle="collapse"]:after
{
	transition: all 0.75s 0.25s;
  transform: rotate(0);
	content: "\e64b";
	font-family: 'themify';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1.5;
	float: right;
	opacity: 1;
	color: #666;
	font-size: 60%;
}
#sidebar ul li> span > a[aria-expanded="true"]:after
{
	
	 transform: rotate(180deg);
}

a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}
.sidebar-foot
{
	padding: .5rem;
}
