#products { position: relative; margin-bottom: 5vw; }
#products .pro-list { position: relative; }
#products .bankswrap { position: relative; }
#products .bankswrap .list ol { display: grid; grid-template-columns: repeat(5,1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
#products .bankswrap .list ol>li { margin: 0; padding: 0; }
#products .bankswrap .info { position: relative; background: #ffffff; border: 1px solid #f1dfc5; border-radius: 16px; overflow: hidden; transition: .3s ease; }
#products .bankswrap .info:hover { border-color: #ffb52e; }
#products .bankswrap .pic {position: relative;aspect-ratio: 4/3;background-size: cover;background-position: center;background-repeat: no-repeat;overflow: hidden;}
#products .bankswrap li:hover .pic { filter: saturate(30%); }
#products .bankswrap .pic:before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(255,255,255,0) 60%,rgba(41,41,41,.12) 100%); pointer-events: none; }
#products .bankswrap .pic a { position: absolute; inset: 0; display: block; z-index: 2; }
#products .bankswrap .pic img {display: block;width: 100%;height: 100%;object-fit: cover;opacity: 0;}
#products .bankswrap h3 { display: none; }
#products .bankswrap .trime {display: flex;align-items: center;justify-content: space-between;gap: 12px;padding: 13px;border-top: 1px solid #f1dfc5;}
#products .bankswrap .trime>span { color: #777777; font-size: 13px; line-height: 1.4; }
#products .bankswrap .trime p { display: flex; align-items: center; gap: 8px; margin: 0; }
#products .bankswrap .trime p a {
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  aspect-ratio:1;
  transition:.3s ease;
}
#products .bankswrap .trime p a:hover { transform: translateY(-2px); filter: brightness(1.05); }
#products .bankswrap .trime p img { display: block; object-fit: contain; }
#products .bankswrap .trime p a:has(img[style*="display:none"]) { display: none; }
#products-detail { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: 42px; align-items: start; }
#products-detail .sub-pro-img { position: relative; overflow: hidden; border-radius: 18px; background: #fff9ef; }
#products-detail .sub-pro-img .slick-slider { margin: 0; }
#products-detail .sub-pro-img .slick-list { overflow: hidden; }
#products-detail .sub-pro-img .slick-slide p {margin: 0;aspect-ratio: 4/3;background-position: center;background-size: cover;background-repeat: no-repeat;}
#products-detail .sub-pro-img .slick-slide p img {display: block;width: 100%;aspect-ratio: 4/3;object-fit: cover;opacity: 0;border-radius: 15px;}
#products-detail .sub-pro-img .slick-prev,#products-detail .sub-pro-img .slick-next { z-index: 3; width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.92); }
#products-detail .sub-pro-img .slick-prev { left: 16px; }
#products-detail .sub-pro-img .slick-next { right: 16px; }
#products-detail .sub-pro-img .slick-prev:before,#products-detail .sub-pro-img .slick-next:before { color: #ff8a1f; font-size: 22px; opacity: 1; }
#products-detail .sub-pro-img .slick-dots { bottom: 14px; }
#products-detail .sub-pro-img .slick-dots li button:before { color: #ffffff; opacity: .55; font-size: 9px; }
#products-detail .sub-pro-img .slick-dots li.slick-active button:before { color: #ff8a1f; opacity: 1; }
#products-detail .txt-set { position: relative; }
#products-detail .product-txt { position: relative; padding: 8px 0; }
#products-detail .product-txt h2 { margin: 0; font-size: 26px; font-weight: 600; line-height: 1.5; letter-spacing: .02em; }
#products-detail .product-txt h2 span { display: block; margin-bottom: 10px; color: var(--primary); font-size: 13px; font-weight: 600; letter-spacing: .12em; }
#products-detail .connectwithit { margin-top: 26px; padding-top: 22px; border-top: 1px solid #f1dfc5; }
#products-detail .contren { display: flex; align-items: center; gap: 12px; margin: 0; padding: 0; list-style: none; }
#products-detail .contren li { margin: 0; padding: 0; }
#products-detail .contren li a { display: flex; align-items: center; justify-content: center; width: 52px; aspect-ratio: 1; border-radius: 50%; transition: .3s ease; }
#products-detail .contren li a:hover { border-color: #ff8a1f; background: #fff3dc; transform: translateY(-2px); }
#products-detail .contren li img { display: block; width: 26px; aspect-ratio: 1; object-fit: contain; }
#products-detail #gogo { margin-top: 24px; }
#products-detail #gogo p { margin: 0; }
#products-detail #gogo a { display: inline-flex; align-items: center; gap: 10px; padding: 11px 20px; border-radius: 999px; background: linear-gradient(135deg,#ffb52e 0%,#ff8a1f 55%,#ff7417 100%); color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }
#products-detail #gogo b { display: flex; align-items: center; }
#products-detail #gogo svg { width: 15px; height: 15px; }
#products-content { margin-top: 42px; padding-top: 34px; border-top: 1px solid #f1dfc5; }
#products-content #pro-article { position: relative; }
#products-content #tabs_container { position: relative; }
#products-content .tab_content { padding: 28px 30px; background: #fff9ef; border-left: 4px solid #ff8a1f; color: #5f5954; font-size: 15px; line-height: 2; letter-spacing: .02em; }
#gogo {
  /* text-align:center;*/
  margin-top:20px;
}
#gogo p { position: relative; text-align: center; }
#gogo p a {
  /* color:#000000;*/
  display:inline-block;border:1px solid #0c0c0c;border-radius:11px;padding:3px 40px;font-family:'Lusitana',serif;position:relative;z-index:2;transition:transform 1s cubic-bezier(0.08,0.65,0.38,1.08);
}
#gogo p a b { font-weight: 400; margin-right: 10px }
#gogo p { position: relative; overflow: hidden; display: inline-block; border-radius: 11px; }
#gogo p:after { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: #df1027; display: block; z-index: 1; transform: scale(0,1); transform-origin: right center 0; transition: transform 1s cubic-bezier(0.08,0.65,0.38,1.08); }
#gogo p:hover { background-color: #ffdf57; }
#products-detail .product-txt .connectwithit ul { display: flex; align-items: center; margin-top: 10px; }
.contren li { display: flex; margin: 5px; }
.contren .J_QRcode {   }
#products-detail .product-txt .connectwithit ul li a {   }
#products-detail .product-txt .connectwithit ul li img { width: 110px; }
#products-detail .product-txt .contren .J_Linecode img,#products-detail .product-txt .contren .phone-type img { width: 90px; }
#products-detail .product-txt .connectwithit ul li.phone-type a { color: #545454; display: inline-block; line-height: 100%; }
.otherp { margin-top: 50px; }
#tabSp { color: #7d7d7d; font-size: 12pt; line-height: 150%; margin: 50px 0; }
#messageList-reply { margin-top: 40px; }
.message-board section { background: #f8f8f8; margin: 20px 0; overflow: hidden; }
.message-board .info { overflow: hidden; margin: 20px; }
.message-board .info .pic { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; float: left; display: none; }
.message-board .info .pic img { width: 100%; }
.message-board .info .detail {   }
.message-board .info .creditor-detail { margin-top: 15px; }
.message-board .info .creditor-detail h4 { font-size: 13pt; line-height: 110%; }
.message-board .info .creditor-detail h5 { font-size: 12pt; line-height: 110%; font-weight: normal; color: #909090; }
.message-board .info .creditor-detail h4 a { display: inline-block; background: #eacb4e; color: #927b1c; padding: 2px 15px; }
.message-board .info .creditor-detail h4 a:hover { color: #ffffff; }
.message-board .info .creditor-detail h4 a img { vertical-align: middle; margin-right: 12px; width: 40px; margin-top: 5px; line-height: 100%; }
.message-board .info .creditor-detail p { text-align: right; color: #909090; }
.message-board .info .creditor-detail p b { color: #4cac8f; }
@media screen and (max-width:1440px) {
  #products-detail .product-txt .connectwithit ul li a img { width: 70px; }
}
@media screen and (max-width:1280px) {   }
@media screen and (min-width:1025px) {   }
@media screen and (max-width:1024px) {
  #products .bankswrap .list ol { grid-template-columns: repeat(4,1fr); }
}
@media screen and (max-width:768px) {
  #products .bankswrap .list ol {grid-template-columns: repeat(3,1fr);}  #products-detail .sub-pro-img { width: 100%; }
  #products-detail .txt-set { width: 100%; margin-top: 30px; }
  .message-board .info .pic { width: 160px; }
  .message-board .info .creditor-detail { margin: 0; }
  .message-board .info .creditor-detail h4 a img { width: 30px; }
  .message-board .info .creditor-detail h5 { margin: 20px 0 11px; }
}
@media screen and (max-width:640px) {
    #products-content .tab_content{margin: 0;}
    #products-detail{display:block}
    #products .bankswrap .trime{flex-direction: column;align-items: center;gap: 5px;}
  .message-board .info .pic { width: 100px; }
  .message-board .info { margin: 10px; }
    #products .bankswrap .list ol {grid-template-columns: repeat(2,1fr);gap: 5px;}
  .bankswrap .list ol li .info h3 { font-size: 16px; }
  #products-detail .product-txt .connectwithit ul li a img { width: 55px; }
  #messageList-creditor .message-board .info .pic { width: 70px; }
  #messageList-creditor .message-board .info .detail { width: calc(100% - 90px); }
  #messageList-creditor .message-board .info .creditor-detail h4 a { padding: 3px 10px; font-size: 10pt; }
  .message-board .info .creditor-detail h4 a img { width: 25px; vertical-align: middle; margin-top: 0; }
  .message-board .info .creditor-detail p,.message-board .info .creditor-detail h5 { font-size: 10pt; }
    #products .bankswrap .trime>span{font-size: 12px;}
}