
.matt-header-bg {
	position: relative;
    width: 100%;
    max-width: 2700px;
    height: 650px;
    margin: auto;
    overflow: hidden;
    background-size: cover ; /* 788 128  0.5625*/
    background-repeat: no-repeat;	
    background-position: center;
}
.matt-background-img01 {
	background-image: url(../img-file/metal_card/bmw-moto-card.jpg);
}
.matt-background-img02 {
	background-image: url(../img-file/metal_card/bmw-moto-card03.jpg);
}
.matt-background-img03 {
	background-image: url(../img-file/m_main/head-cover-step02.jpg);
}
.matt-background-img04 {
	background-image: url(../img-file/metal_card/main-cover.jpg);
}
a:link { text-decoration: none; }
.Lang-word {
    word-break: keep-all;
}
.how_to_design {
    margin: 0 auto;
    max-width: 1200px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr ;
}

.how_to_design_item {
    position: relative;
    margin-top: 40px;
    padding-bottom: 40px;
    padding-right: 4%;
    padding-left: 4%;
    box-sizing: border-box;
}
.how_to_item_box {
	text-align: center;  
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
    display: flex;
}
.how_to_design_picture {
	margin: 32px auto;
	width:180px;
}
.how_to_design__h1 {
    text-align: center;
    font-size: 24px;
    margin:  0 0 8px 0;
}
.how_to_design__text {
    text-align: center;
    font-size: 18px;
    padding: 0 8px 16px 8px;
    transition: opacity 200ms ease 0s;
}

 .button-container  {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.button_edit.small {
    padding: 4px 16px;
    border-radius: 15px;
}
.button_edit {
	color: #fff;
    background-color: #5c5ce0;
    border-color: #5c5ce0;
    text-decoration: none;
    text-align: center;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    cursor: pointer;
    border-width: 2px;
    border-style: solid;
    margin: 10px auto;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}
.section-container-li {
    position: relative;
    margin: 16px auto;
    padding: 0;    
	width:100%;
	max-width:600px;
	overflow: hidden;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.product-video-li-element {
    position: relative;
    max-width: 600px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.product__tags {
	padding:0 16px;
	text-align:center;
	color:#000000;
	text-decoration: none;
}
.product__tbox {
	margin:4px 0 0 0;
	display: flex;
	justify-content: center; 
}
.product__price {
	font-size:14px;
	color:#666;
	margin-right:12px;
	text-decoration: line-through;
}
.product__sale {
	font-size:12px;
	color:#333;
	font-weight:bold;
}
.Tapme_display_cards {
	margin:auto;
	max-width:2700px;
	padding:0;
}
.video-Bbox {
    position: relative;
    margin: 80px auto 0 auto;
    width: 90%;
    max-width: 540px;
    display: block;
    clear: both;
}
.video-youtube {
    position: relative;
    height: 0;
    padding-bottom: 177.7%;
    overflow: hidden;
	border:1px solid #ddd;
}
.video-youtube iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
.selector-font-tbox{
    position: relative;
    height: 38px;
    border-radius: 16px;
    overflow: hidden;
    display: inline-block;
	margin:4px 4px 0 0;
    padding: 0 8px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #dddddd;
    line-height:40px;
    font-size: 13px;
    color: #111;
    font-weight: 400;
}


/********************************** Header **********************************/
.Main-head-container   {
    position:relative;
	margin:auto;
	height:840px;	
	background: #667db6;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #667db6, #0082c8, #0082c8, #667db6);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #667db6, #0082c8, #0082c8, #667db6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.Main-head-bgMask {
    width: 100%;
    height: 100.3%;
    overflow: hidden;
    position: absolute;
    background: #eee;
    background: #1D2943;
    opacity: .0;
}
.Main-head-box {
	position: relative;
    margin: auto;
    height: 100%;
    max-width: 1100px;
    vertical-align: middle;
	overflow: hidden;
	z-index: 1;
}
.Main-head-title {
	position: relative;
	width:50%;
	float: left;
	margin-left:30px;
	margin-top: 340px;
	z-index:2;
}
.Main-head-h1 {   
    display: inline-block;
	letter-spacing:-1px;
	color:#3d454d;
}
.Main-head-h1 span {
   color: #00a2e1;
   padding-bottom:8px;
   clear:both;
}
.item-container-header {
	background-color:#FFE564;
}
.shop-img-content-tag {
    width: 100%;
    max-width: 600px;
    margin: auto;
    text-align: center;
}
.custom-img-box {
	margin:auto;
    width: 100%;
	max-width:1600px;
	height:550px;
    padding: 0;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

/***********************************  shop index 0503*************************************/
#how_to_work {
    margin:0 auto;	
	max-width: 1900px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;	
}
.how_to_work_box {
    position: relative;
	margin-top:80px;
	padding-bottom: 60px;
	padding-right: 4%;
    padding-left: 4%;
	box-sizing: border-box;	
}
.how_to_work__item {	
	text-align: center;
    border-radius: 26px;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
	overflow:hidden;
    display: flex;
	background-color:#FFFFFF;
}
.how_to_work__content {	
    padding: 0 8% 40px;
}
.how_to_work_picture {
    transition: opacity 150ms ease 0s;
    opacity: 1;
	padding:0;
}
.how_to_work_picture img {
    position: relative;
	vertical-align: middle;
}
.how_to_work__price {
    color: #000;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
	padding:20px 0;
}
.how_to_work__h1 {
	text-align:center;
	font-size: 32px;
	color:#272829;
    font-weight: 300;
	margin:12px 0 12px;
}
.how_to_subtitle {
	color: #666;
    font-size: 18px;
    font-style: italic;
    font-weight: 400;
	padding-bottom:12px;
}
.how_to_work__text  {
	text-align:center;
	font-size:16px;
	padding: 0 18px; 
	min-height:90px;
	transition: opacity 200ms ease 0s;
}
.how_to_work__btn {
	border: 2px solid #000;
    text-align: center;
	margin:auto;
	max-width:160px;
	font-size:16px;
	color:#000;
    background-color: #fff;
    border-radius: 80px;
    padding: 13px 32px;
    font-weight: 600;
    line-height: 1.375;
    transition: all .3s ease-in-out;
}
/***********************************  shop index *************************************/
/* Main Text Sider */
	.Slider-wrapper {
	  position:relative;
	  font-weight: bold;
	}
	.Slider{
	  height: 40px;
	  margin-bottom:6px;
	  display:inline block;
	  overflow: hidden;
	}
	.Slider div {
	  height: 40px;
	  margin-bottom: 6px;
	  padding:0 12px 0 0;
	  display:block;
	  text-align: left;
	  box-sizing: border-box;
	}
.linear-grbg {
  background-image: linear-gradient(#fef399,#fef399);
  background-position-y: 100%;
  background-repeat: no-repeat;
  background-size: 100%  2px;
}
/*goods option */
.select-good-color {
	width:40px;
	height:40px;
	border: 1px solid #ddd;
    box-shadow: 1px 1px 2px 1px #ddd;
	border-radius: 0.2em;
	background-color:#f4f4f4;
}
/*goods option End*/
/*Main Text Sider */
.Main-head-img {
    position: absolute;
    bottom:0;
    right: 0;
    width: 420px;
}
.Main-head-img img {
	vertical-align:middle;
}
.M__container {
	 position:relative;
	 width:100%;
}
.M__container_intro {
	position: absolute;
	margin-top:70px;
	margin-left:52px;
	width:240px;
	height:420px;
	background-color:#fff;
	overflow: hidden;
	z-index:1;
}
.M-slider-card {
    position: absolute;
    top:100px;
    right: 260px; 
    width: 306px; 
	height:194px;
	transition: transform 0.35s cubic-bezier(0.13, 1.03, 0.39, 0.98), box-shadow 0.35s cubic-bezier(0.13, 1.03, 0.39, 0.98), border-width 0.35s cubic-bezier(0.13, 1.03, 0.39, 0.98);
	z-index:0;
	box-shadow: 0px 1.2vw 4vw -1vw rgba(0, 0, 0, 0.6);
	border: 1px solid rgba(0, 0, 0, 0.3);
	border-radius: 1.1vw;
	animation: slide-card 6s linear infinite;
}
.M-slider-card-img  {
	position: absolute;
    width: 306px; 
	height:194px;
	right:0;
	background-repeat: no-repeat;
	background-image: url("../img-file/m_main/card-topyellow.png");
    background-position: 0 0;
    background-size:100%;
}
.M-mobile__bg {
    position:relative;
	margin:auto;
	width:420px;
	height:596px;	
	background-image: url(../img-file/m_main/smart-hand.png);
    background-size: cover;
	z-index:2;
}
.M-mobile__lodding {
	position: absolute;
	width:120px;
	height:120px;
	top:0%;
	left:0%;
	animation: slide_mobile_lodding 6s infinite ease-in-out;	
}
.M__mobile_case {
	position:relative;
	background-color:#fff;
	animation: slide_mobile_cover 6s infinite ease-in-out;	
}
@keyframes slide-card {
   0%  {left: 30%; transform: rotate(-30deg);}
   4%  {left: 30%;  transform: rotate(-30deg);}
  10% {left: 50%; transform: rotate(-20deg) translateY(-20px);}
  12% {left: 50%; transform: rotate(-20deg) translateY(-60px);}
  15% {left: 55%; transform: rotate(-5deg) translateY(0px);}
  20% {left: 55%; transform: rotate(-5deg) translateY(0px);}
  25% {left: 50%; transform: rotate(-15deg) translateY(-50px);}
  35% {left: 50%; transform: rotate(-15deg) translateY(-50px);}
  40% {left: 30%; transform: rotate(-30deg) translateY(5px); }
  44% {left: 30%; transform: rotate(-30deg) translateY(0);}
  100% {left: 30%; transform: rotate(-30deg);}
}
@keyframes slide_mobile_lodding {
0%     {  opacity: 0; }
10%   {  opacity: 0; }
20%   {  opacity: 1; }
24%   {  opacity: 1; }
25%   {  opacity: 0; }
100% {  opacity: 0;}
}
@keyframes slide_mobile_cover {
0%     {  opacity: 0; }
20%   {  opacity: 0; }
25%   {  opacity: 1; }
100% {  opacity: 1;}
}
@media screen and (max-width: 1020px) {
	.Main-head-container {
		position:relative;
		margin:auto;
		height:auto;	
	}
	.Main-head-title {
		width:80%;
		float:none;
		max-width:600px;
		margin:auto;
		padding:80px 0 180px 0;
		clear:both;
	}
	.Main-head-img {
		position: relative;		
		margin:0 auto;	
		width:252px;	
		overflow: hidden;
		bottom:0;		
		right:-90px;
	}
	.M-mobile__bg {
		width:252px;
		height:357px;	
	}
	.M__container_intro {
		margin-top:42px;
		margin-left:32px;
		width:146px;
		height:250px;
	}
	.home-color-p1 {
		padding:16px 0 64px 0;
	}
	.How-bg-container {
		padding-top:64px;
		padding-bottom:64px;
	}
	.homeMain-p3 {font-size: 32px; }
	.homeMain-p5 {font-size: 18px;}
	ul.map-casebox {
		margin-top:0px;
	}
	.M-slider-card {
		position: absolute;
		top:380px;
		right: 420px; 
		width: 183px; 
		height:116px;
		animation: slide-card 6s linear infinite;
	}
@keyframes slide-card {
	   0%  {left: 10%; transform: rotate(-30deg);}
	   4%  {left: 10%;  transform: rotate(-30deg);}
	  10% {left: 30%; transform: rotate(-20deg) translateY(-20px);}
	  12% {left: 30%; transform: rotate(-20deg) translateY(-60px);}
	  15% {left: 35%; transform: rotate(-5deg) translateY(0px);}
	  20% {left: 35%; transform: rotate(-5deg) translateY(0px);}
	  25% {left: 30%; transform: rotate(-15deg) translateY(-50px);}
	  35% {left: 30%; transform: rotate(-15deg) translateY(-50px);}
	  40% {left: 10%; transform: rotate(-30deg) translateY(5px); }
	  44% {left: 10%; transform: rotate(-30deg) translateY(0);}
	100% {left: 10%; transform: rotate(-30deg);}
}
	.M-slider-card-img {
		position: absolute;
		width: 183px; 
		height:116px;
		right:0;
		background-repeat: no-repeat;
		background-image: url("../img-file/m_main/card-topyellow.png");
		background-position: 0 0;
		background-size:100%;
	}
	.M-mobile__lodding {
		position: absolute;
		width:100px;
		height:100px;
		top:0%;
		left:0%;
		animation: slide_mobile_lodding 6s infinite ease-in-out;	
	}
}
/********************************** Header End **********************************/
/**********************************    Nes Css   **********************************/
.Tapme_container {
	 position:relative;
	 padding:80px 0 20px 0;
}
.Tampe_head_title {
	width:90%;
	max-width:860px;
	margin:auto;
	text-align:center;
}
.Tampe_head_title span {
	color:#5479F7;
	font-weight:800;
}
.Tapme_sub-title {
	width:90%;
	max-width:860px;
	margin:16px auto;
	font-size:22px;
	line-height:140%;
	text-align:center;
}
.Tapme_shop-title {
	padding-left:16px;
	max-width:860px;
	margin:16px 0;
	font-size: 18px;
    line-height: 120%;
    letter-spacing: -1.0px;
	text-align:left;
}
.linear-grbg-gry {
  background-image: linear-gradient(#5479F7,#5479F7);
  background-position-y: 100%;
  background-repeat: no-repeat;
  background-size: 100%  .195rem;
}
.Tapme_space {
	padding-bottom:80px;
}
.Main-shopbox  {
	margin:auto;
	width:100%;
	max-width:1900px;
	clear:both;
}
 .Main-shop_li  {
	float:left;
	width:33.332%;
}
.Main-shop__box {
	margin:8px;
}
.Main-shop__box img {
	vertical-align:middle;
}
.Main-Link-button {
	color:#ffffff;
    font-size: 18px;
	padding: 18px 30px;
	width:150px;
	font-weight:500;
	background-color: #232323;
    border: 1px solid #232323;
	margin:30px auto;
    text-align: center;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    cursor: pointer;    
}
.Basket-Link-button {
	width:90%;
	max-width:380px;
    font-size: 18px;
	padding: 18px 0;
	font-weight:500;
	background: #1dadeb;
    color: #fff;
    border: 1px solid #1dadeb;
	margin:0 auto;
	margin-bottom:30px;
    text-align: center;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    cursor: pointer;    
}
.Main-Video-box  {
	margin:auto;
	width:90%;
	max-width:680px;
    height: 680px;
}
 .Main-Video-box video {
	width:100%;
}
.Main-professional-img {
    margin:0 auto 60px auto;
    width: 224px;
    height: 148px;
    color: #222;
    text-align: center;
    clear: both;
    background-repeat: no-repeat;
    background-position: center center !important;
    background-size: cover;
    background-image: url(../img-file/m_main/pros-bottom02.svg);
}
.Main-step-container {
    max-width: 1160px;
	margin:auto;
	margin-top:64px;
}
.Main-step-container-li {
    float:left;
	width:33.32%;
}
.Main-step-box {
	margin:auto;
	margin-left:32px;
	margin-right:32px;	
}
.Main-imgstep {
    position: relative;	
	margin-bottom:8px;
	clear:both;
}
.Main-imgstep-box {	
	margin:auto;
	max-width:194px;
	text-align:center;
	clear:both;
}
.Main-step-text-box {	   
		padding:0;
		color: #333333;
		text-align:center;
}
.Main-step-text-span {
    color: #1c85e8;
    font-size: 12px;
    font-weight: 500;
	letter-spacing:2px;
    margin-bottom: 6px;
}
.Main-step-text-h3 {
    margin: 4px 0;
}
.Main-step-text-p {
	padding:5px 0;
}
.f_btn_design {
	background: linear-gradient(276.19deg, #e3cc55 21.13%, #e355bb 112.54%, #ff6868 274.15%, #7839ff 373.67%), linear-gradient(0deg, #000, #000);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	width: 100%;
    height: 54px;
    border-radius: 250px;
    text-decoration: none;
    -webkit-transition: .4s ease all;
    transition: .4s ease all;
    padding: 1px;
	font-size:14px;
	color:#ffffff;
	cursor: pointer;
}
@media screen and (max-width: 1200px) {
	#how_to_work {
		grid-template-columns: 1fr 1fr 1fr ;	
	}
}
@media screen and (max-width: 800px) {
	#how_to_work {
		margin:0 auto;	
		width:90%;
		max-width: 700px;
		display: grid;
		grid-template-columns: 1fr 1fr;	
		margin-bottom:10px;
	}
	.how_to_work_box {
		position: relative;
		margin-top:60px;
		padding-bottom: 0;
	}
	.how_to_work__item {	
		border-radius: 26px;
	}
	.how_to_work__price {
		font-size: 14px;
	}
	.how_to_work__h1 {
		font-size: 32px;
	}
	.how_to_subtitle {
		font-size: 16px;
	}
	.how_to_work__text  {
		font-size:16px;
		min-height:40px;
	}
	.Main-step-container-li {
		width:50%;
		margin-bottom:52px;
	}
	 .Main-shop_li  {
		float:left;
		width:50%;
	}
}
@media screen and (max-width: 560px) {
	#how_to_work {
		grid-template-columns: 1fr;	
	}
	.Main-step-container-li {
		float:none;
		width:80%;
		margin:auto;
		margin-top:52px;
	}
	.Main-imgstep-box {	
		max-width:140px;
	}
	.Main-step-text-box {	   
		padding:0;
		margin:auto;
	}
	 .Main-shop_li  {
		float:none;
		width:100%;
	}
	.Main-shop__box {
		margin:12px 0 0 0;
	}
}

/**********************************    Nes Css  End  **********************************/

#product_layout {
    margin:0 auto;	
	max-width: 2400px;
	font-size: 14px;
}
#product_container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr  1fr;	
	margin-bottom:80px;
}
.product__item_box {
    position: relative;
	padding-bottom: 60px;
	box-sizing: border-box;
}

.product__item_picture {
    transition: opacity 150ms ease 0s;
    opacity: 1;
}

.item_picture {
	overflow: hidden;
	border-radius: 0;
	background-color: #FFFFFF;
	outline:1px solid #DDDDDD;
}
.item_picture img {
    position: relative;
	vertical-align: middle;
}
.procuct-template__text  {
	padding: 0 8px; 
	text-align:center;
	transition: opacity 200ms ease 0s;
}


#product_design {
	width: 75%;
    max-width: 1800px;
	margin: 0 auto;
	padding:0 8px;
    display: grid;
    grid-template-columns: 1fr  1fr 1fr  ;	
}
.product_design_item {
    position: relative;
	box-sizing: border-box;
	margin-bottom:20px;
}
.product__item {		
}
.product_design_picture {
    transition: opacity 150ms ease 0s;
    margin:15px 8px;
	cursor: pointer;
}
.product_design_item_picture {
	background-color: #FFFFFF;
}
.product_design_item_picture img {
    position: relative;
	vertical-align: middle;
}
.product__tags {
	font-size:12px;
}

/* price */
strike {
    text-decoration: line-through;
}
.product_price {	
	font-size:24px;
	font-weight: 700;
	color:#333;
}
.product_price_sale {
	margin:6px 0 0 0;
	color:#333;
	font-size:14px;
}
.product_price_sale span {
	color:#999999;
}
.product_price_s {
	padding-top:6px;
	font-size:18px;
	font-weight: 700;
	color:#333;
}
.product_price_s span {
	color:#999999;
}
.pr__h2 {
	padding:12px 0 0 0;
	font-size:24px;
	font-weight: 300;
	line-height:1.2;
}
.pr__p {
	display:block;
	padding-top:8px;
	font-size:16px;
	line-height:1.4;
}
.product__display {
		display: flex;
		background-color:#F1F9F9; 
		width:100%;
		height:100%;
		align-items: center;
		justify-content: center;
}
.product__display_cus {
background: #fc4a1a;  /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #f7b733, #fc4a1a);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #f7b733, #fc4a1a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.product__display_biz {
	background: #00d2ff;  
	background: -webkit-linear-gradient(to bottom, #3a7bd5, #00d2ff);  
	background: linear-gradient(to bottom, #3a7bd5, #00d2ff); 
}
.u-padding-horizontal-m {	
	font-size:24px;
	color:#ffffff;
	text-align:center;
	padding-top:8px;
    padding-left: 24px !important;
    padding-right: 24px !important;
}
.u-textAlign-center {
	text-align:center;
}
.layout__item_block {
	margin-top: 50%;
	padding-left: 30px;	
}

.Main-shop-productbox {
    display: block;
    margin-left: 18px;
    padding: 12px 0 0;
}
.Main-shop-product-title {
    display: block;
    margin-left: 18px;
    padding: 8px 0 0;
}
.Main-shop-product-price {
    display: block;
    margin-left: 18px;
    padding: 0;
}
.procuct-template__body {
	height:100px;
}
.procuct-template__btext {	
	text-align:center;
	padding: 36px 16px 0px 16px; 
}
.col-color-sky {
	background-color:#f3ed8d;
}
.col-color-gry {
	background-color:#F7ECE7;
}
        /*jssor slider arrow skin 106 css*/
		.jssor_1_stylebox {
			width:120px;height:120px;
			overflow: hidden;			
		}
        .jssora106 {display:none;position:absolute;cursor:pointer;}
        .jssora106 .c {fill:#fff;opacity:.3;}
        .jssora106 .a {fill:none;stroke:#000;stroke-width:350;stroke-miterlimit:10;}
        .jssora106:hover .c {opacity:.5;}
        .jssora106:hover .a {opacity:.8;}
        .jssora106.jssora106dn .c {opacity:.2;}
        .jssora106.jssora106dn .a {opacity:1;}
        .jssora106.jssora106ds {opacity:.3;pointer-events:none;}
		.jssora106_L {width:55px;height:55px;bottom:52px;left:10px;}
		.jssora106_R {width:55px;height:55px;bottom:52px;right:10px;}
		.jssora106_svg {position:absolute;top:0;left:0;width:100%;height:100%;}

        /*jssor slider thumbnail skin 101 css*/
		.jssort101 {position:absolute;left:0px;top:1000px;width:1000px;height:160px;display:block;}
        .jssort101 .p {position: absolute;top:0;left:0;box-sizing:border-box;background:#fff;}
        .jssort101 .p .cv {position:relative;top:0;left:0;width:100%;height:100%;border:2px solid #fff;box-sizing:border-box;z-index:1;}
        .jssort101 .a {fill:none;stroke:#fff;stroke-width:400;stroke-miterlimit:10;visibility:hidden;}
        .jssort101 .p:hover .cv, .jssort101 .p.pdn .cv {border:none;border-color:transparent;}
        .jssort101 .p:hover{padding:2px;}
        .jssort101 .p:hover .cv {background-color:rgba(0,0,0,6);opacity:.35;}
        .jssort101 .p:hover.pdn{padding:0;}
        .jssort101 .p:hover.pdn .cv {border:2px solid #fff;background:none;opacity:.35;}
        .jssort101 .pav .cv {border-color:#fff;opacity:.35;}
        .jssort101 .pav .a, .jssort101 .p:hover .a {visibility:visible;}
        .jssort101 .t {position:absolute;top:0;left:0;width:100%;height:100%;border:none;opacity:.6;}
        .jssort101 .pav .t, .jssort101 .p:hover .t{opacity:1;}

		
		.jssor_cardbox  {
			position:relative;
			margin:0 auto;
			top:0px;left:0px;
			width:1500px;
			height:1000px;
			visibility:hidden;
		}
		.jssor_cardbox_in {
			cursor:default;position:relative;top:0px;left:0px;width:1500px;height:1000px;overflow:hidden;
		}
.single-option-selector {
		width:100%;
		margin-bottom: 0;
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		padding: 22px 22px 22px 32px;
		cursor: pointer;
		border: 1px solid #a0a0a0;
		border-radius: 10px;
		min-height: 46px;
		display: inline-block !important;
		color: black;
		line-height: 1.2;
}

.item-display-card {
	position: relative;

}
.Item-display-step02 {
	position: absolute;
	left:15%;
	bottom:31%;
	width:74%;
	overflow: hidden; 
	transform: perspective(2000px) rotateY(6deg ) rotateX(36deg)  rotate(-29deg);
}
.Item-display-step03 {
	position: absolute;
	left:18.0%;
	bottom:29.2%;
	width:67%;
	overflow: hidden; 
	transform: perspective(4000px)  rotateX(36deg)  rotate(15deg)  scaleY( 1.0 ); 
}
.Item-display-step03-01 {
	position: absolute;
	left:26.0%;
	bottom:25.5%;
	width:61%;
	overflow: hidden; 
	transform: perspective(500px)  rotateX(15deg)  rotate(20deg)  scaleY( 1.0 );
}
.Item-display-step04 {
	position: absolute;
	left:7%;
	bottom:42%;
	width:55%;
	overflow: hidden; 
	transform:  rotate(-61deg)  ;
}
.Item-display-step04-01 {
	position: absolute;
	left:10%;
	bottom:46.5%;
	width:57%;
	overflow: hidden; 
	transform:  rotate(-45deg)  ;
}
.Item-display-step05 {
	position: absolute;
	left:17%;
	top:15%;
	width:52%;
	overflow: hidden; 
	transform:  rotate(-39deg)  ;

}
.Item-display-step05-01 {
	position: absolute;
	left:55%;
	top:47%;
	width:40%;
	overflow: hidden; 
	transform:  rotate(-41deg)  ;

}
.Item-display-step06 {
	position: absolute;
	left:33%;
	top:44.5%;
	width:44%;
	overflow: hidden; 
	transform: perspective(2000px) rotateY(6deg ) rotateX(36deg)  rotate(-40.5deg) scaleY( 0.98 );

}
.Item-display-step07 {
	position: absolute;
	left:7%;
	top:39.5%;
	width:37%;
	overflow: hidden; 
	transform: perspective(500px)  rotateX(0deg)  rotate(36deg) ;

}
.Item-display-step07-01 {
	position: absolute;
	left:35.9%;
	top:23.5%;
	width:26.7%;
	overflow: hidden; 
	transform:  rotate(-53.7deg)  ;

}
.item-rds {
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	box-shadow: 0 12px 12px -8px black;
}
.item-container {
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	max-width:1800px;
	margin:auto;
}
.item-display-box {
	width:50%;
	overflow:hidden;
}
.item-display-pet {
	position: relative;
}
.Item-display-pet-step01 {
	position: absolute;
	left:23.4%;
	bottom:15%;
	width:59%;
	overflow: hidden; 
}
.Item-display-pet-step02 {
	position: absolute;
	left:18.1%;
	bottom:20.2%;
	width:62.2%;
	overflow: hidden; 
	transform: perspective(500px)  rotateX(5deg)  rotate(-5deg);
}
.Item-display-pet-step03 {
	position: absolute;
	left: -8%;
	bottom:10%;
	width:92%;
	overflow: hidden; 
}
.Item-display-pet-step04 {
	position: absolute;
	left:25%;
	bottom:15.6%;
	width:49.8%;
	overflow: hidden; 
	transform:  rotate(8deg);
	z-index:-1 !important;
}
.item-display-led {
	position: relative;
}
.Item-display-led-step01 {
	position: absolute;
	left:23.4%;
	bottom:15%;
	width:59%;
	overflow: hidden; 
}
.Item-display-led-step02 {
	position: absolute;
	left:18.5%;
	bottom:20%;
	width:62.2%;
	overflow: hidden; 
	transform: perspective(500px)  rotateX(5deg)  rotate(-5deg);
}
.Item-display-led-step03 {
	position: absolute;
	left: -8%;
	bottom:10%;
	width:92%;
	overflow: hidden; 
}
.Item-display-led-step04 {
	position: absolute;
	left:25%;
	bottom:15.6%;
	width:49.8%;
	overflow: hidden; 
	transform:  rotate(8deg);
	z-index:-1 !important;
}
@media screen and (max-width:1600px) {
	.item-display-box {
		width:50%;
	}
}
@media screen and (max-width:800px) {
	.item-display-box {
		width:100%;
	}
}
@media screen and (max-width: 1600px) {
	#product_container {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
	}
}
@media screen and (max-width: 800px) {
	#product_container {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	.jssora106 {display:block;}
	
	/*
	.jssor_1_stylebox { 	border-radius: 0;background-color:#f9f9f9; }	
	.jssort101 { height:0; display:none;} 
	*/
}
/* »ó¼¼ÆäÀÌÁö ¹× Àå¹Ù±¸´Ï */

.product-area {
	position: relative;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
	margin-top:120px;
	display: flex;
}
.product-area .product-goods-box {
    width: calc(100% - 500px);
}
.product-goods-images {
	position: relative;
	margin-bottom:15px;
}
.product-area .theme-images  {
    height: auto;
	padding-top: 100.0%;
    background-size: cover;
	border:1px solid blue;
}
/* »ó¼¼ÆäÀÌÁö */
.product-area-details {
	position: sticky;
    width: auto;
    padding-left: 0;
    padding-right: 0;
}
.product-area-inner {
	width:450px;
	padding-left:50px;	
}
.product-area-inbox {		
	background-color:#ffffff;
}
.product-area-msg {
	padding: 16px 8px 0 8px;
	border-top:1px solid #e4e4e4;
}
.p_sub__title {
}
.p_sub__msg {
	padding-bottom:4px;
}
.product-area-details__title {
    font-weight: 700;
    color: #333;
    display: block;	
    line-height: 1.25em;
}
.product-area-details__head {
	text-align:center;
}
.product-area-details__memo {
    text-align: left;    
    color: #333;
    display: block;
    line-height: 1.25em;
}

.product-form__area {
	margin:auto;
	max-width:400px;
    display: flex;
    flex-wrap: wrap;
}
.prod-price {
    color: #999999;
}
.prod-price__all {
    color: #333;
	font-weight: 800;
}
.prod-price__save {
    margin: 6px 0 0 0;
    color: #333;
    font-size: 18px;
	text-decoration: line-through;
}


.quantity-wrapper {
    width: 144px;
    border: 1px solid #bbb;
    position: relative;
    display: inline-block;
    vertical-align: middle;
}
.quantity-wrapper #goods__sum {
    display: inline-block;
    padding: 8px 0;
	width:40px;
    margin-bottom: 0;
    font-size: 18px;
    font-weight: 800;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
	cursor: pointer;
	background-color:#f4f4f4;
}
.quantity-wrapper #goods__sum[data-quantity=down] {
	border-right: 1px solid #cbcbcb;
}
.quantity-wrapper #goods__sum[data-quantity=up] {
	border-left: 1px solid #cbcbcb;
}
.quantity-wrapper input {
	margin-left:6px;
    border: none;    
    width: 44px;
	height: 34px;
    text-align: center; 
    font-size: 16px;
    line-height: 38px;
    letter-spacing: 0;
    color: #333;
    position: relative;
	 display: inline-block;
    font-weight: 400;
	background-color:#ffffff;
}
#Basket-Link-button {
	display:none;
}
.product-body-text {	
	position: relative;
	width:100%;
    margin-left: auto;
    margin-right: auto;
	padding:0;
	border-top: 1px solid #ddd;
	background-color:#ffffff;
}
.product-details-text {
	max-width:100%;
}

.product-details-text .Product_NO_SPACE {
    margin: 0;
}
.Product_NO_SPACE img{
	vertical-align: middle;
}
@media screen and (max-width: 980px) {
	.product-area {
		position: relative;
		max-width: 1100px;
		margin-left: auto;
		margin-right: auto;
		margin-top:0;
		display: block;
	}
	.product-area-inner {
		margin:auto;
		width:90%;
		max-width:600px;
		padding:24px 0;	
	}
	.product-area .product-goods-box {
		width: 100%;
	}
	

}
/* cart */

.basketdiv {
    width: 94%;
	max-width:980px;
	margin:auto;
    margin-bottom: 20px;
}
    .basketdiv .row.head {
        border-bottom: 1px dashed #888;
        box-sizing: border-box;
    }
    .basketdiv .data {
		position: relative;	
        border-bottom: 1px dashed #888;
        box-sizing: border-box;
        float: left;
        width: 100%;
    }
    .basketdiv .data .empty{
        text-align: center;
        padding: 12px 0;
    }
    .basketdiv .row.head .subdiv {
        background-color: #f4f4f4;
    }
    .basketdiv .row > .subdiv {
        display: block;
        float: left;
    }
    .basketdiv .row > .subdiv:nth-child(1) {
        width: 35%; 
		max-width:200px;
		padding:12px 0;
    }
    .basketdiv .row > .subdiv:nth-child(2) {
		padding:12px 0;
        width: 65%;
    }
    .basketdiv .row > .subdiv:nth-child(3) {
        position: absolute;
		top: 88px;
		right: 0;
		width: 70px;
    }

    .basketdiv .row > div > div {
        display: block;
        float: left;
        margin: 0;
    }
    .basketdiv .row.data > div > div {        
    }
	.basketdiv .data .num .updown {
		color: #0075ff;
		font-size: 2em;
		letter-spacing: -5px;
	}
	.basketdiv .check {
		width: 10%;
	}
    .basketdiv .check input[type=checkbox] {
        transform: scale(1.2);
    }
    .basketdiv .pname{
		font-size: 24px;
		line-height: 120%;
        padding-bottom:12px;
    }
    .basketdiv .basketprice {
		clear:both;
        width: 60px;
		font-size:14px;
		padding-bottom:12px;
    }
    .basketdiv .num {
	    clear:both;
        width: 60px;
    }
    .basketdiv .sum {
		float:left;
		margin:0 0 0 4px  !important;		
        color: #0000aa;
    }

    .basketdiv .basketcmd{
        width: 100%;
    }
    .baseform > tbody > tr > td:first-child {
        width: 100px;
    }
    .abutton {
        color: #000;
        cursor: pointer;
        padding: 6px 12px;
        width: auto;
        word-break: keep-all;
        border-radius: 5px;
		border:1px solid #ddd;
        text-decoration: none;
    }
.abutton-alt {
    background-color: #d3e2c6;
}
.basketprice_total {
	clear:both;
	margin: auto;
	padding:24px 0;
	max-width:980px;
	width:94%;
}
.basketrowcmd, .sumcount, .summoney{
  clear:both;
  text-align: right;
  margin: 10px;
}
.sumcount, .summoney{
  font-size: 1.25em;
    font-weight: bold;
}
.buttongroup{
  text-align: center;
}
.buttongroup a{
  text-decoration: none;
}
.cmd  {
	margin:auto;
	margin-top: 24px;
    padding: 16px 0;
    box-sizing: border-box;    
    background: #1dadeb;
    color: #fff;
    border: 1px solid #1dadeb;
    text-align: center;
}
.cmd  span {
    padding: 6px 20px;
    font-size: 0.8125em;
}
.retrun_Shop {
	display:none;
}
.orderform .p_num {
    text-align: right;
    width: 30px;
    font-size: 16px;
}


@media screen and (max-width: 580px) {
	#product_container {
		margin: 0 6px;
	}

}

.content-gallery {
    margin: 10px auto;
    padding: 0;
    width: 100%;
	max-width:1268px;
}
.mem-photo {
    position: relative;
}
.popup-gallery {
    width: 33.332%;
    float: left;
}
.popup-gallery-li {
    margin:45px;
}
.popup-gallery-bg {
    width: 100%;
    display: block;
	/*
    background-size: cover;
    background-position: center center !important;
    background-repeat: no-repeat;
    border-radius: 8px;
    overflow: hidden;
	background: rgba(255,255, 255, 0.1);
    border:1px solid #ddd; */
}
.popup-gallery-img {
	text-align:center;
    display: block;
    overflow: hidden;
	border-bottom:1px solid #ddd;
}
.popup-gallery-img img {
	margin:auto;
	width:80%;
}
.shop-bg-90 {
	width:90% !important;

}
.popup-gallery-txt {
	padding:8px 16px;
	min-height:100px;
	text-align:center;
}
.p-gallery-h2 {
    font-size: 18px;
    color: #333;
    line-height:1.3;
    font-weight: 400;
	padding:16px 0;
}
.shop-product-box {
	padding: 0;
}
.shop-product-photo {
	padding: 0;
}
.shop-product-head {
	margin:64px auto;
	padding-left:16px;
	padding-right:16px;
}
.font-theme-fw {
	color:#ffffff;
}
.select-theme-radius {
	border-radius:30px;
	overflow:hidden;
}
.shop-h1 {
	margin: auto;
    text-align: center;
    font-size: 52px;
    font-weight: 500;
    line-height: 1.2;
    width: 90%;
    max-width: 900px;
    word-break: keep-all;
}
.shop-h2 {
	font-size:36px;
	letter-spacing: -0.2px;
	line-height: 1.2;
	font-weight:400;
	max-width:900px;
	margin:auto;
	text-align:center;
	word-break: keep-all;
}
.shop-h3 {
	font-size:18px;
	font-weight:400;
	line-height: 1.4;
	word-break: keep-all;
	width:90%;
	margin:16px 0;
	max-width:700px;
	text-align:center;
}
.shop-img-content {
	width:100%;
	max-width:900px;
	margin:auto;
	text-align:center;
}
.shop-img-wide-content {
	position: relative;	
	width:100%;
	max-width:1200px;
	height:1230px;
	margin:auto;
	text-align:center;
	background-repeat: no-repeat;
	background-image: url("../img-file/display/pet-lookall03.png?v=11");
    background-size:cover;
	background-position:center center;
}
.arrow_pet_edit {
	position: relative;
	margin:30px auto;
	left:-80px;
	width: 80px; 
	transform: scale(0.8);
	-ms-transform: rotate(130deg); 
	-webkit-transform: rotate(130deg); 
	transform: rotate(130deg);
}
.btn_pet_edit {
	position: relative;
	margin:30px auto 60px;
	width: 220px; 
	text-align: center;
    padding: 20px 0;
    border: 1px solid #ffffff;
    cursor: pointer;
    color: #fff;
    border-radius: 36px;
    vertical-align: middle;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    background-image: linear-gradient(315deg, #079bff 0%, #55d4ff 100%);
}
.shop-product-titlebox {
	padding:100px 60px;
}
.shop-product-body {
	margin:auto;
	width:90%;
}
.shop-product-wb {
	margin:auto;
}
.section-imgbox {
	width:100%;
	max-width:1268px;
	margin:auto;
	margin-top:30px;
	text-align:center;
}
.section-imgbox .multi-width {
    display: grid;
    grid-auto-rows: auto;
    gap: 30px;
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 30px;
}
.shop-img-video {
	width:100%;
	max-width:900px;
	margin:auto;
	margin-top:30px;
	text-align:center;
}
.product-body-text img {
	vertical-align: middle;
}
.sp_margin_pad80 {
	margin-bottom:80px !important;
}
.shop-top-padding {
	padding-top: 240px !important;
}
.sp_top_pad80 {
	padding-top:160px !important;
}
.sp_bottom_pad80 {
	padding-bottom:160px !important;
}
.shop-bg-k000 {
	background-color:#000000 !important;
}
.shop-bg-k001 {
	background-color:#111111 !important;
}
.shop-bg-k100 {
	background-color:#E7E6E8 !important;
}
.shop-bg-k101 {
	background-color:#F1F1F1 !important;
}
.shop-bg-k102 {
	background-color:#4ECFFF !important;
}
.shop-bg-k103 {
	background-color:#ffde00 !important;
}
.shop-bg-k104 {
	background: #36D1DC;
    background: -webkit-linear-gradient(to top, #5B86E5, #36D1DC);
    background: linear-gradient(to top, #5B86E5, #36D1DC);
}
.shop-bg-k105 {
	background: #fada73;
    background: -webkit-linear-gradient(to top, #fada73, #f8d054);
    background: linear-gradient(to top, #fada73, #f8d054);
}
.shop-Video-style {
	width: 100%;
    max-width: 900px;
    margin: auto;
    text-align: center;
}
.shop-Video-youtube {
    position: relative;
    height: 0;
	width:100%;
    padding-bottom: 100%;
    overflow: hidden;
}
.shop-Video-youtube iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
@media screen and (max-width: 560px) {
	.shop-img-content {
		margin:auto;
		padding:0;
		text-align:center;
	}
	.shop-top-padding {
		padding-top: 120px;
	}
	.section-imgbox .multi-width {
		display: grid;
		grid-auto-rows: auto;
		gap: 15px;
		grid-template-columns: repeat(1, 1fr);
		margin-bottom: 15px;
	}
	.popup-gallery {
		width: 90%;
		float: none;
		margin:auto;
	}
	.popup-gallery-li {
		margin:15px;
	}
	.product_price_sale {
		font-size:12px;
	}
	.product_price_s {
		font-size:16px;
	}
	.pr__h2 {
		font-size:18px;
	}
}

.Cart-btn-container {
	max-width:400px;
    display: flex;
    justify-content: space-between;
	align-items: center;
	margin-bottom:32px;
}

.Cart-counter-box {
    width:108px;
    padding: 6px 12px;
	border-radius: 36px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #DDD;
}
.Cart-btn {
    width: 14px;
    padding: 12px 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: 900;
    color: #202020;
    cursor: pointer;
}
.Cart-count  {
	text-align:center  !important;
}
.select-on-focus {
	width:36px;
	text-align:center;
	border:none;
	background-color:#ffffff;
	font-size: 18px;
    font-weight: 600;
}
.nav-select-color li.active {
    color: red;
	box-shadow: 0 0 0 2px #10A1FF;
}
.cc-product-goods {
    display: flex;
    flex-wrap: wrap;
}
.cc-goods-detail {
    width: 82px;
    height: 102px;       
    display: inline-block;
    margin-right: 18px;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 400;
    text-align: center;    
}
.cc-goods-icon {
    width: 82px;
    height: 62px;   
	background-repeat: no-repeat;
	background-image: url("../img-file/display/product-goods.svg");
    background-size:83px 243px; /* 166 487 */
}
.cc-goods-pet-icon {
    width: 82px;
    height: 62px;   
	background-repeat: no-repeat;
	background-image: url("../img-file/display/product-goods-pet.svg");
    background-size:83px 243px; /* 166 487 */
}
.cc-goods-icon_bg01 {
    background-position: 0 4px;
}
.cc-goods-icon_bg02 {
    background-position: 0 -60px;
}
.cc-goods-icon_bg03 {
    background-position: 0 -120px;
}
.cc-goods-icon_bg04 {
    background-position: 0 -180px;
}
.cc-goods-text {
	padding:8px 0 0 0;
    font-size: 14px;
    font-weight: 400;
    text-align: center;   
}
.cc-goods-point {	
    box-shadow: 0 0 0 0 rgb(145 189 228);
    animation: pulse-green 2s infinite;
    margin-bottom: -2.5px;
    margin-right: 14px;
    display: inline-block; 
    border-radius: 50%;    
    height: 24px;
    width: 24px !important;
    transform: scale(1);
    

}
@keyframes pulse-green {
	0% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgb(145 189 228 / 70%);
	}
	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgb(145 189 228 / 0%);
	}
	100% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgb(145 189 228 / 0%);
	}
}

.bg-option-card {
    width: 32px;
    height: 32px;   
	background-repeat: no-repeat;	
    background-size:50px 50px; /* 166 487 */
	background-position: 8px 8px;
}
.bg-black-card      { background-color: #000000;}
.bg-white-card      { background-color:#FFFFFF; }
.bg-blue-card      { background-color: #4FA8ED; }
.bg-pink-card      { background-color: #E23B4D; }
.bg-yellow-card { background-color: #FFC107; }
.bg-purple-card  { background-color: #7B61FF; }

.bg-phone-tag {
    width: 64px;
    height: 64px;   
	background-repeat: no-repeat;	
    background-size:50px 50px; /* 166 487 */
	background-position: 8px 8px;
}
.bg-black-phonetag { 	background-image: url("../img-file/shop/sticker-black.png"); }
.bg-blue-phonetag  { 	background-image: url("../img-file/shop/sticker-blue.png"); }
.bg-pink-phonetag  { 	background-image: url("../img-file/shop/sticker-pink.png"); }
.bg-orange-phonetag  { 	background-image: url("../img-file/shop/sticker-orange.png"); }
.bg-purple-phonetag  { 	background-image: url("../img-file/shop/sticker-purple.png"); }


.bg-h-white-card { 	background-image: url("../img-file/display/h_card_white.png"); }
.bg-h-black-card { 	background-image: url("../img-file/display/h_card_black.png"); }
.bg-h-blue-card { 	background-image: url("../img-file/display/main_card_h_02.png"); }
.bg-h-yellow-card { 	background-image: url("../img-file/display/main_card_h_03.png"); }
.bg-h-pink-card { 	background-image: url("../img-file/display/main_card_h_04.png"); }
.bg-h-purple-card { 	background-image: url("../img-file/display/main_card_h_05.png"); }

@media screen and (max-width: 800px) { 
	.cc-goods-detail {
		width: 62px;
		height: 88px;       
		display: inline-block;
		margin-right: 16px;
		margin-bottom: 8px;
	}
	.cc-goods-icon {
		width: 62px;
		height: 52px;   
		background-repeat: no-repeat;
		background-image: url("../img-file/display/product-goods.svg");
		background-size:63px 184px; /* 166 487 */
	}
	.cc-goods-pet-icon {
		width: 62px;
		height: 52px;   
		background-repeat: no-repeat;
		background-image: url("../img-file/display/product-goods-pet.svg");
		background-size:63px 184px; /* 166 487 */
	}
	.cc-goods-icon_bg01 {
		background-position: 0 4px;
	}
	.cc-goods-icon_bg02 {
		background-position: 0 -42px;
	}
	.cc-goods-icon_bg03 {
		background-position: 0 -88px;
	}
	.cc-goods-icon_bg04 {
		background-position: 0 -134px;
	}

}
@font-face {
    font-family: 'LINESeedKR-Bd';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/LINESeedKR-Bd.woff2') format('woff2');   
    font-style: normal;
}
@font-face {
    font-family: 'LINESeedKR-Rg';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/LINESeedKR-Rg.woff2') format('woff2');   
    font-style: normal;
}
.customer-content {
	margin: 0 auto 0 auto;
    padding: 0 0 20px 0;
	max-width: 1200px;
}

.nfc_basic_company {
	position: absolute;
	top:42%;
	left:10%;
	width:80%;
	text-align:center;
    line-height: 1;
    color: #fff;
	z-index:999;
	font-family: 'LINESeedKR-Bd';	
    font-weight: 700;
    font-style: normal;
}
.nfc_basic_youname {
	position: absolute;
	top:50%;
	left:10%;
	width:80%;
	text-align:center;
    font-size: 14px;
	font-weight: 400;
    color: #fff;
	z-index:999;	
	font-family: 'NanumSquare';
    font-style: normal;
}
.nfc_card_company {
	position: absolute;
	top:14%;
	left:8%;
    font-size: 20px;
    line-height: 1;
    color: #fff;
	z-index:999;
	font-family: 'LINESeedKR-Bd';	
    font-weight: 700;
    font-style: normal;
}
.nfc_card_youname {
	position: absolute;
	top:25%;
	left:9%;
    font-size: 14px;
	font-weight: 400;
    color: #fff;
	z-index:999;	
	font-family: 'NanumSquare';
    font-style: normal;
}

.customer-goods-bg {
	position:relative;
	margin:auto;
	margin-bottom:20px;
	width:90%;
	max-width:410px; /* 856 * 0.48= 410, 540* 0.48 -260 */
}
.customer-goods-bg img {
	vertical-align: middle;
	
}
.customer-goods-img {
	overflow:hidden;
	border-radius:12px;
	box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25);
}



.product-faq-container- {
	position: relative;
    background: #ffffff;
    padding: 16px 8px 0 8px;
    margin: auto;
}

.accordion .accordion-item {
  border-bottom: 1px solid #e5e5e5;
}
.accordion .accordion-item button[aria-expanded=true] {
  border-bottom: 1px solid #333;
}
.accordion button {
  position: relative;
  display: block;
  text-align: left;
  width: 100%;
  padding: 18px 0;
  color: #000;
  font-size: 18px;
  font-weight: 400;
  border: none;
  background: none;
  outline: none;
}
.accordion button:hover, .accordion button:focus {
  cursor: pointer;
  color: #000;
}
.accordion button:hover::after, .accordion button:focus::after {
  cursor: pointer;
  color: #03b5d2;
  
}
.accordion button .accordion-title {
  padding: 18px 16px 18px 0;
}
.accordion button .icon {
  display: inline-block;
  position: absolute;
  top: 20px;
  right: 0;
  width: 22px;
  height: 22px;
 
}
.accordion button .icon::before {
  display: block;
  position: absolute;
  content: "";
  top: 9px;
  left: 5px;
  width: 10px;
  height: 2px;
  background: #666;
}
.accordion button .icon::after {
  display: block;
  position: absolute;
  content: "";
  top: 5px;
  left: 9px;
  width: 2px;
  height: 10px;
  background: #666;
}
.accordion button[aria-expanded=true] {
  color: #000;
}
.accordion button[aria-expanded=true] .icon::after {
  width: 0;
}
.accordion button[aria-expanded=true] + .accordion-content {
  opacity: 1;
  max-height: 1250px;
  transition: all 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content p {
  font-size: 18px;
  font-weight: 400;
  margin: 16px 0 32px 0;
}

.custom-content {
	width:100%;
	padding:0;
}
.custom-box{
	margin:auto;
	max-width:1800px;
	display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.custom-reverse {
	flex-direction: row-reverse;
}
.custom-li {
	flex-basis: 50%;
    display: flex;
	justify-content: center;
	align-items: center;
}
.custom-li-element {
	position: relative;
	max-width:1000px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.custom-li-element video {
	object-fit: cover;
    position: absolute;
    height: 100%;
    width: 100%;
    position: static;
}
.custom-text {
	max-width:600px;
	margin:auto;
	padding:42px 0;	
}
.product-card-content {
	width:100%;
	background-color:#111111;
	padding:0;
}
.product-video-content {
	width:100%;
	background-color:#ffffff;
	padding:0;
}
.product-video-box{
	margin:auto;
	max-width:1400px;
	display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.product-video-reverse {
	flex-direction: row-reverse;
}
.product-video-li {
	flex-basis: 50%;
    display: flex;
	justify-content: center;
	align-items: center;
}
.product-video-li-element {
	position: relative;
	max-width:1000px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.product-video-li-element video {
	object-fit: cover;
    position: absolute;
    height: 100%;
    width: 100%;
    position: static;
	vertical-align: middle;
}
.product-video-text {
	max-width:600px;
	margin:auto;
}
.section-about {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
	margin:auto;
	padding:0;
	background-color:#ffffff;
}
.section-about-li {
    font-size: 18px;
    line-height: 1.1;
    margin: 12px 0;
	background-image: url(../pet/img/pet_circle.svg);
	background-position: 0 2px;
	background-repeat: no-repeat;
    color: #000;
    padding-left: 32px;
}
.section-about-li-tex {
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 16px;
    color: #000;
    padding-left: 32px;
}
@media screen and (max-width: 800px) {
		.product-video-box{
			flex-direction: column;
			padding-top:60px;
		}
		.product-video-content {
			padding:0;
		}
		.product-video-li-element {
			border-radius: 0;
		}
		.product-video-li {
			flex-basis: 100%;
		}	
		.custom-box{
			flex-direction: column;
			padding-top:0;
		}
		.custom-li {
			flex-basis: 100%;
		}
		.custom-li-element {
		}
		.Main-shopbox  {
			margin-top:40px;
		}
}
.shop-step-box {
	text-align:center;
}
.shop-step-title {
	display:inline-block;
	margin:auto;
	text-align:center;
	font-size:32px;
	font-weight:300;
	padding-bottom:2px;
	margin-bottom:24px;	
	border-bottom:1px solid #999;
}

.card-animation-box {
	position: relative;
	margin:auto;	
	margin-top:16px;
	width:100%;
	max-width:600px;
	box-sizing: border-box;
}
.card-mobile-box {
  position: relative;
  margin:auto;
  width:320px;
  height: 180px;
  z-index: 1;
}
.card-mobile-two {
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 0;
  margin: 0;
  padding: 0x;
  list-style: none;
  width: 90px;
  height: 160px;
  background-repeat:no-repeat;
  background-position: center center !important;
  background-size:cover;	
  background-image: url("../img-file/display/smartphone_line.svg");
  transform: translate(0, -50%); 
  will-change: transform, opacity, right;
}
.card-animation-ul {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 1;
  margin: 0;
  padding: 0;
  list-style: none;
  width: 90px;
  height: 160px;
  background-repeat:no-repeat;
  background-position: center center !important;
  background-size:cover;	
  background-image: url("../img-file/display/smartphone_line.svg");
  transform: translate(0, -50%);
}
.card-animation-ul > * {
  position: absolute;
}

.card-animation-ul li {
  top: 28px;
  left: 6px;
  width: 78px;
  height: 100px;
  /*
  box-shadow: 0 2px 4px rgba(50, 50, 50, 0.3);
  transform-origin: 50% 50%;
  */
  background-color: #fff;
}

.card-animation-ul li:nth-child(1) {
  left: 6px;
  z-index: 50;
  transform: scale(1);
  opacity: 0.3;

} 
.card-animation-ul li:nth-child(2) {
  left: 6px;
  z-index: 50;
  animation: article-two forwards 5s infinite;
}
.card-animation-ul li:nth-child(3) {
  left: 6px;
  z-index: 45;
  animation: article-three forwards 5s infinite;
}
.card-biz-box {
	width:100%;
	height:100px;
}
.card-biz-bgimg {
	margin: 6px auto;
	width:40px;
	height:40px;
	border:1px solid #ddd;
	background-repeat:no-repeat;
	background-position: -20px 0;
    background-size:200px 80px;
    background-image: url("../img-file/display/phone-share.svg");	
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.card-biz-user-img {
	width:30px;
	height:30px;
	margin:auto;
	margin-top:-15px;
	overflow: hidden;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #FFFFFF;	
}
.card-biz-user-txt {
	margin:8px;
	height:32px;
	font-size:11px;
	overflow: hidden;
}
.msg_bar {
    background-color: #e9e9e9;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    height: 8px;
    margin-bottom: 4px;
}
.card-animation-button {
  position: absolute;
  bottom: 0px;
  left: 45px;
  margin-left: -16px;
  z-index:99;
  padding: 0;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 100%;
  -webkit-appearance: none;
  background-color: #FFE812;
  background-repeat:no-repeat;
  background-position: center center !important;
  background-size:90%;	
  background-image: url("../img-file/display/kakaotalk.svg?v=124");
  animation: button forwards 5s infinite;
}
.phone-share {
  position: relative;
  margin:auto;
  width:100%;
  height: 270px;
  background-repeat:no-repeat;
  background-position: center center !important;
  background-size:100%;	
  background-image: url("../img-file/display/phone-share.svg");
}
@keyframes button {
  0%,
    5% {
    transform: scale(1);
  }
  20% {
    transform: scale(0.5625);
  }
  35% {
    transform: scale(1);
  }
  65%,
    85% {
    transform: scale(1);
  }
}

@keyframes article-two {
  0%
       {
    left: 6px;
    transform: scale(1);
    opacity: 1;
  }
  0%,
    15% {
    left: 6px;
    transform: scale(1);
    opacity: 1;
  }
  25% {
    left: 6px;
    transform: scale(0.8);
    opacity: 1;
  }
  45%,
    65% {
	left: 237px;
    transform: scale(0.8);   
    opacity: 0.3;
  }
  65%,
    90% {
    transform: scale(1);
	left: 237px;
    opacity: 1;
  }
  95%,
    100% {
    transform: scale(1);
	left: 237px;
    opacity: 0;
  }
    100% {
    transform: scale(1);
	left: 6px;
    opacity: 0;
  }
}

.how-works-container {
    width: 96%;
    max-width: 1400px;
    padding: 0;
    margin: auto;
    background-image: url(../pet/img/pet-road-line.svg);
    background-size: 100%;
    background-position: center center;
    background-repeat: no-repeat;
}
.how-works-box {
	position: relative;
	width:100%;
	max-width: 1300px;
	margin:auto;
}
.how-works-box .sectionTitle {
    margin-top: 30px;
	margin-bottom: 30px;
    color: #1abc9c;
	font-size:32px;
	text-align:center;
    font-weight: 700;
}
.how-works-stepbox {
	position: relative;
	margin:auto;
    width: 100%;
	height:550px;
}
.step-mobile {display:none;}
.step-pc {display:block;}
.how-works-stepbox .step_box {
	position: absolute;
    text-align: center;
	width:19%;
	height:260px;
}
.how-works-stepbox .step_01 {
    top: 90px;
	left:0;
}
.how-works-stepbox .step_02 {
    top: 120px;
	left:29%;
}
.how-works-stepbox .step_03 {
    top: 50px;
	left:53%;
}
.how-works-stepbox .step_04 {
    top: 120px;
	left:79%;
}
.how-works-stepbox .step_box_txt {
    color: #333;
	font-size:18px;
	line-height:27px;
    font-weight: 700;
    margin-bottom: 4px;
	max-width:300px;
	margin:auto;
}
.step_box_img {
	margin:16px auto;
}
.how-works-stepbox .step_box_cloud {
	position: absolute;
    top: 5%;
	left: 26%;
	width:8%;
}
.how-works-stepbox .step_box_sun {
	position: absolute;
    top: 0;
	left: 80%;
	width:5%;
}



.slider {
	width: 100%;
	max-width:630px;
	margin:auto;
	padding-top:172px;
}
.slick-slide {
   margin: 0  50px;
   width:110px !important;
}
.slick-slide img { 
  width: 100%;
}
.slick-prev:before,
.slick-next:before {
  color: black;
}
.slick-slide {
  transition: all ease-in-out .3s;
  opacity: .3;	 
}    
.slick-active {
  opacity: .5;
}
.slick-current {
  opacity: 1;
  width:130px!important;
   margin: 0  40px;
}
.Tap_texte_content {
	position: relative;
	padding:160px;
    background-color: #ffd018;
}
.Tap_texte_mod{
	margin:auto;
	padding-bottom:80px;
	width:100%;
	max-width:1180px;
}
.Tap_tags_metal {
	min-height: 370px;
	background-image: url(../pet/img/pet-tag.png?v=16);
    background-position: top;
    background-repeat: no-repeat;
    background-size: 218px 370px; 
}
.section-box {
	margin-left:60px;
}
.section-ul {
	display: flex;
    flex-direction: column;
    justify-content: space-between;
	margin-top:30px;
}
.section-li {
    font-size: 20px;
    line-height: 27px;
    margin: 20px 0;
    background: url(../pet/img/pet_circle.svg) no-repeat 0 5px;
    color: #676e8b;
    padding-left: 32px;
}
@media screen and (max-width: 800px) {
		.how-works-container {
			width: 100%;
			padding: 50px 0;
			margin: auto;
			background-image: none; 
		}
		.how-works-box {
			position: relative;
			width:100%;
			max-width: 1300px;
			margin:auto;
		}
		.how-works-stepbox {
			position: relative;
			margin:auto;
			width: 90%;
			height:auto;
		}
		.step-mobile {display:block;}
		.step-pc {display:none;}
		.how-works-stepbox .step_box {
			position: relative;
			text-align: center;
			width:100%;
			height:260px;
			margin-bottom:60px;
		}
		.how-works-stepbox .step_01 {
			top: 0;
			left:0;
		}
		.how-works-stepbox .step_02 {
			top: 0;
			left:0;
		}
		.how-works-stepbox .step_03 {
			top: 0;
			left:0;
		}
		.how-works-stepbox .step_04 {
			top: 0;
			left:0;
		}
		.step_box_img {
			width:180px;
			margin:auto;
		}
		.how-works-stepbox .step_box_cloud {
			position: absolute;
			top: 5%;
			left: 10%;
			width:80px;
			height:60px;
		}
		.how-works-stepbox .step_box_sun {
			position: absolute;
			top: 75%;
			left: 80%;
			width:60px;
			height:60px;
		}
		.shop-product-titlebox {
			padding:80px  80px;
		}
		.shop-h1 {
			font-size:24px;
		}
		.shop-h2 {
			font-size:20px;			
		}
		.shop-h3 {
			font-size:14px;			
		}
		.shop-step-title {
			font-size:14px;
			font-weight:300;
			margin-bottom:12px;	
		}
	.Tapme_sub-title {
		font-size:18px;
	}

}
@media screen and (max-width: 560px) {
		.custom-img-box {
			height:360px;
		}
		.shop-img-wide-content {
			height:800px;
			background-image: url("../img-file/display/pet-lookall03-mobile.png");			
			background-position:center center;
		}
		.select-theme-radius {
			border-radius:18px;
		}
		.sp_margin_pad80 {
			margin-bottom:30px !important;
		}
		.phone-share {
			height: 200px
		}
		.m_font_left { text-align:left;}
		.customer-content {
			margin: 0 auto 0 auto;
			padding: 0 0 60px 0;
		}
		.nfc_basic_company {
			top:42%;
			left:10%;
			font-size: 16px;
		}
		.nfc_basic_youname {
			top:52%;
			left:10%;
			font-size: 12px;
		}

		.nfc_card_company {
			position: absolute;
			top:14%;
			left:8%;
			font-size: 16px;
			 font-weight: 500;
		}
		.nfc_card_youname {
			position: absolute;
			top:25%;
			font-size: 12px;
		}
		.customer-goods-bg {
			max-width:310px; 
		}
}

.shop-gradient-box {
	text-align:center;
}
.shop-text-gradient {	
	font-size:100px;
	font-weight:800;
	text-align:center;
    background-image: var(--gradient);
    color: #0000;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    -webkit-background-clip: text;
    background-clip: text;
}
.shop-bg-padding {
    padding: 100px 0;
}
@media screen and (max-width: 540px) { 
	.shop-text-gradient {	
		font-size:60px;
	}
	.shop-bg-padding {
		padding: 60px 0;
	}
}

.shop-bg-k1010 {
	background-color:#F8F8F8;
}
.shop-bg-k0000 {
	background-color:#000000;
}
.shop-product-content {
	margin:auto;
	max-width:1800px;
	font-size:18px;
}
.menu-title-line {
    display: flex;
    flex-basis: 100%;
    align-items: center;
    margin: 0 0 12px 0;
}
.menu-title-line::before {
    content: "";
    flex-grow: 1;
    margin: 0 16px;
    background: rgba(0,0,0,0.35);
    height: 1px;
    font-size: 0px;
    line-height: 0px;
}
.menu-title-line:after {
    content: "";
    flex-grow: 1;
    margin: 0 16px;
    background: rgba(0,0,0,0.35);
    height: 1px;
    font-size: 0px;
    line-height: 0px;
}
.shop-grid-2box {
    margin: 0 auto;
    max-width: 1800px;
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.shop-grid-3box {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.shop-grid-item {
    position: relative;
	width:90%;
    margin: 40px auto 40px;
    box-sizing: border-box;
	text-align:center;
}
.shop-min-item {
	width:120px;
	margin:auto;
}
.shop-mid-item {
	width:90%;
	max-width:450px;
	margin:auto;
}
.shop-grid-text {
	padding:8px;
}
.Main-kakao-button {
    position: relative;
    color: #000;
    font-size: 18px;
    padding: 18px 30px;
    width: 200px;
    font-weight: 500;
    background-color: #ffcd00;
    border: 2px solid #000;
    margin: 30px auto;
    text-align: center;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    cursor: pointer;
    z-index: 2;
}
@media screen and (max-width: 1200px) {
	#product_design {
		grid-template-columns: 1fr 1fr;	
		width:100%;
	}
}
@media screen and (max-width: 540px) {
	#product_design {
		grid-template-columns: 1fr 1fr;	
		margin-bottom:0px;
	}



	.shop-grid-2box {
		grid-template-columns: 1fr ;

	}
	.shop-grid-3box {
		grid-template-columns: 1fr ;
	}
	.shop-grid-item {
		margin: 20px auto 20px;
		box-sizing: border-box;
		text-align:center;
	}
	.shop-min-item {
		width:120px;
		margin:auto;
	}
}


/* nfc card */

.modal-lg2{
	margin: auto !important;
    width: 100% !important;
    max-width: 980px;
}
.modal.fade .modal-lg2 {
  transform: translate3d(0, 100vh, 0);
}
.modal.in .modal-lg2 {
    transform: translate3d(0, 0, 0);
}
.product-card-prview {
    width:100%;
}


.cd-slider {
	position: relative;
	width: 100%;
	height: 980px;
	/*height: calc(100vw - 0px); */	
	background: transparent;
	overflow: hidden;
}
.item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	list-style: none;
	-webkit-transform: translateX(100%);
	-moz-transform: translateX(100%);
	-ms-transform: translateX(100%);
	-o-transform: translateX(100%);
	transform: translateX(100%);
	-webkit-transition: -webkit-transform 1s ;
	-moz-transition: -moz-transform 1s ;
	-o-transition: -o-transform 1s ;
	transition: transform 1s ;
}
.item-card {
	position: relative;
	margin:auto;
	max-width: 980px;
}
.item-card-msg {
    position: relative;
	padding:18px 0;
}
.item-card-msg .msg-title {
    position: relative;
    line-height: 1.3;
	margin:auto;
    max-width: 600px;
    width: 90%;
	padding:0 0 12px 0;
    word-break: keep-all;
    letter-spacing: -1px;
    font-size: 20px;
    text-align: center;
}
.item-card-msg .msg-sub-p {
    position: relative;
    line-height: 1.3;
	margin:auto;
    max-width: 600px;
    width: 90%;
    letter-spacing: -0.5px;
    font-size: 16px;
    text-align: center;
}
.prev, .next {
	position: absolute;
	top: 50%;
	left: 5%;
	width: 40px;
	height: 40px;
	margin-top: -20px;
}
.next {
	right: 5%;
	left: auto;
}
.hide-nav {
	visibility: hidden;
}
.prev_slide {
	-webkit-transform: translateX(-100%);
	-moz-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%);
}
.current {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
}
@media screen and (max-width: 980px) {
	.cd-slider {
		height: calc(100vw + 1px);
	}
	.item-card-msg, .pet-front-msg {font-size:18px;}
	.prev { left: 5%; }
	.next { right: 5%; }
}


.card-shadow {
 -webkit-box-shadow: 0 12px 12px -8px black;
  -moz-box-shadow: 0 12px 12px -8px black;
  box-shadow: 0 12px 12px -8px black;
}
.Preview-img-radius {
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
}
.Preview-image {
    position: absolute;
	left:0;
	right:0;
	margin:auto;
	bottom:13%;
	width:57%;
	overflow: hidden; 
	/*transform: perspective(2000px) rotateY(6deg ) rotateX(36deg)  rotate(-29deg); */
}
.Preview-image2 {
    position: absolute;
	left:10%;
	bottom:46.5%;
	width:57%;
	overflow: hidden; 
	transform:  rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
.Preview-image2-1 {
    position: absolute;
	right:5%;
	bottom:19%;
	width:57%;
	overflow: hidden; 
	transform:  rotate(-46deg);
	-webkit-transform: rotate(-46deg);
}
.Preview-image3 {
    position: absolute;
    top: 22.5%;
	left:9.5%;
	width:57%;
	height:36.0%;
	transform: rotate( 26deg ); 
}
.Preview-image4 {
    position: absolute;
    top: 8%;
	left:15%;
	width:57%;
	transform: rotate( -40.4deg ); 
}
.Preview-image4-1 {
    position: absolute;
    top: 54%;
	left:57.5%;
	width:57%;
	height:36.0%;
	transform: rotate( -40.5deg );
}
.Preview-image5 {
    position: absolute;
    top: 41.1%;
	left:22.7%;
	width:57%;
	height:36.0%;
}
.nfc_text_company {
    position: absolute;
    top: 43%;
    left: 10%;
    width: 80%;
    text-align: center;
    font-size: 30px; 
	/* font-size: calc(14px + (26 - 14) * ((100vw - 300px) / (980 - 300)));
	font-size: calc(16px + 8 * ((100vw - 320px) / 980));*/
    line-height: 1;
    color: #fff;
    z-index: 999;
    font-family: 'LINESeedKR-Bd';
    font-weight: 700;
    font-style: normal;
}
.nfc_text_youname {
    position: absolute;
    top: 54%;
    left: 10%;
    width: 80%;
    text-align: center;
    font-size: 15px;
    font-weight: 400;
    color: #fff;
    z-index: 999;
    font-family: 'LINESeedKR-Rg';
    font-style: normal;
}
.nfc_text_mobile {
    position: absolute;
    top: 43%;
    left: 10%;
    width: 80%;
    text-align: center;
    font-size: 22px; 
    line-height: 1;
    color: #fff;
    z-index: 999;
    font-family: 'LINESeedKR-Rg';
    font-weight: 400;
    font-style: normal;
}
.nfc_text_mobile2 {
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    z-index: 999;
    font-family: 'LINESeedKR-Rg';
    font-style: normal;
}
.nfc_text_youname2 {
    position: absolute;
    top: 61%;
    left: 10%;
    width: 80%;
    text-align: center;
    font-size: 15px;
    font-weight: 400;
    color: #fff;
    z-index: 999;
    font-family: 'LINESeedKR-Rg';
    font-style: normal;
}
.close-up-btn {
    position: fixed;
    cursor: pointer;
	float:right;
	width:80px;
    top: 20px;
    right:10px;
    font-size: 50px;
    font-weight: 700;
    line-height: 1;
	text-align:center;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=60);
    opacity: .6;
    z-index: 999;
}
@media screen and (max-width: 980px) {
	.nfc_text_company {
		font-size: calc(12px + 16 * ((100vw - 440px) / 540));
	}
	.nfc_text_youname, .nfc_text_youname2 {
		font-size: calc(7px + 5 * ((100vw - 440px) / 540));
	}
	.nfc_text_mobile {
		font-size: calc(9px + 10 * ((100vw - 440px) / 540));
	}
	.nfc_text_mobile2 {
		font-size: calc(7px + 4 * ((100vw - 440px) / 540));
	}

	.Preview-img-radius {
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
	}
}



.bg-black-qrtag   { background-image: url(../img-file/cart-img/qr-tag02.png); }
.bg-blue-qrtag     { background-image: url(../img-file/cart-img/qr-tag03.png);}
.bg-yellow-qrtag  { background-image: url(../img-file/cart-img/qr-tag04.png); }

.templet-h2 {
	font-size: 32px;
    letter-spacing: -0.2px;
    line-height: 1.2;
    font-weight: 600;
    max-width: 900px;
    margin: auto;
    text-align: center;
    word-break: keep-all;
}
.templet-h3 {
	font-size: 21px;
    line-height: 1.4;
    width: 90%;
    max-width: 700px;
    margin: 16px auto 16px;
    text-align: center;
    word-break: keep-all;
}
.templet-h4 {
	font-size: 16px;
    line-height: 1.4;
	margin: 8px 14px;
    word-break: keep-all;
}
.templet-h4-title {
	font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
	margin: 24px 14px 12px 14px;
}
.shop-product-templet {
    margin: auto;
    max-width: 900px;
}
.product-top img {
    vertical-align: middle;
}
.gallery-popup {
   padding: 0 8px;
}
.gallery-popup-ln {
    padding: 0 8px 8px 8px;
    width: 25%;
    float: left;
}
.gallery-popup-bg {
    width: 100%;
    padding-bottom: 70%;
    display: block;
    background-size: cover;
    background-position: center center !important;
    background-repeat: no-repeat;
    overflow: hidden;
}
.product-title-line {
	border-bottom: 1px solid #dedfe0;
    margin-bottom: 20px;
}
.about-fild-txt textarea {
    min-height: 140px;
    margin-bottom: 10px;
    resize: none;
    outline: none;
    width: 100%;
}
.about-fild-txt textarea {
    padding: 9px 6px 9px 15px;
}
.about-fild-txt textarea {
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #6f6f6f;
    font-size: 14px;
    font-family: gotham ssm a,gotham ssm b;
    font-style: normal;
    font-weight: 400;
    padding: 9px 6px 9px 15px;
    outline: none;
}
.nav-select-btn li.active {
	background-color:#006ea5;
	border: 1px solid #006ea5;
	color:#fff;
}
.bg-phone-tag {
    width: 64px;
    height: 64px;
    background-repeat: no-repeat;
    background-size: 50px 50px;
    background-position: 8px 8px;
}
.cc-selector-option {
    width: 82px;
    height: 52px;
    border-radius: 4px;
    overflow: hidden;
    display: inline-block;
    margin: 0 4px 8px 4px;
    font-size: 14px;
	line-height:52px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #006ea5;
}
.logo-msg {
	position: relative;
	margin-top:16px;
	padding:16px 16px;
	display:none;
	border-radius: 10px;
	background-color: #fff;
    border: 1px solid #ddf1f7;
}
.photo-msg {
	position: relative;
	margin-top:16px;
	padding:16px 16px;
	display:block;
	border-radius: 10px;
	background-color: #fff;
}

.li-msg {
	padding:4px 4px;
}
.kakao-f-button {
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
    color: #000;
    font-size: 14px;
	margin-top:16px;
    padding: 8px 12px;
    font-weight: 400;
    background-color: #FFE812 !important;
    border: 1px solid #FFE812;
	border-radius: 10px;
    text-align: center;
    cursor: pointer;
    z-index: 2;
}
.u-kakao-link-icon {
    background-color: #FFE812 !important;
    color: #000000 !important;
    margin-right:12px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    background-position: center center !important;
    background-repeat: no-repeat;
    background-size: 100%;
    background-image: url(../img-file/kakaotalk.svg);
}

.sale-label {
	position: absolute;
	background: #F77B17;
	color: white;
	height: 60px;
	width: 60px;
	text-align: center;
	vertical-align: middle;
	font-size:24px;
	line-height: 60px;
	top: 60px;
	right:60px;
	transform: rotate(-20deg);
	animation: beat 1s ease infinite alternate;
	&:before,
	&:after {
		content:"";
		position: absolute;
		background: inherit;
		height: inherit;
		width: inherit;
		top: 0;
		left: 0;
		z-index: -1;
		transform: rotate(30deg);
	}
	&:after {
		transform: rotate(60deg);
	}
}

@keyframes beat {
	from {	transform: rotate(-20deg) scale(1); }
	to {	transform: rotate(-20deg) scale(1.1); }
}

.mid-content {
	margin:auto;
	margin-bottom:32px;
}
.mid-content img {
	width: 100%
}
.mid-content-line {
	border-bottom: 5px solid #ddd;
}
.sticker-sale {
    text-align: center;
    padding: 7px 10px;
    margin: 0 15px;
    font-size: 14px;
    font-weight: 400;
	width:40px;
    background-color: #39c516;
    color: #fff;
	display: inline;
    border-radius: 0.25em;
}
.about-product-head {
    margin: auto;
    padding: 100px 0;
    text-align: center;
    font-size: 60px;
    font-weight: 500;
    line-height: 1.2;
    width: 90%;
    max-width: 1200px;
    word-break: keep-all;
}
.nfc-cards-content-img {
    margin:auto;   
	max-width:1500px;
	margin-bottom:60px;
}
.nfc-cards-body-img {
    vertical-align: top;
}
.nfc-cards-body {
	max-width:1800px;
    vertical-align: top;
    margin:auto;   
	margin-bottom:120px;
}
.nfc-cards-content-box {
    word-break: keep-all;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
	margin:0 auto;
	max-width:1800px;
}
.nfc-cards-body-itemview {
	width:33.32%;
	margin-bottom:80px;
}
.nfc-card-content.rf-card-content-withfullimg {
    flex-direction: row;
    justify-content: center;
}
.nfc-card-content {
    display: flex;
    flex-direction: column;
    position: relative;
    margin: 0 15px;
    background-color: #fff;
}
.nfc-card-img-ful {
    width: 100%;
	position: relative;
}
.nfc-card-img-ful img {
	vertical-align: middle;
	width: 100%;
    border-radius: 6px;
    white-space: normal;
}
.nfc-card-info-box {
	position: relative;
    padding:0 10%;
	margin-top:-50px;
}
.nfc-card-info-fw {
	color:#fff;
}

.nfc-card-info-box-title {
    line-height: 1.6;
    font-weight: 400;
    margin: 8px auto;
	text-align:center;
}
.nfc-card-info-box-h1 {
    font-size: 32px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: -1px;
    margin-top: 14px;
}
.nfc-card-box-price {
	font-size:14px;
	text-decoration: line-through;
}
.nfc-card-box-sale {
	font-size:18px;
	font-weight: 500;
}
.nfc-card-name {
	font-size:18px;
	font-weight: 300;
}


@media screen and (max-width: 1920px) {
	.matt-header-bg {
		height: 500px;
	}
}
@media screen and (max-width: 1200px) {	
    .about-product-head { 
		font-size:44px;
		padding: 80px 0;
	}

	.nfc-cards-content-box {
		flex-wrap: wrap;
	}
	.nfc-cards-body-itemview {
		width:50%;
		margin-bottom:100px;
	}
}

@media screen and (max-width: 768px) {
	.matt-header-bg {
		height: 350px;
	}
	.how_to_design {
		grid-template-columns: 1fr  ;
	}
	.how_to_design_item {
		margin: 24px auto;
		padding:0;
		max-width:90%;
		box-sizing: border-box;
	}
	.how_to_design_picture {
		margin: 16px auto;
		width:40%;
	}
    .about-product-head { 
		font-size:24px;
		padding: 40px 0;
	}
	.nfc-cards-content-box {
		margin: 0 4px;
	}
	.nfc-card-content {
		border-radius: 8px;
		margin: 0 20px;
	}
	.nfc-cards-body-itemview {
		width:100%;
		margin-bottom:60px;
	}
	.nfc-card-info-box {
		padding: 0;
		margin-top:-50px;
	}
	.nfc-card-info-box-h1 {
		font-size: 13px;
		font-weight: 400;
		letter-spacing: 0;
	}
	.nfc-card-name {
		font-size:16px;
	}
	.nfc-card-box-price {
		font-size:14px;
	}
	.nfc-card-box-sale {
		font-size:18px;
		font-weight: 500;
	}
}