
/*----- processing ------*/
.lead{font-size:var(--text); font-weight:600; line-height:1.8;}
.processing-figure{padding:50px 20px; width:90%; display:block; margin:0 auto;}
.process-block{width:100%; max-width:1000px; margin:0 auto 70px;}

.process-column{padding:40px; border-radius:20px; margin-top:25px; display:flex; gap:30px;}
.process-column.column{flex-direction: column;}
.process-column.column .photo{align-items: center; width:100%;}
.process-column.column .photo img{display:block; width:80%; margin:0 auto 20px;}
.process-column.column .text{width:100%;}
.process-column.column .in-block{background:#fff; border-radius:20px; padding:30px; border:var(--border); margin-top:-25px;}
.process-column.column .in-block ul{display:flex; gap:30px;}
.process-column.column .in-block ul li{width:calc((100% - 20px * 2) / 3); justify-content: center;}
.process-column.column .in-block ul li p{text-align:center; font-size: var(--s-text); padding:10px 0;}

.process-column.column .in-block h5{font-size:var(--h5)}


.process-column.type01{background:#fffcf0; border:solid 1px #dfd277;}
.process-column.type01 h4{color:#ac5d01;}
.process-column.type02{background:#f9ffff; border:solid 1px #8ec2d0;}
.process-column.type02 h4{color:#198dac;}
.process-column.type03{background:#fff3f3; border:solid 1px #f9cacb;}
.process-column.type03 h4{color:#cf2348;}
.process-column h4{font-size:var(--h4); font-weight:700; margin-bottom:20px;}
.process-column p{font-size:var(--s-text); font-weight: 600; color:#444; line-height:1.6;}

.process-column.type01 .bottle{width:20%; display:flex;}
.process-column.type01 .bottle img{width:auto; max-width:150px; display:flex; justify-content: center; margin:0 auto;}
.process-column.type01 .text{width:calc(80% - 30px); display:flex; gap:20px; flex-direction: column;}
.process-column.type01 .text h4{margin-bottom:0;}

.btn-wrap + .process-column.type03{margin-top:50px;}

.flow-group{background:#f4f9f2; padding:40px 30px; border-radius:20px;}
.flow-group figure{margin-bottom:40px; margin-top:-20px;}
.flow-group p{font-weight:600; font-size:var(--s-text)}

.process-anchor{margin:70px 0;}
.process-anchor ul{display: flex; column-gap: 30px; flex-wrap: wrap; justify-content: center;}
.process-anchor ul li a{
  padding: 0 0 0 32px;
  text-decoration: none;
  position: relative;
  font-size: var(--text);
  font-weight: 600;
  text-wrap: nowrap;
}
.process-anchor ul li a:before{
  content: "";
  width: 20px;
  height: 20px;
  background: url(/assets/images/_resource/pages/products/common/anchor-grn.png) no-repeat;
  background-size: 20px 20px;
  position: absolute;
  left: 0;
  top: calc(50% - 10px);
}

.section-title.-left{text-align:left; margin-bottom:30px;}
.section-stitle.point{position:relative; margin-bottom:24px; display:flex; gap:12px; align-items: center; font-size:var(--h4);}
.point:before{content:""; display:inline-block; width:16px; height:16px; background:#97c084; border-radius:8px; top:6px;}

.bread_crumble_block + section.sect::before{margin-bottom:40px;}
.in-section{padding-top:20px;}
.in-section + .in-section{margin-top: 70px;}
.in-section + .btn-wrap{margin-top:60px;}

.in-section.process-category + .in-section.process-category{padding-top:60px; margin-top:60px; border-top:dotted 2px #97c084;}

.in-section .section-stitle + p{font-size:var(--text); font-weight:600;}
.in-section .products-list.col2{margin-top:35px;}
.in-section .products-list.col2 .products-item-img{padding:20px;}
.in-section .products-list.col2 .products-item-caption h4{font-weight:700; font-size:var(--text);}
.in-section .products-list.col2 .products-item-caption p{font-size:var(--s-text); line-height:1.6; font-weight:500;}

.in-section.inquiry h3 + h4{margin-top:-35px; margin-bottom:35px; font-size:var(--h4)}

@media (max-width:1080px){
  .section-stitle.point{gap:8px; }
  .point:before{width:12px; height:12px;}
}


@media (max-width:960px){
  .lead{font-size:var(--text);}
  .processing-figure{padding:50px 10px; width:100%; display:block; margin:0 auto;}
  .process-block{width:100%; max-width:1000px; margin:0 auto 50px;}
  .process-column{padding:30px; border-radius:20px; margin-top:25px; display:flex; gap:30px;}
  .process-column.column .photo img{display:block; width:90%; margin:0 auto 20px;}
  .process-column.column .photo + .btn-wrap{margin:-10px 0 20px}
  .process-column{padding:25px; gap:30px;}
  .process-column.type01 .bottle{width:20%; display:flex; align-items: center;}
  .process-column.type01 .bottle img{min-width:auto; max-width:100%;}
  .process-column.type01 .text{width:calc(80% - 30px); display:flex; gap:20px; flex-direction: column;}
  .process-column.type01 .text h4{margin-bottom:0;}

  .process-anchor{margin:50px 0 30px;}
}

@media (max-width:768px){
  .section-stitle.point{gap:8px; }
  .point:before{width:8px; height:8px;}

  .process-column.column .in-block{padding:25px 30px; margin-top:-25px;}
  .process-column.column .in-block ul{display:flex; gap:20px; flex-wrap:wrap;}
  .process-column.column .in-block ul li{width:calc((100% - 20px * 1) / 2); justify-content: center;}

  .process-column.column .photo img{display:block; width:100%; margin:0 auto 20px;}
}

@media (max-width:576px){
  .process-column{padding:20px;}
  .process-column.column .in-block{padding:20px; margin-top:-25px;}
  .process-column.column .photo img{display:block; width:100%; margin:0 auto 20px;}
}