ul {
    padding: 0;
    list-style-type: none;

 }
 ul:after {
    content: '';
    display: block;
    clear: both;
 }
 
 .main_2{height:var(--card-h, 678px);max-height:800px;width:100%;overflow:hidden;position:relative}

  .left{ position:absolute; top:50%; left:20px; margin-top:-58px;  opacity: 0.5; filter: alpha(opacity=50);}
  .right{ position:absolute; top:50%; right:20px;margin-top:-58px; opacity: 0.5; filter: alpha(opacity=50);}

  
	.dot{position:absolute;bottom:0px; padding:4px}

	
.cover{transition: 0.4s;display:none}
 .divimg{height:var(--card-h, 678px); background-color:#fff; float:left; text-align:center;}
 .divimg:after{clear:both}
 .img{max-width:100%;max-height:100%;}



i {
  border: solid black;
  border-width: 0 5px 5px 0;
  display: inline-block;
  padding: 12px;
}

.right {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  padding:12px;
  cursor:pointer;
}

.left {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  padding:12px;
  cursor:pointer;
}

.circle {
  height: 12px;
  width: 12px;
  background-color: black;
  border-radius: 50%;
  display: inline-block;
	margin-right:4px;
	cursor:pointer;
}
.i360{position:absolute;top:30px;left:0px;width:100%;text-align:center}
.i360 img{width:100%}



.content,.touchArea{height:var(--card-h, 678px);max-height:600px}
.content{	
	width: 100%;
	margin:auto;
	overflow:hidden;
	position:relative;
	background-color:white;
	text-align:center}

	   
.loading{width:100%; height:300px; background:url(img/loading.gif) no-repeat center center;}

.touchArea{ 
	width: 100%; 

     -moz-user-select: none;
  -webkit-user-select: none;
      -ms-user-select: none;
          user-select: none;
    -webkit-user-drag: none;
            user-drag: none;
-webkit-touch-callout: none; 	


	cursor:e-resize;
	display:none;
	position:relative;

	}
	
.touchArea img{
   display: none;
   z-index:100;


	
     -moz-user-select: none;
  -webkit-user-select: none;
      -ms-user-select: none;
          user-select: none;
    -webkit-user-drag: none;
            user-drag: none;
-webkit-touch-callout: none; 
width:524px;height:678px;

}

p.contact {margin-top:60px}
p.contact a{
	color:white;
	
}
p.contact a:link {
	color:white;	
	text-decoration: none;
}

p.contact a:visited {
	color:white;	
	text-decoration: none;
}

p.contact a:hover {
	color:white;	
	text-decoration: none;
}

p.contact a:active {
  text-decoration: none;
}
 .tel{background-color:#0F6176} 
  .line{background-color:#0C641E;}
  
 .line,.tel{padding:10px;margin:6px 20px 6px 0;height:172px;width:210px;    text-align:center;
float:left;cursor:pointer;color:white;border-radius:4px;font-size:1.2em;
}
 p.contact:after{content:'';
    display:block;
    clear: both;}
	
.grid-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 24px;
	padding: 0;
	list-style: none;
}
.grid { position: relative; margin-bottom: 0; }
.grid picture,.grid a{display:block; }

.grid img{
	width: 100%;
	aspect-ratio: 240 / 311;
	object-fit: cover;
	object-position: center;
	display: block;
}


.sample{margin:60px 0 60px 0;}
.sample:after{content:'';
    display:block;
    clear: both;}
.sample a{color:#fff;position:relative;font-style: italic;}
.sample a:hover{text-decoration: none;}
.sample span{ background-color:rgba(0,0,0,0.3);padding:10px 15px;position:absolute;right:0px;transition: all .3s ease-in-out}
.collar,.sleeve{width:450px;height:200px;font-size:2em;padding:10px;}

.collar{float:left;}
.sleeve{float:right;}
.collar:hover span,.sleeve:hover span{padding:20px;}



.men,.women{float:left; width:50%;padding:100px 0 40px 0;margin-bottom:20px}

.men{text-align:left; 
	background-repeat: no-repeat;
	background-position: top right;
}
.women{text-align:right;
	background-repeat: no-repeat;
	background-position: top left;
}

.size{margin:60px 0 60px 0;}
 .size:after{}
	

.size table {
  border-collapse: collapse;

}

.size table, .size td,  .size th {
  border: 2px solid white;
}
.size th,.size td {text-align:center;padding:6px 10px;}
.size th{background-color:orange;color:white}
.size td{background-color:#eee;}
.a-fabric{padding:6px 12px;border:1px #ccc solid;margin:20px auto 0 auto;width:220px;display:block;clear:both}



 .share{margin:0 auto 40px auto;width:260px;}
 .share:after {
    content: '';
    display: block;
    clear: both;
 }
.share a{
	color:white;font-family: Kanit-Regular, Verdana, Geneva, sans-serif;
	
}
.share a:link {
	color:white;	
	text-decoration: none;
}

.share a:visited {
	color:white;	
	text-decoration: none;
}

.share a:hover {
	color:white;	
	text-decoration: none;
}

.share a:active {
  text-decoration: none;
}
.share .shareline{background:url('/img/square-default.png') no-repeat left;background-color:#00b900;}  
.share .messenger{background:url('/img/messenger.png') no-repeat left;background-color:#0084ff;}  

.share .shareline,.share .messenger{padding-left:56px;height:46px;width:130px;  display: flex; align-items:center;justify-content: center
cursor:pointer;font-size:1.2em;float:left;

}




table, td, th {  
  border: 1px solid #ddd;
  text-align: center;

}
td:nth-child(1), th:nth-child(1) {  

  text-align: left;
}

table {
  border-collapse: collapse;

  margin:0;

}
th{
  background-color: #04AA6D;
  color: white;}
th, td {
  width:60px
}
	
td:nth-child(1){width:120px}





.property img{width:100%;margin:auto;display:block}
@media (min-width: 1200px) {
.property img{width:50%}


.grid-list { grid-template-columns: repeat(4, 1fr); gap: 32px; }

}

@media (min-width: 768px) and (max-width: 1199px) {
	.grid-list { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width:767px){
	.grid-list { grid-template-columns: repeat(2, 1fr); gap: 12px; }

	.collar,.sleeve{float:left;width:100%}
	.men,.women{ width:100%;}
}

@media (max-width: 480px) { 
	.line,.tel{margin:12px auto;width:70%;}
	 h1{font-size:1.2em}
	.content,.main_2{
		height:466px;

	}
	
	.left,.right{display:none}

	
		.scale img{width:100%}	
		.scale{ font-size:0.8em}
	
	.collar,.sleeve{float:left;width:100%}
	.men,.women{ width:100%;}

	.divimg img{

		width:360px;height:466px;

	}
video {

        height:466px;

    }
	
}
@media print {
	nav,ul{display:none}
	.main{padding:0}
}
ul.breadcrumb {
  margin-top:0px;
  padding: 10px 16px;
  list-style: none;
  background-color: #eee;
}
ul.breadcrumb li {
  display: inline;
  font-size: 1em;
}
ul.breadcrumb li+li:before {
  padding: 8px;
  color: black;
  content: "/\00a0";
}
ul.breadcrumb li a {
  color: orange;
  text-decoration: none;
}
ul.breadcrumb li a:hover {
  color: #01447e;
  text-decoration: underline;
}
.title {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2; 
}


.blink_me {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}