@charset "utf-8";

/* 서브공통 */
.con .main_title {font-size: 30px; padding-left: 22px; position: relative; margin-bottom: 20px;}
.con .main_title::after {position: absolute; content: ''; width: 13px; height: 13px; background-color: #0068b7; left: 0; top: 50%; transform: translateY(-50%) rotate(90deg); border-radius: 20px 20px 50px 50px;}
.con p {font-size: 20px; line-height: 1.5; word-break: keep-all;}

@media screen and (max-width: 960px) {
	.con .main_title {font-size: 24px;}
	.con .main_title::after {width: 10px; height: 10px;}
	.con p {font-size: 18px;}
}

@media screen and (max-width: 640px) {
	.con .main_title {font-size: 20px; padding-left: 18px;}
	.con p {font-size: 16px;}
}
/* 서브공통 */


/* 인사말 */
#a1 .con {margin-bottom: 80px; position: relative; margin-bottom: 20px;}
#a1 .con:last-child {margin-bottom: 0;}
#a1 .con1 h2{ font-size: 40px; position: relative; margin-bottom: 50px;}
#a1 .con1 h2 span{color: #0068b7; font-weight: 800;}
#a1 .con1 .con1_wrap{display: flex; align-items:center; justify-content: space-between; gap: 30px; margin-bottom: 70px;}
#a1 .con1 .img_wrap img{width: 100%; height: auto; max-width: 400px;} 
#a1 .con1 .img_wrap h4{text-align: center; font-size: 30px; margin-top: 20px;}
#a1 .con2{display: flex; align-items: center; justify-content: space-evenly;}
#a1 .con2 img{width: 100%; height: auto; max-width: 500px;}

@media screen and (max-width: 1060px) {
	#a1 .con1 .con1_wrap{flex-direction: column;}
	#a1 .con2 img{width: 100%; height: auto; max-width: 400px;}
}

@media screen and (max-width: 880px) {
	#a1 .con2{flex-direction: column; gap: 10px;}
}
/* 인사말 */


/*오시는 길*/
#a3 .con3 ul{font-size: 20px; line-height: 1.5; margin-top: 30px; }
#a3 .con3 ul li{margin-bottom: 30px; }
#a3 .con3 ul li span{font-size: 23px; color: #0068b7; font-weight: 800;}

@media screen and (max-width: 960px) {
	#a1 .con1 h2{font-size: 35px;}
	#a3 .con3 ul {font-size: 18px;}
	#a3 .con3 ul li span{font-size: 20px;}
}

@media screen and (max-width: 640px) {
	#a1 .con1 h2{font-size: 30px;}
	#a3 .con3 ul {font-size: 16px;}
	#a3 .con3 ul li span{font-size: 18px;}
}
/*오시는 길*/


/* 임직원 */
#a4 .con {margin-bottom: 80px; position: relative; margin-bottom: 20px;}
#a4 .con img{width: 100%;}

@media screen and (max-width: 1060px) {
	
}

@media screen and (max-width: 880px) {
	
}
/* 임직원 */


/* a5 */
#a5 .con {margin-bottom: 80px; position: relative; margin-bottom: 20px;}
#a5 .con img{width: 100%;}

@media screen and (max-width: 1060px) {
	
}

@media screen and (max-width: 880px) {
	
}
/* a5 */

/* 수도배관 세척 */
#b1 .con {margin-bottom: 80px;}
#b1 .con:last-child {margin-bottom: 0;}
#b1 .con p {margin-bottom: 10px;}
#b1 .con p:last-child {margin-bottom: 0;}
#b1 .con .circle {position: relative; padding-left: 1em;}
#b1 .con .circle::before {content: "• "; position: absolute; color: #0A31A8; top: 0; left: 0;}

#b1 .con1 .flex_box {}
#b1 .con1 .flex_box li {}
#b1 .con1 .flex_box .tag_box {width: max-content; margin: 20px auto 0; display: flex; justify-content: space-between; align-items: center; gap: 10px;}
#b1 .con1 .flex_box .tag_box p {background-color: #0068b7; color: #fff; margin-bottom: 0; padding: 10px 20px; font-weight: 700; text-align: center; width: max-content; border-radius: 30px;}
#b1 .con1 .flex_box .text_box {text-align: center;}
#b1 .con1 .flex_box .text_box p {font-weight: 700; line-height: 1.8; font-size: 30px;}
#b1 .con1 .flex_box .text_box p span {color: #0A31A8;}
#b1 .con1 .text_wrap {background-color: #f5f5f5; padding: 30px; border-radius: 30px; margin-top: 30px;}
#b1 .con1 .text_wrap p {}
#b1 .con1 .text_wrap p b {}
#b1 .con1 .text_wrap .img_box {margin-top: 20px;}
#b1 .con1 .text_wrap .img_box img {width: 100%;}

#b1 .con2 .flex_box {display: flex; justify-content: space-between; gap: 30px; align-items: center;}
#b1 .con2 .flex_box li {}
#b1 .con2 .flex_box .img_box {width: 30%;}
#b1 .con2 .flex_box .img_box img {width: 100%; border-radius: 30px;}
#b1 .con2 .flex_box .text_box {width: 70%;}
#b1 .con2 .flex_box .text_box h2:last-of-type {margin-top: 30px;}
#b1 .con2 .flex_box .text_box p.line {padding-bottom: 30px; border-bottom: 1px solid #ddd;}
#b1 .con2 .flex_box .text_box .circle {}

#b1 .con3 .box {margin-bottom: 50px;}
#b1 .con3 .box:last-child {margin-bottom: 0;}
#b1 .con3 .box1 ul {background-color: #f5f5f5; border-radius: 30px; padding: 30px;}
#b1 .con3 .box1 ul li {display: flex; justify-content: space-between; gap: 30px;}
#b1 .con3 .box1 ul .img_box {margin-bottom: 30px;}
#b1 .con3 .box1 ul .img_box img {width: calc(50% - 15px); border-radius: 30px;}
#b1 .con3 .box1 ul .text_box {flex-wrap: wrap;}
#b1 .con3 .box1 ul .text_box .tag {width: calc(50% - 15px); background-color: #0068b7; color: #fff; margin-bottom: 0; padding: 10px 20px; font-weight: 700; text-align: center; border-radius: 30px;}
#b1 .con3 .box2 {background-color: #f5f5f5; border-radius: 30px; padding: 30px;}
#b1 .con3 .box2 .img_box {margin-bottom: 30px;}
#b1 .con3 .box2 .img_box h3 {text-align: center; color: #fff; background-color: #0A31A8; padding: 10px 30px; border-radius: 30px; font-size: 25px; width: max-content; margin: 0 auto 20px;}
#b1 .con3 .box2 .img_box img {width: 100%;}
#b1 .con3 .box2 .text_box {}
#b1 .con3 .box2 .text_box p {}

@media screen and (max-width: 960px) {
	#b1 .con {margin-bottom: 60px;}
	#b1 .con1 .flex_box .text_box p {font-size: 25px;}
	#b1 .con2 .flex_box {flex-wrap: wrap;}
	#b1 .con2 .flex_box .img_box {width: 100%;}
	#b1 .con2 .flex_box .text_box {width: 100%;}
	#b1 .con3 .box2 .img_box h3 {font-size: 22px;}
}

@media screen and (max-width: 640px) {
	#b1 .con {margin-bottom: 50px;}
	#b1 .con1 .flex_box .text_box p {font-size: 18px; width: 60%; margin: 0 auto;}
	#b1 .con1 .text_wrap {padding: 20px; border-radius: 20px;}
	#b1 .con2 .flex_box .img_box img {border-radius: 20px;}
	#b1 .con2 .flex_box .text_box p.line {padding-bottom: 20px;}
	#b1 .con2 .flex_box .text_box h2:last-of-type {margin-top: 20px;}
	#b1 .con3 .box1 ul {border-radius: 20px; padding: 20px;}
	#b1 .con3 .box1 ul li {gap: 10px;}
	#b1 .con3 .box1 ul .img_box {flex-wrap: wrap;}
	#b1 .con3 .box1 ul .img_box img {width: 100%; border-radius: 20px;}
	#b1 .con3 .box1 ul .text_box .tag {width: 100%;}
	#b1 .con3 .box2 {padding: 20px; border-radius: 20px;}
	#b1 .con3 .box2 .img_box h3 {font-size: 20px;}
}

@media screen and (max-width: 525px) {
	#b1 .con1 .flex_box .text_box p {width: 100%;}
	#b1 .con1 .flex_box .text_box p br {display: none;}
	#b1 .con1 .flex_box .tag_box {flex-wrap: wrap; width: 100%;}
	#b1 .con1 .flex_box .tag_box p {width: 100%;}
}
/* 수도배관 세척 */


/* 난방배관 세척 */
#c1 .con {margin-bottom: 80px;}
#c1 .con:last-child {margin-bottom: 0;}
#c1  .con p {margin-bottom: 10px;}
#c1  .con p:last-child {margin-bottom: 0;}
#c1  .con1 .img_box {display: flex; justify-content: space-between; gap: 30px; margin: 30px auto;}
#c1  .con1 .img_box img {width: 50%; border-radius: 30px;}
#c1  .con1 .text_box {}
#c1  .con1 .text_box h3 {margin-bottom: 20px; font-size: 22px; color: #121212;}
#c1  .con1 .text_box h3 b {color: #0A31A8;}
#c1  .con1 .text_box p {color: #666;}
#c1  .con1 .text_box p b {color: #121212;}

#c1  .con2 {background-color: #f5f5f5; border-radius: 30px; padding: 30px;}
#c1  .con2 p {text-align: center;}
#c1  .con2 .img_box {display: flex; justify-content: space-between; gap: 30px; margin: 30px auto 0;}
#c1  .con2 .img_box img {width: calc(50% - 15px); border-radius: 30px;}

#c1  .con3 ul {}
#c1  .con3 ul li {display: flex; justify-content: space-between; align-items: center; gap: 30px; margin-bottom: 30px; padding: 30px; border-radius: 30px; background-color: #f5f5f5;}
#c1  .con3 ul li:last-child {margin-bottom: 0;}
#c1  .con3 ul li .img_box {width: 30%; order: 2;}
#c1  .con3 ul li:first-child .img_box {width: 40%;}
#c1  .con3 ul li .img_box img {width: 100%; border-radius: 30px;}
#c1  .con3 ul li .text_box {width: 70%;}
#c1  .con3 ul li .text_box h2 {font-size: 25px; margin-bottom: 20px;}
#c1  .con3 ul li .text_box p {position: relative; padding-left: 1em;}
#c1  .con3 ul li .text_box p::before {content: "• "; position: absolute; color: #0A31A8; top: 0; left: 0;}

@media screen and (max-width: 960px) {
	#c1  .con {margin-bottom: 60px;}
	#c1  .con3 ul li h2 {font-size: 22px; margin-bottom: 15px;}
	#c1  .con3 ul li {flex-wrap: wrap;}
	#c1  .con3 ul li .img_box {width: 100%; order: 2;}
	#c1  .con3 ul li:first-child .img_box {width: 100%;}
	#c1  .con3 ul li .text_box {width: 100%;}
}

@media screen and (max-width: 640px) {
	#c1  .con {margin-bottom: 50px;}
	#c1  .con1 .img_box {flex-wrap: wrap; gap: 20px; margin: 20px auto;}
	#c1  .con1 .img_box img {width: 100%; border-radius: 20px;}
	#c1  .con1 .text_box h3 {font-size: 20px; margin-bottom: 15px;}
	#c1  .con2 {border-radius: 20px; padding: 20px;}
	#c1  .con2 .img_box {flex-wrap: wrap; gap: 20px; margin: 20px auto 0;}
	#c1  .con2 .img_box img {width: 100%; border-radius: 20px;}
	#c1  .con3 ul li .text_box h2 {font-size: 20px;}
	#c1  .con3 ul li {padding: 20px; border-radius: 20px;}
	#c1  .con3 ul li .img_box img {border-radius: 20px;}
}
/* 난방배관 세척 */


/* 서비스계약순서 */
#d1 .con {margin-bottom: 80px;}
#d1 .con img {width: 100%; max-width: 1000px; display: block; margin: 0 auto;}

@media screen and (max-width: 960px) {
	#d1 .con {margin-bottom: 60px;}
}

@media screen and (max-width: 640px) {
	#d1 .con {margin-bottom: 50px;}
}
/* 서비스계약순서 */


/* 배관세척과정 */
#d2 .tab_menu {display: flex; justify-content: center; align-items: center; gap: 30px;}
#d2 .tab_menu .tab_btn {width: calc(100% / 4 - 15px); background-color: #ddd; padding: 15px 10px; font-size: 20px; font-weight: 600; color: #999; text-align: center; border-radius: 30px; transition: .4s;}
#d2 .tab_menu .tab_btn.active {background-color: #0068b7; color: #fff;}
#d2 .tab_menu .tab_btn:hover {background-color: #0068b7; color: #fff;}

#d2 .con {margin: 50px auto 80px;}
#d2 .con img {width: 100%; max-width: 1000px; display: block; margin: 0 auto;}

@media screen and (max-width: 960px) {
	#d2 .con {margin-bottom: 60px;}
	#d2 .tab_menu {gap: 10px;}
	#d2 .tab_menu .tab_btn {font-size: 18px; width: calc(25% - 5px);}
}

@media screen and (max-width: 640px) {
	#d2 .con {margin: 30px auto 50px;}
	#d2 .tab_menu {flex-wrap: wrap;}
	#d2 .tab_menu .tab_btn {font-size: 16px; width: calc(50% - 5px);}
}
/* 배관세척과정 */

/* 개선효과 */
#d3 .con {margin-bottom: 80px;}
#d3 .con:last-child {margin-bottom: 0;}
#d3 .con p {margin-bottom: 10px;}
#d3 .con p:last-child {margin-bottom: 0;}
#d3 .con1 .list_box {}
#d3 .con1 .list_box .list {margin-bottom: 50px;}
#d3 .con1 .list_box .list:last-child {margin-bottom: 0;}
#d3 .con1 .list_box .list .question {word-break: keep-all; margin-bottom: 20px; font-size: 22px; color: #fff; background-color: #0068b7; padding: 30px 10px; border-radius: 50px; text-align: center; font-weight: 400;}
#d3 .con1 .list_box .list .question span {font-size: 25px; font-weight: 700;}
#d3 .con1 .list_box .list .flex_box {display: flex; justify-content: space-between; align-items: center; gap: 30px; background-color: #f5f5f5; padding: 30px; border-radius: 30px;}
#d3 .con1 .list_box .list .flex_box li {width: calc(50% - 15px);}
#d3 .con1 .list_box .list .flex_box li img {width: 100%; border-radius: 30px; margin-bottom: 10px;}
#d3 .con1 .list_box .list .flex_box li p {margin: 0 auto; padding: 10px 20px; font-size: 20px; color: #fff; border-radius: 30px; font-weight: 700; text-align: center; width: max-content;}
#d3 .con1 .list_box .list .flex_box li .before {background-color: #555;}
#d3 .con1 .list_box .list .flex_box li .after {background-color: #0A31A8; padding: 10px 28px;}

@media screen and (max-width: 960px) {
	#d3 .con {margin-bottom: 60px;}
	#d3 .con1 .list_box .list .question {font-size: 20px;}
	#d3 .con1 .list_box .list .question span {font-size: 23px;}
	#d3 .con1 .list_box .list .flex_box li p {font-size: 18px;}
}

@media screen and (max-width: 640px) {
	#d3 .con {margin-bottom: 50px;}
	#d3 .con1 .list_box .list .question {font-size: 18px; padding: 30px;}
	#d3 .con1 .list_box .list .question span {font-size: 20px;}
	#d3 .con1 .list_box .list .flex_box {flex-wrap: wrap; padding: 20px;}
	#d3 .con1 .list_box .list .flex_box li {width: 100%; border-radius: 20px;}
	#d3 .con1 .list_box .list .flex_box li img {border-radius: 20px;}
	#d3 .con1 .list_box .list .flex_box li p {font-size: 16px;}
}
/* 개선효과 */