/* 공통 */
.point-color{color: #4d88a6!important;}
.point-bg{background-color: #4d88a6!important;}
.sub-color{color: #e2eaee!important;}
.sub-bg{background-color: #e2eaee!important;}
.white-color{color: #fff!important;}
.white-bg{background-color: #fff!important;}
.hidden-md{display: block;}
@media (max-width: 1200px){
.hidden-md{display: none;}
}

/* ========== 탈모클리닉 ========== */
.sub_Hair{background-color: #f3f6f8; word-break: keep-all; overflow: hidden; position: relative;}
.sub_Hair span.inline{border-bottom: 1px solid #333; padding-bottom: 3px;}

.sub_Hair .obj1{position: absolute; right: -11%; top: 10%; z-index: -1;}
.sub_Hair .obj2{top: 0; z-index: -1;}

.hairloss{position: relative; padding: 0 !important; background: none!important; background-color: #f3f6f8!important; z-index: 1;}
.hairloss:before{content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: no-repeat center 354px/cover url(/page/hairloss/img/sub_bg.jpg);}
.hairloss .sub_top{max-width: 1800px; width: auto;}
.hairloss .sub_top .text-box{position: relative; padding: 0;}
.hairloss .sub_top .text-box .subtit{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; padding-left: 8rem;}

@media (max-width: 1520px){
	.hairloss .sub_top .text-box .subtit{padding-left: 3rem;}
}
@media (max-width: 1400px){
	.hairloss .sub_top .text-box .subtit{padding-left: 0;}
}
@media (max-width: 991px){
	.hairloss .sub_top{max-width: 90%!important;}
	.hairloss .sub_top .text-box{padding: 5rem; height: 35em; width: 100%;}
}

.hairloss .shadow1{top: auto; right: 0; transform-origin: right; animation: wind 3s infinite linear; bottom: 6rem;}
.hairloss .box_transparent{position: relative; background-color: #5c96b4; padding: 30px;}

.title .container_sub{display: flex; flex-direction: column; align-items: center;}
.title .container_sub > h2{border-bottom: 1px solid #4d88a6; display: inline-block;}

/* 남성 탈모의 원인 */
.sec_conts01{z-index: 0; padding: 0;}
.sec_conts01 .imglist{display: flex; flex-wrap: wrap; justify-content: space-between;}
.sec_conts01 .imglist .box{width: 24%;}

.sec_conts01 .sub_tit{margin: 8rem 0;}

.sec_conts01 .dhtbox{display: flex; flex-wrap: wrap;}
.sec_conts01 .dhtbox .imgbox{width: 45%;}
.sec_conts01 .dhtbox .txtbox{width: 55%; padding-left: 5%;}
.sec_conts01 .dhtbox .txtbox .c_list{display: flex; align-items: center; justify-content: space-between;}
.sec_conts01 .dhtbox .txtbox .c_list .circle{display: flex; width: 16rem; height: 16rem; border-radius: 50%; align-items: center; justify-content: center;}
.sec_conts01 .dhtbox .txtbox .c_list .circle > p{line-height:1.4 !important; margin: 0 !important;}
.sec_conts01 .dhtbox .txtbox .txt{margin-top: 5rem;}

@media (max-width: 1520px){
	.sec_conts01{max-width: 90% !important;}
}

@media (max-width: 1240px){
	.sec_conts01 .dhtbox .imgbox{width: 50%;}
	.sec_conts01 .dhtbox .txtbox{width: 50%;}
	.sec_conts01 .dhtbox .txtbox .c_list .circle{width: 12rem; height: 12rem;}
}

@media (max-width: 1024px){
	.sec_conts01 .dhtbox .imgbox{width: 100%; text-align: center;}
	.sec_conts01 .dhtbox .txtbox{width: 100%; padding-left: 0; margin-top: 3rem;}
	.sec_conts01 .dhtbox .txtbox .c_list{width: 70%; margin: auto;}
	.sec_conts01 .dhtbox .txtbox .c_list .circle{width: 14rem; height: 14rem;}
	.sec_conts01 .dhtbox .txtbox .txt{text-align: center;}
}

@media (max-width: 991px){
	.sec_conts01 .imglist .box{width: 48%;}
}

@media (max-width: 768px){
	.sec_conts01 .dhtbox .txtbox .c_list{width: 100%;}
	.sec_conts01 .dhtbox .txtbox .c_list .circle{width: 12rem; height: 12rem;}
}

@media (max-width: 500px){
	.sec_conts01 .dhtbox .txtbox .c_list .circle > p{font-size: 20px!important;}
}


/* 여성 탈모의 원인 */
.sec_conts02{z-index: 0;}
.sec_conts02 .imglist{display: flex; flex-wrap: wrap; justify-content: space-between;}
.sec_conts02 .imglist .box{width: 30%;}

.sec_conts02 .sub_tit{margin: 8rem 0;}
.sec_conts02 .pictolist{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.sec_conts02 .txt{margin: 6rem 0;}

@media (max-width: 1520px){
	.sec_conts02{max-width: 90% !important;}
}

@media (max-width: 1240px){
	.sec_conts02 .pictolist .picto{width: 28%;}
}

@media (max-width: 768px){
	.sec_conts02 .imglist .box{width: 48%;}

	.sec_conts02 .pictolist{justify-content: center;}
	.sec_conts02 .pictolist .picto{width: 100%; text-align: center;}
	.sec_conts02 .pictolist > img{transform: rotate(90deg); margin: 1rem 0;}
}



/* 탈모치료 프로그램 */
.sec_conts03{z-index: 0;}
.sec_conts03 .equilist{display: flex; flex-wrap: wrap; justify-content: space-between;}
.sec_conts03 .equilist .equi{width: 18%;}
.sec_conts03 .equilist .equi .txt{width: 100%; margin-top: 2rem;}
.sec_conts03 .equilist .equi .txt > p, .sec_conts03 .equilist .equi .txt > span{line-height:1.2 !important;}

@media (max-width: 1520px){
	.sec_conts03{max-width: 90% !important;}
}

@media (max-width: 991px){
	.sec_conts03 .equilist .equi{width: 48%; margin-bottom: 3rem;}
}

@media (max-width: 480px){
	.sec_conts03 .equilist .equi{width: 100%;}
	.sec_conts03 .equilist .equi > img{width: 100%;}
}


/* 배너 */
.sec_conts04{z-index: 0; width: 100%; background: url(/page/hairloss/img/bg_hairloss.jpg)no-repeat center center/cover;height: 55em;position:relative;z-index: 0;}
.sec_conts04 .inner{max-width: 1520px; margin: auto;position: relative;height: 100%;}
.sec_conts04 .txt{color:#fff; text-align: right;margin-left: auto; width:90%; position: absolute; right: 0; bottom: 5%;}
.sec_conts04 .txt > span{letter-spacing: 3px}
.sec_conts04 .txt > h2{line-height: 1.4;}
.sec_conts04 .txt > p{font-weight: 300; margin-top: 3rem;}

@media (max-width: 1520px){
	.sec_conts04 .inner{max-width: 90% !important;}
}



/* ========== 탈모이식 ========== */
.transplant{position: relative; padding: 0 !important; background: none!important; background-color: #f3f6f8!important; z-index: 1;}
.transplant:before{content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: no-repeat center 354px/cover url(/page/hairloss/img2/sub_bg.jpg);}
.transplant .sub_top{max-width: 1800px; width: auto;}
.transplant .sub_top .text-box{position: relative; padding: 0;}
.transplant .sub_top .text-box .subtit{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; padding-left: 4rem;}
.transplant .shadow1{top: auto; right: 0; transform-origin: right; animation: wind 3s infinite linear; bottom: 6rem;}

@media (max-width: 1520px){
	.transplant .sub_top .text-box .subtit{padding-left: 3rem;}
}
@media (max-width: 1400px){
	.transplant .sub_top .text-box .subtit{padding-left: 0;}
}
@media (max-width: 991px){
	.transplant .sub_top{max-width: 90%!important;}
	.transplant .sub_top .text-box{padding: 5rem; height: 35em; width: 100%;}
}

.transplant .container_sub{padding: 100px 0;}
.sub_Hair .transplant span.inline{border-bottom: 1px solid #fff;}

.transplant .iconlist{position: relative; max-width: 1200px; background-color: #5c96b4; display: flex; padding: 5rem 8rem; margin: auto; align-items: center; justify-content: space-between;}
.transplant .iconlist .icon{text-align: center;}
.transplant .iconlist .icon > p{margin: 0;}
.transplant .iconlist .icon .font-20{line-height: 2!important; margin-top: 10px;}
.transplant .iconlist .icon .font-18{line-height: 1.2!important;}

@media (max-width: 991px){
	.transplant .iconlist{flex-wrap: wrap; justify-content: center; padding: 5rem 2rem;}
	.transplant .iconlist .icon{width: 33.3%;}
	.transplant .iconlist .icon:nth-child(4),.transplant .iconlist .icon:nth-child(5){margin-top: 5rem;}
}


/* special */
.sub_Hair .special_conts .tit{padding-bottom: 2rem;}
.sub_Hair .special_conts .tit > h2{margin-bottom: 3rem;}
.sub_Hair .special_conts .inner_wrap{justify-content: center;}
.sub_Hair .special_conts .inner_wrap .circle{width: 33%;}
.sub_Hair .special_conts .inner_wrap .circle .txt > p{word-break: keep-all;}
.sub_Hair .special_conts .inner_wrap .line{background-color: #4d88a6!important; height: 24rem;}
.sub_Hair .special_conts .inner_wrap .line-md{display: none;}

@media (max-width: 991px){
	.sub_Hair .special_conts .inner_wrap{justify-content: space-between;}
	.sub_Hair .special_conts .inner_wrap .circle{width: 45%; display: block; text-align: center;}
	.sub_Hair .special_conts .inner_wrap .circle.mt{margin-top: 30px !important;}
	.sub_Hair .special_conts .inner_wrap .circle > img{width: auto;}
	.sub_Hair .special_conts .inner_wrap .circle .txt{margin-left: 0;width: 80%; margin: auto; margin-top: 2rem;}
	.sub_Hair .special_conts .inner_wrap .line{width: 1px; margin: 0; height: 20rem;}
	.sub_Hair .special_conts .inner_wrap .line-md{display: block;}
	.sub_Hair .special_conts .inner_wrap .line-none{display: none;}
}

@media (max-width: 500px){
	.sub_Hair .special_conts .inner_wrap .circle{width: 100%; text-align: left; display: flex; align-items: center;}
	.sub_Hair .special_conts .inner_wrap .circle > img{width: 40%;}
	.sub_Hair .special_conts .inner_wrap .circle .txt{margin-top: auto; margin-left: 4rem;}
	.sub_Hair .special_conts .inner_wrap .line{width: 90%; height: 1px; align-self: center; margin: 4rem auto;}
	.sub_Hair .special_conts .inner_wrap .line-none{display: block;}
}


/* 효과 */
.sub_Hair .section_common01 .bg-img{background: url(/page/hairloss/img2/bg-img.jpg)no-repeat center right 30%/cover;}
.sub_Hair .section_common01 .table_box .box{border: 1px solid #cfe1ea;border-top: none;border-right: none;}
.sub_Hair .section_common01 .table_box .box:nth-child(3n){border-right: 1px solid #cfe1ea;}

@media (max-width: 768px){
	.sub_Hair .section_common01 .table_box .box:nth-child(2n){border-right: 1px solid #cfe1ea;}
	.sub_Hair .section_common01 .table_box .box:nth-child(3n){border-right: none;}
	.sub_Hair .section_common01 .table_box .box:last-child{border-right: 1px solid #cfe1ea;}
}

@media (max-width: 500px){
	.sub_Hair .section_common01 .table_box .box{border-right: 1px solid #cfe1ea;}
	.sub_Hair .section_common01 .table_box .box:nth-child(3n){border-right: 1px solid #cfe1ea;}
}


/* 장점 */
.sub_Hair .section_common02 .obj3{z-index: -1; top: 5%; left: 87%;}
.sub_Hair .section_common02 .obj4{z-index: -1; top: auto; left: -10%; bottom: 0;}
.sub_Hair .section_common02 .merit .merit_box{width: 100%; padding: 2em 3em; background-color: #e8eff2; border-top: 2px solid #4d88a6; height: auto; display: flex; align-items: flex-start; 
justify-content: space-between;}
.sub_Hair .section_common02 .merit .merit_box .txt{width: 65%;}
.sub_Hair .section_common02 .merit .merit_box .txt:last-child{width: 100%;}
.sub_Hair .section_common02 .merit .merit_box .txt .font-22{margin: 0;}
.sub_Hair .section_common02 .merit .merit_box .box{width: 30%;}

@media (max-width: 768px){
	.sub_Hair .section_common02 .merit .merit_box{flex-direction: column; padding: 2em 1.5em;}
	.sub_Hair .section_common02 .merit .merit_box .txt{width: 100%; margin-bottom: 1em;}
	.sub_Hair .section_common02 .merit .merit_box .box{width: 100%; text-align: center;}
}


/* 시술과정 */
.sub_Hair .section_common03{padding-bottom: 0;}

.sub_Hair .section_common03 .obj5{z-index: -1; top: 40%; right: -20%; left: auto; bottom: auto; transform: rotate(5deg);}
.sub_Hair .section_common03 .step_box .step_text{word-break: keep-all; line-height: 1.4;}
.sub_Hair .section_common03 .step_num{right: -2%;}


/* 효과는언제? */
.section_common05{padding-bottom: 0;}
.section_common05 .inner_box .box_wrap{display: flex; flex-wrap: wrap; width: 100%; max-width: 1200px; margin: auto; padding: 5em 0;}
.section_common05 .inner_box .box_wrap .colorbox{padding: 3em 1em;}
.section_common05 .inner_box .box_wrap .color1{background-color: #d7e4e9; width: 15%;}
.section_common05 .inner_box .box_wrap .color2{background-color: #afcdda; width: 20%;}
.section_common05 .inner_box .box_wrap .color3{background-color: #7cacc0; width: 25%;}
.section_common05 .inner_box .box_wrap .color4{background-color: #477fa0; width: 40%;}
.section_common05 .inner_box .box_wrap .colorbox .txt > p{margin: 0;}

.section_common05 .imgbox{padding: 180px 0; margin: auto; text-align: center;}

@media (max-width: 1440px){
	.section_common05 .inner_box .box_wrap{width: 90%;}
	.section_common05 .imgbox{padding: 140px 0;}
}

@media (max-width: 1240px){
	.section_common05 .imgbox{padding: 120px 0;}
}

@media (max-width: 991px){
	.section_common05 .inner_box .box_wrap .colorbox{width: 100%;}
	.section_common05 .inner_box .box_wrap .color1{padding: 1em 1em;}
	.section_common05 .inner_box .box_wrap .color2{padding: 1.5em 1em;}
	.section_common05 .inner_box .box_wrap .color3{padding: 2em 1em;}
	.section_common05 .inner_box .box_wrap .color4{padding: 3em 1em;}
	.section_common05 .imgbox{padding: 100px 0;}
}

@media (max-width: 768px){
	.section_common05 .imgbox{padding: 80px 0;}
}