@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(300px, calc( 700 / var(--inner) * 100vw ), 700px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(300px, calc( 700 / var(--inner) * 100vw ), 700px) !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"강원특별자치도 춘천시 퇴계공단2길 71"; font-size:12px; line-height:15px;}

.bullet-item .bullet-list {position:relative; padding-left:15px; margin-top:8px; line-height:1.3;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:3px; height: 3px; background:var(--color-primary); border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0;}
.bullet-item .bullet-list.none::before {display: none;}

.bg-gray {background:#fafafa;}
.bg-red {background: #f9ecea;}
.subsec-pd {padding: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px) 0;}


.cont-wrap + .cont-wrap {margin-top: clamp(50px, calc( 85 / var(--inner) * 100vw ), 85px);}

.greet-wrap {padding:  clamp(30px, calc( 70 / var(--inner) * 100vw ), 70px) 0  clamp(40px, calc( 170 / var(--inner) * 100vw ), 170px);}
.greet-wrap .flxWrap {flex-direction: row-reverse;}
.greet-wrap .imgbx {flex: 1 0 800px; max-width: 800px; margin-left:  clamp(20px, calc( 140 / var(--inner) * 100vw ), 140px);}
.greet-wrap .textbx {flex: 1 0 auto; width: 1%; padding-top:  clamp(35px, calc( 70 / var(--inner) * 100vw ), 70px); background: url(../images/sub/greet-logo.jpg) no-repeat left top; background-size:  clamp(140px, calc( 227 / var(--inner) * 100vw ), 227px) auto;}
.greet-wrap .tit {font-size:  clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold; font-family: var(--font-gmarket);  }
.greet-wrap .decbx {margin-top:  clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.greet-wrap .dec + .dec {margin-top:  clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px);}
.greet-wrap .dec {color: #555; line-height:1.6;}
.greet-wrap .signbx {display: flex; align-items: flex-end; justify-content: flex-end; margin-top: 20px;}
.greet-wrap .signbx .name {font-weight: bold; margin-right: 10px; line-height: 1;}
.greet-wrap .signbx .sign img {width:  clamp(70px, calc( 106 / var(--inner) * 100vw ), 106px);}


.location-area .in {position:relative; }
.location-area .map {max-width:clamp(650px, calc( 800 / var(--inner) * 100vw ), 800px); box-shadow:0 0 24px rgba(0,0,0,0.40); border-radius:16px; background:#fff; z-index:2; overflow: hidden;}
.company-info {position: absolute; right: 0; top:  clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px); width: clamp(800px, calc( 990 / var(--inner) * 100vw ), 990px); height:  clamp(450px, calc( 640 / var(--inner) * 100vw ), 640px); border-radius:0 0 40px 40px; overflow: hidden;  color:#fff; z-index:1;}
.company-info .info-title {display:block; margin-bottom: clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px); padding-top: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); position: relative;  font-size: clamp(11px, calc( 13 / var(--inner) * 100vw ), 13px); font-weight:800; letter-spacing:0.2em; color:#555; text-align:right;}
.company-info .info-title:after {position: absolute; content: ''; top: 0; right:0; width: 60px; height: 4px; background:var(--color-primary);}
.company-info .info-list {padding: clamp(60px, calc( 130 / var(--inner) * 100vw ), 130px) 0 0 45%; background:url(../images/sub/loca-bg.jpg) no-repeat center center /cover;  height: 100%;}
.company-info .info-item {display:flex; align-items: center; gap:20px; margin-bottom: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);}
.company-info .info-item:last-child {margin-bottom:0;}
.company-info .icon { width: clamp(40px, calc( 60 / var(--inner) * 100vw ), 60px); height: clamp(40px, calc( 60 / var(--inner) * 100vw ), 60px);  border-radius:10px;  }
.company-info strong {display:block;  font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight:800; color:#fff;}
.company-info p {margin-top: 7px; word-break:break-all;}

.history-bnr {margin-bottom: clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px); height: clamp(140px, calc( 200 / var(--inner) * 100vw ), 200px); padding:clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc( 50 / var(--inner) * 100vw ), 50px); display: flex; align-items: flex-end; background:url('../images/sub/history-bnr.jpg') no-repeat 50% 50% / cover;}
.history-bnr h2 {font-size: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight: 800; letter-spacing: -.03em; line-height: 1em; color:var(--color-primary);}

.history .item {display:flex;}
.history .item .yearbx {padding-right: clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px); margin-top: -8px;  width:50%;  text-align: right;}
.history .item h3 {display: inline-block;  padding-left: clamp(25px, calc( 40 / var(--inner) * 100vw ), 40px); position: relative; font-size: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight: 800; letter-spacing: -.03em; line-height: 1.4em; color: var(--color-primary); line-height:1em; }
.history .item h3:after {position: absolute; content: ''; left: 0; top: 50%; transform: translateY(-50%); width: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); height: 4px; background:#000; z-index:-1;}
.history .list {flex:1 1 auto;  width:1%; padding:0 0 45px clamp(30px, calc( 45 / var(--inner) * 100vw ), 45px); position:relative;}
.history .list:before {position:absolute; content:""; background:#fff; margin-left:-8px; top:0; left:0; width:16px; height:16px; border-radius:100%; border:4px solid var(--color-primary);}
.history .list:after {position:absolute; content:""; left:0; top:0; width:1px; height:100%; background:#ddd; z-index:-1;}
.history .list li {margin-bottom:6px; display:flex; line-height:1.4em; color: #454545;}
.history .list li:last-child {margin-bottom:0;}
.history .item:last-child .list {padding-bottom:0;} 
.history .item:last-child .list:after {display:none;}

@media (max-width: 640px) {
	.history .item {border:0; display:block;}
	.history .item .yearbx {margin-bottom: 15px; padding-right: 0; width: 100%; text-align: left;}
    .history .item h3:after {display: none;}
	.history .list { width:100%; padding-left:25px;}
	.history .list:after {display:none;}
	.history .list:before {width:14px; height:14px; top:-36px; margin-left:0; border-width: 4px;}
}

.org-wrap {margin-bottom:clamp(50px, calc( 260 / var(--inner) * 100vw ), 260px);}

.cert-tit {margin-bottom:clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px); font-size: clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold; color:var(--color-primary);}
.cert-list {display: flex; flex-wrap: wrap; margin: -10px;}
.cert-item {flex: 1 0 20%; max-width: 20%; padding:10px;}
.cert-item img {width: 100%;}

.imgtextwrap {display: flex; align-items: center; justify-content: center; margin-bottom: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px); padding:clamp(50px, calc( 90 / var(--inner) * 100vw ), 90px) clamp(20px, calc( 60 / var(--inner) * 100vw ), 60px); color: #fff; min-height: clamp(290px, calc( 320 / var(--inner) * 100vw ), 320px); text-align: center;}
.imgtextwrap .tit {font-size: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold;}
.imgtextwrap .desc {margin-top: 20px; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); line-height: 1.6;}
.imgtextwrap.bg1 {background: url(../images/sub/prd1-bg1.jpg) no-repeat center center / cover;}
.imgtextwrap.bg2 {background: url(../images/sub/prd1-bg2.jpg) no-repeat center center / cover;}
.imgtextwrap.bg3 {background: url(../images/sub/prd1-bg3.jpg) no-repeat center center / cover;}
.imgtextwrap.bg4 {background: url(../images/sub/prd2-bg1.jpg) no-repeat center center / cover;}

.imgtextwrap.height {min-height: clamp(250px, calc( 480 / var(--inner) * 100vw ), 480px);}
.imgtextwrap.type2 {padding: clamp(40px, calc( 90 / var(--inner) * 100vw ), 90px) clamp(20px, calc( 85 / var(--inner) * 100vw ), 85px); align-items: flex-start; justify-content: flex-start;  background: url(../images/sub/serv1-bg.jpg) no-repeat center center / cover; text-align: left;}
.imgtextwrap.type2 .tit {font-size:clamp(22px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: 800;}
.imgtextwrap.type2 .desc {font-size:clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: 600; line-height: 1.2;}

.imgtextwrap.type3 {justify-content: flex-end; padding: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px); background: url(../images/sub/serv2-bg.jpg) no-repeat right 20% center / cover; text-align: right; color: #333;}
.imgtextwrap.type3 .tit {display: inline-block; padding-left: clamp(20px, calc( 25 / var(--inner) * 100vw ), 25px); position: relative; z-index: 1;}
.imgtextwrap.type3 .tit:after {position: absolute; content: ''; left: 0; top: 50%; transform: translateY(-50%); width: clamp(30px, calc( 53 / var(--inner) * 100vw ), 53px); height: clamp(28px, calc( 51 / var(--inner) * 100vw ), 51px); background: url(../images/sub/serv2-logo.png) no-repeat left center / contain; z-index: -1;}

.subsecbox {margin-bottom: clamp(25px, calc( 40 / var(--inner) * 100vw ), 40px); text-align: center;}
.subsecbox .subsectit {font-size: clamp(22px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold;}
.subsecbox .subsecdec {margin-top: 14px; font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); line-height: 1.6;}

.circleflxwrap {max-width: 1120px; width: 100%; margin: 0 auto;}
.circleflxwrap .flxWrap + .flxWrap {margin-top: clamp(40px, calc( 60 / var(--inner) * 100vw ), 60px);}
.circleflxwrap .flxWrap {flex-direction: row-reverse; align-items: center;}
.circleflxwrap .imgbx {flex: 1 0 400px; max-width: 400px; margin-left: clamp(20px, calc( 90 / var(--inner) * 100vw ), 90px);}
.circleflxwrap .textbx {flex: 1 0 auto; width: 1%; letter-spacing: -0.5px;}
.circleflxwrap .textbx .tit {font-size: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: bold;}
.circleflxwrap .textbx .subtit {padding-top: 10px; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; }
.circleflxwrap .textbx .desc {margin-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); color: #555; line-height: 1.75;}
.circleflxwrap .flxWrap:nth-child(even) {flex-direction: row;}
.circleflxwrap .flxWrap:nth-child(even) .imgbx {margin-left: 0; margin-right: clamp(20px, calc( 90 / var(--inner) * 100vw ), 90px);}
.circleflxwrap .flxWrap:nth-child(even) .textbx {text-align: right;}

.quality-list {display: flex;flex-wrap: wrap;}
.quality-list.wid-half {margin-left: 320px;}
.quality-list.wid-half .quality-item {width: 54%;}
.quality-item {display: flex; align-items: center;}
.quality-item.type1 {flex: 1 0 46%; max-width: 45.8%;}
.quality-item.type2 {flex: 1 0 auto; width: 1%; }
.quality-item .bg-gray {background: #f8f8f8;}
.quality-item.type1 .imgbx {flex: 1 0 320px; max-width: 320px;}
.quality-item.type2 .imgbx {flex: 1 0 440px; max-width: 440px;}
.quality-item .textbx {flex: 1 0 auto; width: 1%; padding: 20px; text-align: center;}
.quality-item .desc {font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); line-height: 1.7;}

.tbltextbx {margin-bottom: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px);}
.tbltextbx .tbltxt-item {display: flex; color: #555; line-height: 1.85;}
.tbltextbx .tbltxt-item .txt {flex: 1 0 auto; width: 1%;}
.tblbx + .tblbx {margin-top: clamp(25px, calc( 40 / var(--inner) * 100vw ), 40px);}

.tbl-anodizing { background: #faf7f6; border: 1px solid #e2e2e2;}
.tbl-anodizing-head {background: var(--color-primary); color: #fff; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; text-align: center; padding: clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px) 0; letter-spacing: 0.02em;}
.tbl-anodizing-row {display: flex; border-bottom: 1px solid #e2e2e2; background: #fff;}
.tbl-anodizing-cell {flex: 1 1 33.33%; display: flex; flex-direction: column; align-items: center; justify-content: flex-start;  border-right: 1px solid #e2e2e2; background: #fff;}
.tbl-anodizing-cell:last-child {border-right: none;}
.tbl-anodizing-title {display: block; padding:clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px) 0; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; color: #444; text-align: center; background: #fafafa; border-bottom: 1px solid #ddd; width: 100%; }
.tbl-anodizing-img {display: flex; align-items: center; justify-content: center; min-height: 260px; width: 100%;}
.tbl-anodizing-img img {max-width: 160px; object-fit: scale-down;}
.tbl-anodizing-wrap .imgtext {padding: 20px 5px; line-height: 1.475; color: #555; text-align: center;}
.tbl-anodizing-wrap {width: 100%;}
.tbl-anodizing-img + .tbl-anodizing-img {border-top: 1px solid #ddd;}
@media (max-width: 900px) {
  .tbl-anodizing-row {flex-direction: column;}
  .tbl-anodizing-row.type2 {flex-wrap: wrap; flex-direction: row;}
  .tbl-anodizing-row.type2 .tbl-anodizing-cell {flex: 1 0 50%; max-width: 50%;}
  .tbl-anodizing-row .tbl-anodizing-cell.wid-100 {flex: 1 0 100%; max-width: 100%;}
  .tbl-anodizing-cell {border-right: none; border-bottom: 1px solid #e2e2e2; }
  .tbl-anodizing-cell:last-child {border-bottom: none;}
}

.strength-wrap .flxWrap {align-items: center;}
.strength-wrap .imgbx {flex: 1 0 700px; max-width: 700px;}
.strength-wrap .textbx {flex: 1 0 auto; width: 1%; padding-left: clamp(15px, calc( 90 / var(--inner) * 100vw ), 90px);}
.strength-wrap .textbx .point {display: block; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: bold; color:var(--color-primary);line-height: 1.6;}
.strength-wrap .textbx .tit {padding-top: 2px; font-size: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: bold;}
.strength-wrap .textbx .desc {margin-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: #555; line-height: 1.6;}
.strength-wrap .flxWrap:nth-child(even) {flex-direction: row-reverse;}
.strength-wrap .flxWrap:nth-child(even) .textbx {padding-left: 0; padding-right: clamp(15px, calc( 90 / var(--inner) * 100vw ), 90px); text-align: right;}

.tps-toptext {margin-bottom: clamp(35px, calc( 90 / var(--inner) * 100vw ), 90px); text-align: center;}
.tps-toptext .tps-tit {font-size: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold; color:var(--color-primary);}
.tps-toptext .desc {margin-top: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); line-height: 1.4;}
.tps-toptext.type2 {margin-bottom: clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px);}

.tps-top .flxWrap {align-items: center; padding:clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px) 20px clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px) 0 ; background: #f8f8f8 url(../images/sub/prd4-logo.png) no-repeat right clamp(10px, calc( 50 / var(--inner) * 100vw ), 50px) bottom clamp(10px, calc( 50 / var(--inner) * 100vw ), 50px); background-size: clamp(120px, calc( 197 / var(--inner) * 100vw ), 197px) auto; border-radius: 0 clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px) 0 clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);}
.tps-top .flxWrap .imgbx {flex: 1 0 50%; max-width: 50%; position: relative; margin-top: -90px;}
.tps-top .flxWrap .textbx {flex: 1 0 auto; width: 1%; padding-left: clamp(15px, calc( 50 / var(--inner) * 100vw ), 50px); line-height: 1.5;}
.tps-top .textbx .tit {font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: 600;}
.tps-top .textbx .line {display: inline-block; position: relative;}
.tps-top .textbx .line:after {position: absolute; content: ''; left: 0; bottom: clamp(3px, calc( 5 / var(--inner) * 100vw ), 5px); width: 100%; height: 5px; background:rgba(175,62,48,0.3); }
.tps-top .textbx .decbx {padding-top: clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px);}
.tps-top .textbx .dec {color: #555555;}
.tps-top .textbx .dec + .dec {padding-top: 10px;}

.reason-list {display: flex; flex-wrap: wrap; margin:-12px;}
.reason-item {flex: 1 0 33.33%; max-width: 33.33%; padding:12px;}
.reason-item .inner {background: #fff; border-radius: 8px; padding:  clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px)  clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); min-height:  clamp(260px, calc( 345 / var(--inner) * 100vw ), 345px); height: 100%;}
.reason-item .topbx {display: flex; align-items: center; gap:  clamp(12px, calc( 30 / var(--inner) * 100vw ), 30px); margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #ddd;}
.reason-item .icn {flex: 1 0  clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px); max-width:  clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px); }
.reason-item .numbx {flex: 1 0 auto; width: 1%;}
.reason-item .numbx .num {display: block; font-weight: 600; color:var(--color-primary);}
.reason-item .numbx .num + .tit {padding-top: 5px; }
.reason-item .numbx .tit {font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: 600;}
.reason-item .bottombx { color: #555; line-height: 1.5; letter-spacing: -0.5px;}

.tps-toptext + .reason-list {padding-top: clamp(35px, calc( 70 / var(--inner) * 100vw ), 70px);} 
.reason-list.type2 .inner {border: 1px solid #ddd; min-height: auto;}
.reason-list.type2 .bottombx {padding: clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px) 0; text-align: center; font-size: clamp(18px, calc( 26 / var(--inner) * 100vw ), 26px); font-weight: bold;}
.reason-list.type2 .bottombx .font {padding: 0 clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); font-family: var(--font-gmarket);}

.imgbdr-list {display: flex;flex-wrap: wrap; margin: -20px;}
.imgbdr-item {flex: 1 0 50%; max-width: 50%; padding: 20px;}
.imgbdr-item .inner {padding:20px 18px; border: 1px solid #ddd; border-radius: 8px; height: 100%;}
.imgbdr-item .image {text-align: center;}
.imgbdr-item .bdrtit {margin-bottom: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); padding-left:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); position: relative; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold;}
.imgbdr-item .bdrtit:after {position: absolute; content: ''; left: 0; top: 50%; transform: translateY(-50%); width: clamp(4px, calc( 8 / var(--inner) * 100vw ), 8px); height: clamp(4px, calc( 8 / var(--inner) * 100vw ), 8px); border-radius: 50%; background:var(--color-primary);}
.imgbdr-item .textbx {padding-top: 15px; line-height: 1.5; color: #555;}

.schedule-list {display: flex; flex-wrap: wrap; margin:-12px; padding-top: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);} 
.schedule-item {flex: 1 0 20%; max-width: 20%; padding: 12px;}
.schedule-item .inner {border-radius: 16px; overflow: hidden; height: 100%; text-align: center; background: #fff;}
.schedule-item .topbx {padding:clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px) 5px; background: var(--color-primary); color: #fff; font-size: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold;}
.schedule-item .bottombx {display: flex; align-items: center; justify-content: center; padding:20px; background: #fff; height: clamp(80px, calc( 120 / var(--inner) * 100vw ), 120px); color: #555;}

.installmidwrap + .installmidwrap {margin-top: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);}
.installmidwrap .tit { font-size: clamp(19px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold; color:var(--color-primary);}
.installmidwrap .tit + .desc {margin-top: 14px;}
.installmidwrap .desc {font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); line-height:1.36;}
.installmidwrap .bullet-item {padding:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px) 0 clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}

.midflxwrap {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding-top:clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px); overflow: hidden;}
.midflxwrap .circlebx {flex: 1 0 auto; width: 1%;}
.midflxwrap .circle-list {display: flex; flex-wrap: wrap; margin:-12px;}
.midflxwrap .circle-item {flex: 1 0 33.33%; max-width: 33.33%; padding: 12px;}
.circle-item .inner {display: flex; align-items: center; justify-content: center; margin: 0 auto; padding: 15px; background: #000; background-repeat: no-repeat; background-size:clamp(60px, calc( 120 / var(--inner) * 100vw ), 120px) auto; background-position:center center; width: clamp(200px, calc( 220 / var(--inner) * 100vw ), 220px); height: clamp(200px, calc( 220 / var(--inner) * 100vw ), 220px); border-radius: 50%; color: #fff; text-align: center; line-height: 1.5;}
.circle-item .inner.icn1 {background-image: url(../images/sub/serv1-icn1.png);}
.circle-item .inner.icn2 {background-image: url(../images/sub/serv1-icn2.png);}
.circle-item .inner.icn3 {background-image: url(../images/sub/serv1-icn3.png);}
.midflxwrap .imgbx {flex: 1 0 35%; max-width: 35%;}

.installmidwrap.border {padding: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px) clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); border: 1px solid #ddd; background: url(../images/sub/serv1-icn4.png) no-repeat bottom -12px right clamp(10px, calc( 50 / var(--inner) * 100vw ), 50px) / contain; background-size: clamp(200px, calc( 470 / var(--inner) * 100vw ), 470px) auto;}
.installmidwrap.border .inner {padding-right: 32%;}
.installmidwrap.border .bullet-list {font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}

.brpflxwrap {display: flex; flex-wrap: wrap; margin:-35px; overflow: hidden;}
.brpflxwrap .combox {flex: 1 0 50%; max-width: 50%; padding: 35px;}
.brpflxwrap .inner {border-radius: 8px;  box-shadow: 3px 0 30px  rgba(0,0,0,0.08); height: 100%; background: #fafafa;}
.brpflxwrap img {width: 100%;}
.brpflxwrap .textbx {padding: clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px); font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); line-height:1.6; color: #555;}

.faqbgwrap {margin-top: clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px); padding: clamp(15px, calc( 55 / var(--inner) * 100vw ), 55px); background: url(../images/sub/faq-bg.jpg) no-repeat 50% 50%/cover; }
.faqbgwrap .flxWrap {margin: -40px;}
.faqbgwrap .commpd {flex: 1 0 50%; max-width: 50%; padding: 40px;}
.faqbgwrap .leftbx .inner {padding: clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px) clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); background: rgba(0,0,0,0.5); color: #fff;}
.faqbgwrap .tit {margin-bottom: clamp(20px, calc( 43 / var(--inner) * 100vw ), 43px); font-size: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold;}
.faqbgwrap .intextbx + .intextbx {padding-top:14px;}
.faqbgwrap .intextbx .intit {font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold; color: var(--color-primary);}
.faqbgwrap .intextbx .text {padding-top:8px; line-height: 1.5;}
.faqbgwrap .ininner {display: flex; justify-content: space-between; flex-wrap: wrap; margin-top:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) 15px; background: #000;}
.faqbgwrap .ininner .inbox {flex: 1  0 50%; max-width: 50%; padding:0 10px; position: relative;}
.faqbgwrap .ininner .inbox:not(:last-child):after {position: absolute; content: ''; right:10px; top: 0; width: 1px; height: clamp(100px, calc( 200 / var(--inner) * 100vw ), 200px); background: #555555;}
.faqbgwrap .inboxtit {margin-bottom: clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px); font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold;}
.faqbgwrap .bullet-list:before {background: #fff;}
.faqbgwrap .ininner .image {margin-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); text-align: center;}
.faqbgwrap .ininner .image img {width:clamp(60px, calc( 100 / var(--inner) * 100vw ), 100px);}

.max-wid1020 {max-width: 1020px; width: 100%; margin:0 auto;}
.check-list {display: flex; flex-wrap: wrap; margin:-7px; padding-top: clamp(16px, calc( 30 / var(--inner) * 100vw ), 30px);}
.check-item {flex: 1 0 33.33%; max-width: 33.33%; padding: 7px;}
.check-item .inner {display: flex; align-items: center; padding:clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px); border: 1px solid #ddd; height: 100%;}
.check-item .icn {width: clamp(22px, calc( 31 / var(--inner) * 100vw ), 31px); margin-right:clamp(10px, calc( 18 / var(--inner) * 100vw ), 18px);}
.check-item .text {flex: 1 0 auto; width: 1%; font-weight: 500; text-align: left;letter-spacing: -0.5px;}
.check-bottom {margin-top:clamp(15px, calc( 32 / var(--inner) * 100vw ), 32px); font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: bold;}

.inquiry-wrap .btn-pack.large {min-width: clamp(120px, calc( 200 / var(--inner) * 100vw ), 200px); height: clamp(45px, calc( 60 / var(--inner) * 100vw ), 60px); line-height: clamp(43px, calc( 58 / var(--inner) * 100vw ), 58px); border-radius: 8px; font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px);}

.part-list {display: flex; flex-wrap: wrap; margin:-20px;}
.part-item {flex: 1 0 50%; max-width: 50%; padding: 20px;}
.part-item .inner {padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc( 35 / var(--inner) * 100vw ), 35px); border: 1px solid #ddd; border-radius: 8px; height: 100%;}
.part-item .part-tit {padding-left:clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px); font-size: clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold; background:url(../images/sub/check.png) no-repeat left center; background-size: clamp(16px, calc( 31 / var(--inner) * 100vw ), 31px) auto;} 
.checkbullet-list {padding-left: clamp(16px, calc( 31 / var(--inner) * 100vw ), 31px); padding-top: clamp(20px, calc( 38 / var(--inner) * 100vw ), 38px);}
.checkbullet-item {padding-left: clamp(22px, calc( 26 / var(--inner) * 100vw ), 26px); font-weight: 500; background:url(../images/sub/check2.png) no-repeat left center; background-size: clamp(12px, calc( 15 / var(--inner) * 100vw ), 15px) auto;}
.checkbullet-item + .checkbullet-item {margin-top: 10px;}

.part-bg {margin-top: clamp(25px, calc( 45 / var(--inner) * 100vw ), 45px); padding: clamp(40px, calc( 85 / var(--inner) * 100vw ), 85px) clamp(20px, calc( 70 / var(--inner) * 100vw ), 70px); color: #fff; background: url(../images/sub/partner-bg.jpg) no-repeat 50% 50% /cover;}
.part-bg .bg-tit {font-size: clamp(20px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: 800;}
.part-bg .bg-dec {margin-top: clamp(10px, calc( 14 / var(--inner) * 100vw ), 14px); font-size: clamp(16px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: 600; }
.part-bg .tel-info {display: flex; align-items: center; flex-wrap: wrap; margin-top:clamp(30px, calc( 63 / var(--inner) * 100vw ), 63px);}
.part-bg .tel-info span {display: block; }
.part-bg .icn { margin-right:clamp(10px, calc( 18 / var(--inner) * 100vw ), 18px);}
.part-bg .icn img {width: clamp(35px, calc( 48 / var(--inner) * 100vw ), 48px);}
.part-bg .text {flex: 1 0 auto; width: 1%;}
.part-bg .small {font-size: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px);}
.part-bg .tel {font-size: clamp(17px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 800;}