@charset "utf-8";
#wrap{min-width:320px;}

.product .tab-type_01.script{position:relative; background-color:#fff;}
.product .tab-type_01.script a{position:relative; z-index:3;}

.product .tab-type_01.script.fixed{z-index:9; position:fixed; left:0; top:0; width:100%;}
.product .tab-type_01.script.fixed:before{top:auto; bottom:0}
.product .tab-type_01.script.fixed .tab_wrap{margin:0 auto}	

.detail_view_template{position:relative; margin-top:-70px;}
.detail_view_template .ver_w{display:block}
.detail_view_template .ver_m{display:none;}
.detail_view_template .detail_view_quick_link{position:absolute; right:40px; top:30px; z-index:9;min-width:100px;}
.detail_view_template .detail_view_quick_link.fixed{position:fixed; top:97px;}
.detail_view_template .detail_view_quick_link .bar{content:''; background-color:#333333; position:absolute; right:0; top:0; height:70px; width:1px; z-index:3;}
.detail_view_template .detail_view_quick_link a{display:block; position:relative; font-size:14px; color:#666666; text-align:right; border-top:1px solid #e9ebea; display:table; width:100%;}
.detail_view_template .detail_view_quick_link a span{display:table-cell; vertical-align:middle; height:70px; width:80px;  padding-right:20px;}
.detail_view_template .detail_view_quick_link a:first-child{border-top:0}
.detail_view_template .detail_view_quick_link a:after{content:''; position:absolute; right:0; top:0; bottom:0; width:1px; background-color:#e9ebea}
.detail_view_template .detail_view_quick_link a.active{color:#333333}
.detail_view_template .b_banner{background-color:#fcf4e7; height:170px; font-size:26px; color:#333333; }
.detail_view_template .b_banner .txt{padding:32px 0 25px 0}

.detail_view_template .section_wrap{position:relative;}
.detail_view_template .section_wrap span.block{display:block;}
.detail_view_template .section_wrap .df_cont{max-width:1194px; margin:0 auto; padding-top:30px; position:relative;}
.detail_view_template .section_wrap .df_cont .mark{display:inline-block;margin:0 auto;padding:0 10px; height:25px; line-height:25px; border:1px solid #b2b2b2; font-weight:bold; color:#666666; font-size:11px;}
.detail_view_template .section_wrap .df_cont .s_tit{ font-weight:normal;}

/* 제품특징 */	
.detail_view_template .dt_feature{padding-bottom:95px;}
.detail_view_template .dt_feature .s_tit{color:#555555; font-size:45px; line-height:54px; padding:35px 0 28px; position:relative; text-align:center;}
.detail_view_template .dt_feature .s_tit:after{content:''; height:1px; width:40px; background-color:#e9ebea; position:absolute; left:50%; bottom:0; margin-left:-20px;}
.detail_view_template .dt_feature .s_txt{color:#555555; font-size:20px; padding-top:24px;}
.detail_view_template .dt_feature .feature_info{color:#555555; font-size:16px; text-align:left; line-height:26px; position:relative;}	
.detail_view_template .dt_feature .feature_info .pd_img{position:absolute; right:0; top:96px}
.detail_view_template .dt_feature .feature_info .feature_item{padding-top:88px; min-height:496px;}
.detail_view_template .dt_feature .feature_info .feature_item li{margin-top:37px; padding-left:125px; position:relative;}
.detail_view_template .dt_feature .feature_info .feature_item li:first-child{margin-top:0}
.detail_view_template .dt_feature .feature_info .feature_item li strong{display:block; font-size:26px; color:#333333; line-height:36px; font-weight:normal; padding-bottom:19px;}
.detail_view_template .dt_feature .feature_info .feature_item li .icon{position:absolute; left:0; top:7px}
.detail_view_template .dt_feature .feature_info .feature_item li em.footnote{color:#bd953b}
.detail_view_template .dt_feature .feature_info .footnote_wrap{overflow:hidden; border-top:1px solid #e5e5e5; margin-top:96px;}
.detail_view_template .dt_feature .feature_info .footnote_wrap .wrap{overflow:hidden;}
.detail_view_template .dt_feature .feature_info .footnote_wrap .cont{width:50%; float:left;}
.detail_view_template .dt_feature .feature_info .footnote_wrap .cont dl{margin-right:50px;}
.detail_view_template .dt_feature .feature_info .footnote_wrap .cont dt{color:#555555; font-size:14px; margin:23px 0 4px;}
.detail_view_template .dt_feature .feature_info .footnote_wrap .cont dd{color:#777777; font-size:14px; line-height:24px; text-indent:-10px; margin-left:10px;}
.detail_view_template .df_component .mark.ver_m{display:none;}

/* 공법ㆍ성분 */
.detail_view_template .df_component{padding-bottom:95px}
.detail_view_template .df_component .wrap{overflow:hidden;}
.detail_view_template .df_component .comp_info{float:left; width:570px;}
.detail_view_template .df_component .comp_info .s_tit{text-align:left; color:#333333; font-size:36px; padding:33px 0 47px}
.detail_view_template .df_component .comp_info .s_txt{text-align:left; color:#555555; font-size:16px; line-height:26px;}
.detail_view_template .df_component .comp_img{float:right; width:597px; margin-top:43px;}
.detail_view_template .df_component .comp_img img{width:100%;}
.detail_view_template .df_component .swiper-container{overflow:hidden; margin:0 0 0 -60px}
.detail_view_template .df_component .swiper-slide{width:358px !important; float:left; margin-left:60px; text-align:left;}
.detail_view_template .df_component .swiper-slide strong{display:block; color:#333333; font-size:22px; padding:13px 0 9px; font-weight:normal}
.detail_view_template .df_component .swiper-slide p{color:#555555; font-size:16px; line-height:26px}
.detail_view_template .df_component .swiper-slide .footnote{font-size:14px; color:#777777; line-height:24px; margin-bottom:9px;}
.detail_view_template .df_component .swiper-slide .img{width:358px}
.detail_view_template .df_component .swiper-slide .img img{width:358px; height:150px;}
.detail_view_template .df_component .notice{font-size:12px; color:#888888; text-align:right; margin:68px 0 14px 0}

.detail_view_template .df_component.type02 .swiper-container{text-align:center;}
.detail_view_template .df_component.type02 .swiper-container .swiper-wrapper{margin:0; display:inline-block; overflow:hidden;}
.detail_view_template .df_component.type02 .swiper-container .swiper-slide{}
.detail_view_template .df_component.type02 .notice{margin-right:208px;}

/* 사용법 */
.detail_view_template .df_use{padding-bottom:96px;}
.detail_view_template .df_use .s_tit{color:#333333; font-size:36px; text-align:left; padding-top:85px;}
.detail_view_template .df_use .item_wrap{overflow:hidden; margin-top:43px;}
.detail_view_template .df_use .item_wrap .use_item{float:left; width:505px; text-align:left; margin-left:92px;}
.detail_view_template .df_use .item_wrap .use_item:first-child{margin-left:0px;}
.detail_view_template .df_use .item_wrap .use_item{overflow:hidden;}
.detail_view_template .df_use .item_wrap .use_item strong{display:block; font-size:22px; color:#333333; font-weight:normal; padding:32px 0 8px;}
.detail_view_template .df_use .item_wrap .use_item p{font-size:16px; color:#555555; line-height:26px; letter-spacing:-0.01em}
.detail_view_template .df_use .item_wrap .use_item.single{position:relative; padding-left:482px; min-height:200px; margin-bottom:5px; width:auto;}
.detail_view_template .df_use .item_wrap .use_item.single .img{position:absolute; left:0; top:0;}
.detail_view_template .df_use ol{margin-top:47px;}
.detail_view_template .df_use ol li{text-align:left; margin-top:28px;}
.detail_view_template .df_use ol li:first-child{margin-top:0}
.detail_view_template .df_use ol li strong{color:#333333; font-size:22px; display:inline-block; vertical-align:middle; font-weight:normal;}
.detail_view_template .df_use ol li p{color:#555555; padding-top:9px;}
.detail_view_template .df_use ol li:before{content:''; display:inline-block; width:46px; height:19px; vertical-align:middle; margin:3px 6px 0 0;}
.detail_view_template .df_use ol li.tip1:before{background:url(../images/product/template/icon_tip01.gif) 0 0 no-repeat;}
.detail_view_template .df_use ol li.tip2:before{background:url(../images/product/template/icon_tip02.gif) 0 0 no-repeat;}
.detail_view_template .df_use ol li.tip3:before{background:url(../images/product/template/icon_tip03.gif) 0 0 no-repeat;}
.detail_view_template .df_use ol li.tip4:before{background:url(../images/product/template/icon_tip04.gif) 0 0 no-repeat;}

.detail_view_template .df_use ol.tip_type02 li:before{display:none;}
.detail_view_template .df_use ol.tip_type03 p{display:inline-block;}
.detail_view_template .df_use ol.tip_type03 li:before{margin-top:0}

/* 임상 */
.detail_view_template .df_clinic{position:relative;}
.detail_view_template .df_clinic .tct{background-color:#f0f0f0; padding-bottom:45px; position:relative;}
.detail_view_template .df_clinic .tct .s_tit{color:#000000; font-size:36px; padding-top:33px;}
.detail_view_template .df_clinic .clinic_list{text-align:center; margin:44px 0 28px;}

.detail_view_template .df_clinic .clinic_list .swiper-container {width: 100%; height: 100%; position: relative; z-index: 1; margin:0; overflow:hidden;}
.detail_view_template .df_clinic .clinic_list .swiper-wrapper{position: relative; width: 100%; height: 100%; z-index: 1; box-sizing: content-box; display:flex; display:-webkit-box; display: -ms-flexbox;}
.detail_view_template .df_clinic .clinic_list .swiper-slide{display:block; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; height: 100%; position: relative; float:none; margin:0;}
.detail_view_template .df_clinic .clinic_list .swiper-slide:first-child{padding-left:0}
.detail_view_template .df_clinic .clinic_list .swiper-slide:last-child{padding-right:0}
.detail_view_template .df_clinic .clinic_list .swiper-slide .item_wrap{position:relative;width:170px; height:170px; border-radius:100px; background-color:#fff; overflow:hidden; color:#333333; font-size:17px; cursor:pointer;}
.detail_view_template .df_clinic .clinic_list .swiper-slide .item_wrap strong.num{height:54px;color:#bd953b; font-size:36px !important; display:block; text-align:center; font-weight:normal;  padding:4px 0 0 0}
.detail_view_template .df_clinic .clinic_list .swiper-slide .item_wrap span{color:#888888;font-size:13px;display:block;position:relative;padding:2px 0;position: absolute;left: 0;width: 100%;bottom: 23px;box-sizing: border-box;padding: 0 20px;line-height: 1.2em;}
.detail_view_template .df_clinic .clinic_list .swiper-slide .item_wrap span:after{content:''; width:90px; height:1px; background-color:#888888; position:absolute; left:50%; bottom:-5px; margin-left:-45px;}

.detail_view_template .df_clinic .arr{z-index:9; position:absolute; width:24px; height:24px; background:#fff url(../images/shopping/img_detail_view_arr.gif) no-repeat; cursor:pointer; bottom:-25px; #eaeaea;}
.detail_view_template .df_clinic .swiper-button-next{right:30px; background-position:100% 0;}
.detail_view_template .df_clinic .swiper-button-prev{right:59px; background-position:0 0;}


.detail_view_template .df_clinic .layerpop_slider{position:absolute; left:0; width:100%; top:182px; overflow:hidden; height:0px; z-index:10}
.detail_view_template .df_clinic .layerpop_slider.open{border:1px solid #e5e5e5;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont{background-color:#fff; height:199px; padding:12px 9px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol{position:relative; height:100%; overflow:hidden;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li{position:absolute; left:100%; top:0; height:100%; width:100%; overflow:hidden;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li:first-child{left:0;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .hd{width:368px; background-color:#f9f9f9; height:199px; position:relative; float:left; margin-right:82px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .hd .txt{position:absolute; left:19px; top:15px; color:#000000; opacity:0.5; font-size:14px; font-weight:bold;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .hd .num{display:block; font-size:50px; color:#bd953b;  padding:40px 0 0 0}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .hd strong{color:#000000; font-size:30px; display:block; margin-top:-6px; font-weight:normal;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info{text-align:left; padding-top:53px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info .scroll_wrap{height:100px; overflow-y:scroll;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info .scroll_wrap .mCSB_scrollTools .mCSB_draggerRail{background-color:#e9ebea; width:2px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info .scroll_wrap .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:2px; border-radius:0; background-color:rgba(0,0,0,.4)}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info strong{font-weight:normal; color:#000000; font-size:22px; padding-bottom:14px; display:block;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info dl dt{color:#555555; font-size:16px; padding:17px 0 2px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info dl dt:first-child{padding-top:0;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont ol li .info dl dd{color:#888888; font-size:12px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont .btn_close{position:absolute; right:20px; top:20px}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont .btn_close img{width:22px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont .btn_arr{position:absolute; right:20px; bottom:20px}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont .btn_arr a{width:30px; height:30px; display:inline-block; vertical-align:middle; overflow:hidden; text-indent:-9999px; font-size:0}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont .btn_arr .next{background:url(../images/product/template/icon_arr_next.png) 0 0 no-repeat; margin-left:7px;}
.detail_view_template .df_clinic .layerpop_slider .layerpop_cont .btn_arr .prev{background:url(../images/product/template/icon_arr_prev.png) 0 0 no-repeat;}
.detail_view_template .df_clinic .bct .df_cont{padding-top:49px}
.detail_view_template .df_clinic .bct h3{font-size:30px; color:#333333; font-weight:normal; padding:0 0 32px;}
.detail_view_template .df_clinic .bct .clinic_tab{position:relative; overflow:hidden;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide{width:239px; position:relative; float:left;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a{display:block; height:46px; text-align:center; line-height:45px; font-size:16px; color:#777777; position:relative; z-index:3;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a:before,
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a:after{content:''; background-color:#e5e5e5; position:absolute; left:0;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a:before{width:100%; height:1px; top:0; padding-right:1px;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a:after{height:1px; width:100%; background-color:#e5e5e5;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a.active{z-index:5; color:#333333}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a.active:before{background-color:#999999; height:2px;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide a.active:after{background-color:#fff; bottom:0}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide:after{content:''; background-color:#e5e5e5; position:absolute; left:0; top:0; width:1px; height:100%;}
.detail_view_template .df_clinic .bct .clinic_tab .swiper-slide:first-child{width:238px;}

.detail_view_template .df_clinic .bct .clinic_tab:before,
.detail_view_template .df_clinic .bct .clinic_tab:after{content:''; position:absolute; background-color:#e5e5e5;}
.detail_view_template .df_clinic .bct .clinic_tab:before{width:1px; height:100%; top:0; right:0;}
.detail_view_template .df_clinic .bct .clinic_tab:after{width:100%; left:0; bottom:0; height:1px; }
.detail_view_template .df_clinic .bct .clinic_view{padding-bottom:97px; display:none; padding-top:4px;}
.detail_view_template .df_clinic .bct .clinic_view:first-child{display:block; border:1px solid red;}
.detail_view_template .df_clinic .bct .clinic_view ul{overflow:hidden; margin-left:-80px}
.detail_view_template .df_clinic .bct .clinic_view ul li{text-align:left; width:300px; margin-left:120px; float:left; margin-top:20px;}
.detail_view_template .df_clinic .bct .clinic_view ul li strong{color:#333333; font-size:18px; font-weight:normal; padding-bottom:4px; display:block;}
.detail_view_template .df_clinic .bct .clinic_view ul li p{color:#999999; font-size:12px; line-height:18px;}
.detail_view_template .df_clinic .bct #clinic_view01{display:block;}

.detail_view_template .df_clinic.max .arr{display:none;}     
.detail_view_template .df_clinic.max .clinic_list .swiper-wrapper{display:block;}
.detail_view_template .df_clinic.max .clinic_list .swiper-slide{display:inline-block; padding:0 13px; width:auto !important;}
.detail_view_template .df_clinic.max .clinic_list .swiper-slide:first-child{padding-left:0}
.detail_view_template .df_clinic.max .clinic_list .swiper-slide:last-child{padding-right:0}



/* 어워드 */
.detail_view_template .df_awards{margin-bottom:96px;}
.detail_view_template .df_awards{padding-top:100px; border-top:1px solid #e5e5e5; }
.detail_view_template .df_awards ul li{text-align:center; width:200px; display:inline-block; margin:0 58px; vertical-align:top;}
.detail_view_template .df_awards ul li .img img{width:200px;}
.detail_view_template .df_awards ul li strong{font-size:22px; color:#333333; font-weight:normal; padding:12px 0 0 0; display:block;}
.detail_view_template .df_awards ul li p{font-size:16px; color:#555555; margin-top:-1px}
.detail_view_template .df_awards.type02 ul{display:inline-block; vertical-align:top;}

/* 동영상 */
.detail_view_template .df_movie{margin-bottom:100px;}
.detail_view_template .df_movie iframe{width:1174px; height:660px;}

.detail_view_template .df_component .swiper-container .swiper-wrapper{transform: translate3d(0px, 0px, 0px) !important;}


/* width 960px 대응 */

#container.product{min-width: auto !important;}
#container.product .inner{min-width: auto !important; width:100% !important}
.detail_view_template .section_wrap .df_cont{min-width:auto !important;}
@media all and (max-width:1194px){
	.detail_view_template{width:960px; margin:0 auto;}
	.detail_view_quick_link{opacity:0}
	#wrap{min-width:960px;}
	.detail_view_template .dt_feature .feature_info{padding:0 20px;}
	.detail_view_template .dt_feature .feature_info .footnote_wrap .cont dt{word-break:keep-all;}
	.detail_view_template .dt_feature .feature_info .footnote_wrap .cont dd{word-break:keep-all;}
	
	.detail_view_template .df_component{padding:0 20px 95px}
	.detail_view_template .df_component .swiper-container{margin:0 0 0 -20px;}
	.detail_view_template .df_component .swiper-slide{width:293px !important; margin-left:20px;}
	.detail_view_template .df_component .swiper-slide .ver_w{display:none;}
	.detail_view_template .df_component .swiper-slide .ver_m{display:block}
	.detail_view_template .df_component .swiper-slide .img{width:100%}
	.detail_view_template .df_component .swiper-slide .img img{width:100%}
	.detail_view_template .df_component .swiper-slide strong{word-break:keep-all}
	.detail_view_template .df_component .swiper-slide .footnote{word-break:keep-all}
	.detail_view_template .df_component .swiper-slide p{word-break:keep-all}
	
	.detail_view_template .df_component .comp_info{width:50%}
	.detail_view_template .df_component .comp_img{width:50%}
	.detail_view_template .df_component.type02 .notice{margin-right:157px;}
	.detail_view_template .df_component .comp_info .s_tit{word-break:keep-all}
	.detail_view_template .df_component .comp_info .s_txt{word-break:keep-all}
	.detail_view_template .df_component .comp_info .s_txt span.block{display:inline !important}
	
	.detail_view_template .df_use .item_wrap .use_item{width:50%; margin:0;}
	.detail_view_template .df_use .item_wrap .use_item .img{padding-left:20px; padding-right:20px;}
	.detail_view_template .df_use .item_wrap .use_item strong{padding-left:20px; padding-right:20px; word-break:keep-all}
	.detail_view_template .df_use .item_wrap .use_item p{padding-left:20px; padding-right:20px; word-break:keep-all}
	.detail_view_template .section_wrap .df_cont .s_tit{padding-left:20px; padding-right:20px;}
	.detail_view_template .df_use ol{padding-left:20px; padding-right:20px;}
	.detail_view_template .df_use ol li p{ word-break:keep-all}
	.detail_view_template .df_clinic .clinic_list{margin-left:20px;}
	.detail_view_template .df_clinic .bct .clinic_view ul{margin-left:-20px; margin-right:20px;}
	.detail_view_template .df_clinic .bct .clinic_view ul li{width:280px; margin-left:40px;}
	.detail_view_template .df_clinic .bct .clinic_view ul li strong{word-break:keep-all}
	.detail_view_template .df_clinic .bct .clinic_view ul li p{word-break:keep-all}
}

@media all and (max-width:960px){
	.detail_view_template{width:800px; margin:0 auto;}
	#wrap{min-width:800px;}
	.detail_view_template .dt_feature .feature_info .pd_img{text-align:right;}
	.detail_view_template .dt_feature .feature_info .pd_img img{width:70%}
	.detail_view_template .df_awards ul li{margin:0 25px;}
	.detail_view_template .df_awards.type02 ul li{margin:0 58px;}
	.detail_view_template .df_component .swiper-slide{width:240px !important}
	.detail_view_template .df_use .item_wrap .use_item .img img{width:100%}
	
	.detail_view_template .df_clinic .bct .clinic_view ul{margin:0;}
	.detail_view_template .df_clinic .bct .clinic_view ul li{width:235px; margin-left:30px;}
}