/*=================================================
		00. 공통
=================================================*/
.n-btn-wrap{
	border:1px solid #333;
	padding:10px 25px;
	width:150px;
	margin-top:20px;
	display:inline-block;
	cursor:pointer;
}
.b-btn-wrap{
	border:1px solid #fff;
	padding:10px 25px;
	width:150px;
	margin-top:20px;
	display:inline-block;
	cursor:pointer;	
}
.m-btn-wrap{
	position:absolute;
	top:620px;
	left:400px;
	border:1px solid #fff;
	padding:10px 25px;
	width:150px;
	margin-top:20px;
	display:inline-block;
	cursor:pointer;	
}
.m-btn-wrap:hover,.m-btn-wrap:active,.m-btn-wrap:visited{
	font-weight:700;
}
.b-btn-wrap:hover,.b-btn-wrap:active,.b-btn-wrap:visited{
	font-weight:700;
}
.n-btn-wrap:hover,.n-btn-wrap:active,.n-btn-wrap:visited{
	font-weight:700;
}
.section-title{
	margin-bottom:24px;
	font-size:30px;
	font-weight:400;
	line-height:1.5;
}
.section-subtitle{
	margin-bottom:10px;
	font-size:24px;
}
.section-desc{
	font-size:15px;
}
.btn1{
	display:inline-block;
	width:230px;
	height:60px;
	border-radius:30px;
	border:none;
	color:#fff;
	font-size:25px;
}
button:hover{
	color:#fff;
}
.btn1:hover{
	color:#fff;
}
.btn1 span{
	font-weight:700;
}
.blue-btn{
	background-color:#039AC6;
	margin-right:5%
}
.gray-btn{
	background-color:#A1A1A1;
}
.white-btn{
	background-color:#fff;
}
/*=================================================
		00. 메인 네비게이션
=================================================*/
/*=================================================
		00. 푸터
=================================================*/

footer .container{
	padding:20px 0 0 0 ;
}

/*=================================================
		00. 헤더
=================================================*/

/*=================================================
		01. implant
=================================================*/
#implant .item-wrap-left{
	padding-right:30px;
}

#implant .item-wrap{
	padding-left:30px;
}

#implant .item-wrap-left .item-title{
	background-color:#444;
	font-size:54px;
	font-weight:bold;
   color: transparent;
	text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
	-webkit-text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
	-moz-text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
	-o-text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
	-ms-text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
	
	background-clip: text;
   -webkit-background-clip: text;
   -moz-text-fill-color: transparent;
   -o-background-clip: text;
   -ms-text-fill-color: transparent;
    margin-bottom:10px;
}

#implant .item-wrap-left .item-subtitle{
	font-size:64px;
	font-weight:500;
}

#implant .item-wrap-left .item-subtitle span{
	font-size:150px;
	font-weight:900;
	font-family:"Open Sans Hebrew";
	color:#039AC6;
}

#implant .separator{
	width:100%;
	background-color:#D2D2D2;
	color:transparent;
	display:block;
	box-shadow: inset rgba(255,255,255,0.5) 0px 3px 3px;
	-webkit-box-shadow: inset rgba(255,255,255,0.5) 0px 3px 3px;
	-o-box-shadow: inset rgba(255,255,255,0.5) 0px 3px 3px;
	-ms-box-shadow: inset rgba(255,255,255,0.5) 0px 3px 3px;
	-moz-box-shadow: inset rgba(255,255,255,0.5) 0px 3px 3px;
}

#implant .item-wrap-left .ratio-content{
	background-size:contain;
}

#implant .implant-inc-wrap .item-wrap-left .ratio-box:before{
	padding-top:15%;
}

#implant .implant-inc-wrap .item-wrap .ratio-box:before{
	padding-top:50%;
}

#implant .implant-inc-wrap .item-wrap-left .item-subtitle{
	line-height:0.7;
}

/*=================================================
		02. insurance
=================================================*/
#insurance{
	padding:10% 0;
}
#insurance .ratio-box:before{
	padding-top:30%;
}
#insurance .section-title-wrap .section-title{
	text-align:left;
	font-weight:500;
}
#insurance .section-desc{
	font-size:18px;
}

/*=================================================
		02. process
=================================================*/
#process{
	padding:70px 0 0 0;
}
#process .top{
	display:inline-block;
	text-align:center;
}
#process .top .bg{
	background-size:100%;
}
#process .bottom .ratio-box:before{
	padding-top:10%;
}
#process .bottom{
	margin:0;
}
#process .bottom .bg{
	background-color:#039ac6;
	opacity:0.7;
	background-size:inherit;
	margin:0;
}
#process .bottom .item-img{
	padding:3% 0;
	background: rgba(1, 156, 196, 0.6);
}

/*=================================================
		03. info
=================================================*/
#info{
	padding:100px 0 0 0 ;
}
#info .item-wrap{
	margin:0;
}
#info .container{
	padding:0 4%;
}
.info-inc-wrap .item-subtitle{
	font-size:14px;
	color:#039AC6;
	font-weight:900;
	font-family:"Open Sans Hebrew";
	margin:0 0 0 0;
}
#info .ratio-content{
	cursor:pointer;
}
#info .text-left .bg{
	height:300px;
	padding:10%;
	display:block;
}
#info .info-inc-wrap .text-left .bg:hover{
	border:10px solid #a1a1a1;
	color:#fff !important;
}
#info .text-left span{
	font-weight:700;
}

/* layer */
#info .bg .layer-bg{
	background-color:#039AC6 !important;
}
#info .bg .layer{
	top:0;
	left:0;
	width:100%;
	height:100%;
	position:absolute;
	opacity:0;
	border:10px solid #a1a1a1;
	color:#fff !important;
}
#info .bg .layer .white-btn{
	top:80%;
	left:60%;
	position:absolute;
}
#info .bg:hover .layer-bg{
	opacity:0.6;
}
#info .bg:hover .layer-content{
	opacity:1;
}
#info .bg:hover .item-subtitle{
	color:#fff;
}
#info .btn1{
	width:100px;
	height:30px;
	border-radius:30px;
	border:none;
	color:#111;
	font-size:13px;
	font-weight:600;
	cursor:pointer;
}
#info .btn1 i{
	color:#039AC6;
}
/*=================================================
		04. contact
=================================================*/
#contact{
	padding:0;
}
#contact .container{
	padding:0 4% 4% 4%;
}

#contact .item-wrap-top .bg{
	padding:3%;
}
#contact .item-wrap{
	margin:0;
}

#contact .item-title{
	font-size:36px;
	color:#fff;
	display:inline-block;
	width:30%;
	height:60%;
	border-right:1px solid #fff;
	float:left;
	padding:3% 25px;
}
#contact .item-content{
	display:inline-block;
	float:left;
	padding:1% 25px;
	color:#fff;
	font-size:16px;
	width:70%;
}
#contact table .right .ratio-box.ratio2_1:before{
	padding-top:68.5%;
}

#contact .item-wrap-bottom .ratio-content{
	padding:11%;
}
#contact .adress-wrap{
	height:126px;
	padding:6%;
	font-size:18px;
	color:#fff;
	background-color:#245599;
	position:relative;
	bottom:0;
}
#contact table{
	width:100%;
}
#contact tr{
	width:100%;
}
#contact th{
	width:50%;
	height:100%;
}
#contact .item-title-box{
	width:100%;
	height:65%;
	display:inline-block;
}
#contact .kakao-talk{
	width:100%;
	height:35%;
	position:relative;
	display:inline-block;
	font-size:20px;
	font-weight:600;
}
#contact .kakao-talk span{
	font-size:30px !important;
}
#contact .kakao-talk-call{
	display:inline-block;
	width:40%;
	background-color:#B7B7B7;
	padding:2%;
}
#contact .kakao-img{
	width:59%;
	display:inline-block;
	position:relative;
	background-color:#FBE300;
	padding:2%;
}
#contact .kakao-img:hover{
	color:#fff;
}
#contact .kakao-img img{
	position:absolute;
	width:60px;
	right:0;
	top:0;
	margin-top:5%;
	margin-right:2%;
}
#contact .item-wrap-top .ratio-box:before{
	padding-top:60%;
}
#contact .item-wrap-bottom .ratio-box:before{
	padding-top:33%;
}
#contact .item-wrap-top span{
	font-weight:700;
	font-size:36px;
}
#contact .item-content span{
	font-size:14px;
}
#contact .btn2{
	width: 80px;
	height: 20px;
	border-radius: 20px;
	border: none;
	color: #111;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
}
#contact .banner-box{
	background-color:#ededed;
	height:150px;
	width:100%;
	padding:2%;
}
#contact .banner-box div:first-child{
	padding-left:5%;
}
#contact .banner-box div:last-child{
	padding-right:5%;
}
#contact .banner-box .box{
	display:table-cell;
	padding:1% 1%;
}
#contact .banner-box .box img{
	margin-bottom:10px;
}
/*=================================================
		04. 미디어쿼리
=================================================*/
/*****#####===== 미디어 쿼리 =====#####*****/


/***** md *****/
@media (min-width: 992px) and (max-width: 1199px){
	.item-subtitle{
		font-size:22px;
	}
	
	.btn1{
		width:180px;
	}
	
	#contact .item-wrap-top .ratio-box:before{
		padding-top:67%;
	}
	/*****#####===== insurance =====#####*****/
	
	#implant .item-wrap .item-content p{
		margin-bottom:15px;
	}
		#contact table .right .ratio-box.ratio2_1:before{
		padding-top:67.5%;
	}
	#contact .adress-wrap{
		height:145px;
	}
	#contact .kakao-talk-call{
		width:39%;
	}
}
/***** sm *****/
@media (min-width: 768px) and (max-width: 991px){
	#implant .item-wrap img{
		margin:0;
	}
	#implant .item-wrap{
		padding-top:60px;
	}
	#process .bottom .item-img{
		padding:3% 3%;
	}
	
	#info .text-left .bg{
		height:220px;
	}
	#info .bg .layer .gray-btn{
		left:50%;
	}
	#info .item-title,#info .item-title span{
		font-size:21px;
	}
	#info .item-content, #info .item-content span{
		font-size:12px;
	}
	#contact .item-wrap-top .ratio-box:before{
		padding-top:70%;
	}
	#contact .item-title{
		font-size:21px;
		padding:28px 20px;
	}
	#contact .item-title span{
		font-size:21px;
	}
	#contact .item-content{
		font-size:12px;
	}
	#contact .adress-wrap{
		font-size:15px;
	}
	#contact table .right .ratio-box.ratio2_1:before{
		padding-top:68.3%;
	}
	#contact .kakao-talk-call{
		width:39%;
	}
	#contact .kakao-talk span{
		
		font-size:23px !important;
	}
	#contact .kakao-talk{
		font-size:16px !important;
	}
	
}

/***** xs *****/
@media (max-width: 767px){

	#implant .item-wrap-left{
		padding:0
	}
	#implant .item-wrap-left .item-title{
		font-size:30px;
	}
	.item-subtitle {
		font-size: 16px;
		margin-top: 20px;
	}
	.item-content {
	    font-size: 13px;
	    font-weight: 500;
	}
	#implant .item-wrap-left .item-subtitle{
		font-size:55px;
	}
	#implant .item-wrap{
		padding-top:30px;
	}
	.btn1{
		font-size: 14px;
	    width: 130px;
	    height: 40px;
	    border-radius: 30px;
	}

	#implant .item-wrap{
		padding:60px 0 0 0;
	}
	#insurance .section-title-wrap .section-title{
		font-size:20px;
	}
	#insurance .section-desc{
		font-size:15px;
	}
	#insurance img{
		width:80%;
	}
	#process .bottom .item-img{
			padding:3% 3%;
	}
	#info .text-left .bg{
		height:150px;
	}
	#info .info-inc-wrap .item-subtitle{
		font-size:10px;
	}
	#info .item-title,#info .item-title span{
		font-size:18px;
	}
	#info .item-content, #info .item-content span{
		font-size:12px;
	}
	#contact .adress-wrap{
		font-size:10px;
	}
	#contact .item-wrap-top .ratio-box:before{
		padding-top:77%;
	}
	#contact .item-wrap-bottom .ratio-box:before{
		padding-top:35%;
	}
	#contact .item-wrap-bottom .ratio-content{
		padding:12% 7%;
	}
	#contact .item-title{
		font-size:20px;
		padding:10px 5px;
		width:20%;
	}
	#contact .item-content span{
		font-size:13px;
	}
	#contact .item-title span{
		font-size:20px;
	}
	#contact .item-content {
	    padding: 5px 5px;
	    font-size:15px;
	    width:80%;
	}
	#contact .btn1{
		font-size: 10px;
	    width: 80px;
	    height: 20px;
	    border-radius: 15px;
	}
	#contact .btn3{
		width:180px;
		height:40px;
		border-radius:30px;
		font-size:16px;
		color:#fff;
	}
	#contact .adress-wrap{
		height:70px;
	}
	#contact .kakao-talk-call{
		width:39%;
	}
	#contact .kakao-talk span{
		
		font-size:23px !important;
	}
	#contact .kakao-talk{
		font-size:16px !important;
	}
	.implant-inc-wrap .section3 table th{
		text-align:center;
		margin-bottom:10px;
	}
	
	.implant-inc-wrap .section2 .item-wrap-bottom{
		text-align:left;
	}
	.m-btn-wrap {
	    position:absolute;
	    top:80%;
	    left:5%;
	}	
}
