﻿@charset "utf-8";

#container{color:#000;word-break: keep-all;letter-spacing:-0.05rem}

/***** 메인비주얼영역 *****/
#mvisual_wrap{position:relative;width:100%;height:840px;}
.main_swiper{position:absolute;top:0;left:0;width:100%;height:100%;}
.main_swiper .swiper-slide {height:100%; overflow:hidden;background:no-repeat center center;}
.main_swiper .swiper-slide:after{content:""; display:block; width:100%; height:100%; position:absolute; left:0; top:0; z-index:1;background:no-repeat center top;background-size:cover !important;}
.main_swiper .swiper-slide.bg01,
.main_swiper .swiper-slide.bg01:after{background-image:url(/nanum/site/builder/main/main05_02/img/mvisual1.jpg);}
.main_swiper .swiper-slide.bg02,
.main_swiper .swiper-slide.bg02:after{background-image:url(/nanum/site/builder/main/main05_02/img/mvisual2.jpg);}
.main_swiper .swiper-slide.bg03,
.main_swiper .swiper-slide.bg03:after{background-image:url(/nanum/site/builder/main/main05_02/img/mvisual3.jpg);}
.main_swiper .swiper-slide.bg04,
.main_swiper .swiper-slide.bg04:after{background-image:url(/nanum/site/builder/main/main05_02/img/mvisual4.jpg);}

@keyframes ani {
	0%   {top:0%; transfrom:}
	100%   {top:0%; transform:scale(1.1) rotate(.001deg); background-size:cover; }
}
@-webkit-keyframes ani {
	0%   {top:0%;}
	100%   {top:0%; transform:scale(1.1)rotate(.001deg); background-size:cover;}
}
@media screen and (min-width: 1024px){
.main_swiper .swiper-slide:after {
animation-name:ani;
animation-duration: 8s;
animation-delay:1s;
animation-fill-mode: both;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-timing-function: ease-in-out;
-webkit-animation-name:ani;
-webkit-animation-duration: 8s;
-webkit-animation-fill-mode: both;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
-webkit-animation-timing-function: ease-in-out;}
}

.main_swiper .swiper-slide .wsize{top: 50%;margin:0 auto;padding:130px 0 315px;text-align: center;z-index:2;box-sizing:border-box;transform: translate(0, -50%);}
.main_swiper .swiper-slide .txt1{font-size:65px; color:#fff; font-family:'NotoKrB', sans-serif;line-height:1; letter-spacing:-0.08em;}
.main_swiper .swiper-slide .txt2{margin-top:70px;font-size:23px; color:rgba(255,255,255,0.8); font-family:'Roboto','NotoKrR', sans-serif;font-weight:400;line-height:1.7;letter-spacing:-0.08em;}
.main_swiper .swiper-slide .txt1,
.main_swiper .swiper-slide .txt2{opacity:0;filter:Alpha(opacity=0);-webkit-transition:opacity 1.0s, transform 1.0s;-moz-transition:opacity 1.0s, transform 1.0s;-o-transition:opacity 1.0s, transform 1.0s;-ms-transition:opacity 1.0s, transform 1.0s;transition:opacity 1.0s, transform 1.0s;}
.main_swiper .swiper-slide .txt1{-ms-transform: translateY(-50px); -o-transform: translateY(-50px); -moz-transform: translateY(-50px);-webkit-transform: translateY(-50px); transform: translateY(-50px);}
.main_swiper .swiper-slide .txt2{-ms-transform: translateY(-100px); -o-transform: translateY(-100px); -moz-transform: translateY(-100px);-webkit-transform: translateY(-100px); transform: translateY(-100px);} 
.main_swiper .swiper-slide.swiper-slide-active .txt1,
.main_swiper .swiper-slide.swiper-slide-active .txt2{opacity:1.0;filter:Alpha(opacity=100);-ms-transform: translateY(0px); -o-transform: translateY(0px); -moz-transform: translateX(0px);-webkit-transform: translateY(0px); transform: translateY(0px);}

.main_swiper .swiper-pagination{bottom:300px}
.main_swiper .swiper-pagination-bullet{margin:0 7px !important;width:7px;height:7px;background:#fff;border-radius: 50px;opacity:0.5;}
.main_swiper .swiper-pagination-bullet-active{width:20px;background:#fff;opacity:1;}


/*스크롤*/
.scroll_img{position:absolute;bottom:80px;left:50%;padding-bottom:20px;background:url(/nanum/site/builder/main/main05_02/img/scroll_d.png) no-repeat center bottom;z-index:10;transform:translate(-50%, 0);}
.scroll_img p{position:relative;width:26px;height: 45px;border: 2px solid #fff;border-radius: 50px;}
.scroll_img p:before{position:absolute;top:7px;left:50%;content:'';width:3px;height:8px;margin-left:-1px;background-color:#fff;border-radius:50px;-webkit-animation:sdb 2s infinite;animation:sdb 2s infinite;box-sizing:border-box;z-index:2}


@-webkit-keyframes sdb {
	0% {-webkit-transform: translate(0, 0);opacity: 0;}
	40% {opacity: 1;}
	80% {-webkit-transform: translate(0, 15px);opacity: 0;}
	100% {opacity: 0;}
}
@keyframes sdb {
	0% {transform: translate(0, 0);opacity: 0;}
	40% {opacity: 1;}
	80% {transform: translate(0, 15px);opacity: 0;}
	100% {opacity: 0;}
}

/*고압산소치료란 */
.define_w{margin:110px 0;}
.define_w .wsize{display:flex;gap:10px;}
.define_w dl dt{font-size:50px;font-family:'NotoKrR', sans-serif;line-height:1; letter-spacing:-0.08em;}
.define_w dl dt strong{font-family:'NotoKrB', sans-serif;}
.define_w dl dd{margin-top:50px;font-family:'Roboto','NotoKrR', sans-serif;font-weight:400;font-size:17px;line-height: 1.6;}


/* 질환 */
.disease_w{position:relative;padding:100px 0;background:url(/nanum/site/builder/main/main05_02/img/disease_bg.jpg) no-repeat center bottom / cover;}
.disease_w .wsize{z-index:1;}
.disease_w:before,
.disease_w:after{content:'';position:absolute;height:523px;background:no-repeat center left / contain;}
.disease_w:before{top:180px;right:0;width:611px;background-image:url(/nanum/site/builder/main/main05_02/img/disease_bg1.png)}
.disease_w:after{top:490px;left:0;width:642px;background-image:url(/nanum/site/builder/main/main05_02/img/disease_bg2.png)}

.disease_box{display:flex;margin-bottom:40px;padding:40px 10px;background:rgba(255,255,255,0.8);border-radius:40px;box-sizing:border-box;}
.disease_box dt{position:relative;display:flex;justify-content: center;align-items: center;width:245px;font-family:'NotoKrB', sans-serif;line-height:1;font-size:30px;color:#0029ae;text-align:center;flex-shrink: 0;}
.disease_box dt:after{content:'';position:absolute;right: 0;top:0;display:block;width:2px;height:100%;background:#c8caca;}
.disease_box dd{padding:0 60px;font-family:'Roboto','NotoKrM', sans-serif;font-weight:500;font-size: 17px;line-height: 1.5;box-sizing:border-box;}
.disease_box dd strong{font-family:'NotoKrB', sans-serif;color:#0e6eb8;}

.disease_type{display:flex;gap:40px;margin-bottom:70px;}
.disease_type > li{padding:60px 40px;width:0;flex-grow:1;background:#fff;box-shadow:0 0 35px rgba(14,110,184,0.26);border-radius:40px;box-sizing:border-box}
.disease_type > li p{margin-bottom:40px;font-family:'NotoKrB', sans-serif;font-size:35px;line-height:1;}
.disease_type > li .list li{display:flex;gap:10px;font-size:18px;font-family:'Roboto','NotoKrM', sans-serif;font-weight:500;}
.disease_type > li .list li:not(:first-child){margin-top:10px;}
.disease_type > li .list li:before{content:'';display:block;flex-shrink: 0;margin-top:10px;width:6px;height:6px;background:#0029ae;border-radius:50%}

.disease_list{display:flex;flex-wrap:wrap;gap:34px;}
.disease_list p{position:relative;padding:15px 20px 160px;display: flex;justify-content: center;align-items: center;width:calc(25% - 26px);height:250px;font-family:'Roboto','NotoKrB', sans-serif;font-weight:700;font-size:22px;line-height:1.3;color:#0029ae;background:#dde6f3;border:2px solid #0029ae;text-align:center;border-radius:15px;box-sizing:border-box;}
.disease_list p:after{content:'';position:absolute;bottom:0;left:50%;display: block;width:100%;height:160px;background:no-repeat center / contain;transform:translate(-50%, 0);}
.disease_list p.icon1:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list1.png)}
.disease_list p.icon2:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list2.png)}
.disease_list p.icon3:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list3.png)}
.disease_list p.icon4:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list4.png)}
.disease_list p.icon5:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list5.png)}
.disease_list p.icon6:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list6.png)}
.disease_list p.icon7:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list7.png)}
.disease_list p.icon8:after{background-image:url(/nanum/site/builder/main/main05_02/img/disease_list8.png)}


/* 치료절차 */
.process_w{margin:100px 0}
.process_w .tit{margin-bottom:40px;font-family:'NotoKrB', sans-serif;font-size:50px;line-height:1;text-align:center;}
.process_w .process_list{display:flex;}
.process_w .process_list > li{width:0;flex-grow:1;}
.process_w .process_list li .ltit{position:relative;font-family:'NotoKrM', sans-serif;font-size:26px;line-height:66px;color:#0029ae;border-bottom:1px solid #0029ae;text-align:center;opacity:0.5;}
.process_w .process_list li.on .ltit{font-family:'NotoKrB', sans-serif;opacity:1;}
.process_w .process_list li.on .ltit:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:#0029ae;}
.process_w .process_list li ol{margin-top:65px;padding:0 15px;display: flex;flex-direction: column;gap: 50px;}
.process_w .process_list li ol li{position:relative;display: flex;flex-direction: column;gap: 15px;justify-content: center;align-items: center;padding:15px;background:#f6f6f6;border:1px solid #f6f6f6;border-radius:15px;box-sizing:border-box;}
.process_w .process_list li ol li:not(:first-child):after{content:'';position:absolute;top:-32px;left:50%;width:20px;height:12px;background:url(/nanum/site/builder/main/main05_02/img/process_arr.gif) no-repeat center / contain;transform: translate(-50%, 0);}
.process_w .process_list li ol li span{display:inline-block;width:100px;height:35px;line-height:33px;font-family:'Roboto', sans-serif;font-weight:800;font-size:14px;color:#333;text-align:center;border:2px solid #333;border-radius:50px;box-sizing:border-box;text-transform: uppercase;letter-spacing:0;}
.process_w .process_list li ol li p{display: flex;justify-content: center;align-items: center;padding:15px 10px;width: 100%;min-height:60px;font-family:'Roboto','NotoKrM', sans-serif;font-weight:500;font-size:17px;background:#fff;border-radius:15px;text-align:center;box-sizing:border-box;}
.process_w .process_list li.on ol li{background:#f3f5ff;border-color:#8da4f1;}
.process_w .process_list li.on ol li span{color:#fff;background:#0029ae;border-color:#0029ae;}

.point_txt{margin-top:30px;padding-left:28px;background:url(/nanum/site/builder/skin/skin05_02/img/common/icon_notibox.gif) no-repeat 0 3px;background-size:18px auto;font-family:'NotoKrM';font-size:17px;color:#000;}

.youtube{margin:100px 0;}

.map_w{position:relative;}
.map_w .root_daum_roughmap{width:100%;}
.map_w .cont,
.map_w .wrap_controllers{display:none;}

.map_address{position:absolute;top:50px;left:50%;margin-left:-550px;padding:30px 60px;background:#fff;border-radius:25px;box-sizing:border-box;box-shadow:0 8px 49px rgba(0,0,0,0.4);/*transform: translate(-50%, 0);*/z-index:3}
.map_address .tit{margin-bottom:33px;font-family:'NotoKrB', sans-serif;font-size:30px;line-height:1;}
.map_address .location_w{display:flex;width:100%;justify-content: space-between;}
.map_address .location_w p{display:flex;align-items: center;gap:12px;font-family:'Roboto','NotoKrM', sans-serif;font-weight:500;font-size:19px;}
.map_address .location_w p.tel{letter-spacing:0;}
.map_address .location_w p:before{content:'';flex-shrink: 0;width:50px;height:50px;background:#0029ae no-repeat center / contain;border-radius:50%}
.map_address .location_w p.addr:before{background-image:url(/nanum/site/builder/main/main05_02/img/addr_icon.png)}
.map_address .location_w p.tel:before{background-image:url(/nanum/site/builder/main/main05_02/img/tel_icon.png)}

/****************************** 태블릿 ******************************/
@media all and (max-width:1024px){

#container .wsize{padding: 0 15px;}	
	
#mvisual_wrap{height:100vh;min-height:550px;}
.main_swiper .swiper-slide .txt1{font-size:50px;}
.main_swiper .swiper-slide .txt2{margin-top: 50px;font-size: 18px;}
.main_swiper .swiper-slide .wsize{padding: 100px 0 250px;}
.main_swiper .swiper-pagination{bottom: 30vh;}
.scroll_img{bottom:30px;}
.scroll_img p{width: 20px;height: 35px;}

.define_w,
.process_w,
.youtube{margin:70px 0;}
.define_w dl dt{font-size: 40px;}
.define_w dl dd{margin-top: 30px;font-size:16px}
.define_w img{width:380px}

.disease_w{padding:70px 0;}
.disease_box{margin-bottom:20px;padding:25px 10px;}
.disease_box dt{width: 180px;font-size: 25px;}
.disease_box dd{padding: 0 40px;font-size:16px}
.disease_type{gap:20px;margin-bottom: 50px;}
.disease_type > li{padding: 40px 30px;}
.disease_type > li p{margin-bottom: 30px;font-size: 27px;}
.disease_type > li .list li{font-size:16px;}
.disease_type > li .list li:before{margin-top:9px;}

.disease_list{gap: 15px;}
.disease_list p{padding: 10px 15px 130px;width: calc(25% - 12px);height: 215px;font-size: 20px;}
.disease_list p:after{max-width:90%;height: 130px;}

.process_w .tit{margin-bottom:20px;font-size:37px;}
.process_w .process_list li .ltit{font-size: 22px;line-height: 60px;}
.process_w .process_list li ol{margin-top: 45px;padding: 0 10px;gap: 40px;}
.process_w .process_list li ol li:not(:first-child):after{top:-27px}
.process_w .process_list li ol li span{width: 80px;height: 30px;line-height: 28px;font-size: 13px;}
.process_w .process_list li ol li p{padding: 13px 5px;min-height: 70px;font-size: 16px;}

.point_txt{font-size: 15px;}

.map_address{top: 15px;width:94%;margin-left: -47%;padding:20px 35px !important;}
.map_address .tit{margin-bottom: 20px;font-size: 25px;}
.map_address .location_w{flex-direction: column;gap:5px}
.map_address .location_w p{font-size:17px}
.map_address .location_w p:before{width: 40px;height: 40px;}

.map_w .root_daum_roughmap .wrap_map{height:500px !important}

}

/****************************** 모바일 ******************************/
@media all and (max-width:767px){

#mvisual_wrap{min-height: 460px;}
.main_swiper .swiper-slide .wsize{padding: 80px 0 150px;}
.main_swiper .swiper-slide .txt1{font-size:30px;}
.main_swiper .swiper-slide .txt2{margin-top: 35px;font-size: 15px;line-height: 1.5;}
.scroll_img p{width: 16px;height: 30px;}
.scroll_img p:before{top: 5px;height:5px}

.define_w, 
.process_w{margin:50px 0;}
.disease_w{padding:50px 0;}

.define_w .wsize{flex-direction: column;gap: 30px;}
.define_w dl dt{font-size: 26px;text-align: center;}
.define_w dl dd{margin-top: 25px;font-size: 14px;line-height: 1.5;}
.define_w .wsize img{margin: 0 auto;max-width:100%;}

.disease_box{flex-direction: column;margin-bottom: 15px;padding: 20px;border-radius: 20px;}
.disease_box dt{width:auto;margin-bottom: 15px;font-size: 22px;}
.disease_box dd{padding:0;font-size:14px;}

.disease_type{gap: 15px;margin-bottom: 35px;}
.disease_type > li{padding:25px;border-radius:20px}
.disease_type > li p{margin-bottom: 20px;font-size:22px;}
.disease_type > li .list li{font-size:14px}
.disease_type > li .list li:before{margin-top: 7px;width: 5px;height: 5px;}

.disease_list{gap:10px}
.disease_list p{padding-bottom:100px;width: calc(50% - 5px);height: 150px;font-size: 16px;}
.disease_list p:after{height: 95px;}
.disease_list p.icon3:after{background-size: auto 75px;}

.process_w .tit{font-size:26px}
.process_w .process_list{flex-direction: column;gap: 10px;}
.process_w .process_list > li{width:100%;flex-grow:0;}
.process_w .process_list li .ltit{font-size:18px;line-height: 45px;}
.process_w .process_list li ol{margin-top: 20px;padding:0;gap:5px;flex-direction: row;}
.process_w .process_list li ol li{width:0;flex-grow:1;gap:7px;justify-content: flex-start;padding:7px 5px;}
.process_w .process_list li ol li:not(:first-child):after{display:none;}
.process_w .process_list li ol li span{width: 100%;font-size:11px;height: 27px;line-height: 25px;}
.process_w .process_list li ol li p{height: 100%;min-height:auto;font-size: 14px;}

.point_txt{padding-left: 25px;margin-top: 15px;font-size: 13px;line-height: 1.45;background-position: 0 1px;background-size: 16px auto;}

.youtube{margin:40px 0;height:380px;}
.youtube iframe{height:100%;}

.map_address{padding:15px !important;border-radius:15px;}
.map_address .tit{margin-bottom: 15px;font-size:19px;}
.map_address .location_w p{font-size:14px;}
.map_address .location_w p:before {width: 35px;height: 35px;}

.map_w .root_daum_roughmap .wrap_map{height:350px !important;}


}

/****************************** 모바일 ******************************/
@media all and (max-width:560px){
	
.disease_type{flex-direction: column;}
.disease_type > li{width:100%;flex-grow:0;}

.youtube{height:300px;}

}

/****************************** 모바일 ******************************/
@media all and (max-width:420px){
	
.youtube{height:240px;}

.map_w .root_daum_roughmap .wrap_map{height:300px !important;}
	
}