/*
Author: PrankPlan
Author URI: https://prankplan.jp
Description: タカシマ歯科 LP
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
html{
	color: #484848;
	font-size: 16px;
	font-weight: normal;
	font-family: Meiryo, arial, clean, verdana, "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", Osaka, sans-serif;
	line-height: 1.5;
	text-align: left;
}
#wrapper{
	width: 100%;
	min-width: 1180px;
	height: 100%;
}
.section{
	width: 100%;
	min-width: 1180px;
	height: 100%;
	position: relative;
}
.container{
	width: 1180px;
	padding: 0 40px;
	height: auto;
	margin: 0 auto;
}
img{vertical-align: bottom;}
.sp_only{display: none;}
.clear{clear:both;}
/* --------------------- font --------------------- */
.cta_box,
h2,
h3,
h4,
.price caption,
.access_box a,
.fcta_container{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
/* --------------------- font --------------------- */
/* --------------------- color --------------------- */
.gold_dark{color:#a5944e;}
.gold{color:#ac9817;}
.gold_light{color:#d2c870;}
.gold_gradation{
	color: #d2c870;
	position: relative;
	z-index: 1;
}
.gold_gradation::before{
	vertical-align: middle;
	z-index: 10;
	position: absolute;
	top: -12px;
	left: 0;
	display: inline-block;
	color: #a5944e;
	-webkit-mask-image:-webkit-linear-gradient(top, rgba(0,0,0,1), rgba(0,0,0,1) 23%,rgba(0,0,0,0) 47%, rgba(0,0,0,0) 53%, rgba(0,0,0,1) 77%,rgba(0,0,0,1));
	mask-image:linear-gradient(top, rgba(0,0,0,1), rgba(0,0,0,1) 23%,rgba(0,0,0,0) 47%, rgba(0,0,0,0) 53%, rgba(0,0,0,1) 77%,rgba(0,0,0,1));
}
#second .gold_gradation.one::before{content: '追加料金は一切ありません';top:-10px;left:-0.1px;}
#second .gold_gradation.two::before{content: '10年無料保証';top:-10px;left:-0.1px;}
#third .gold_gradation.one::before{content: '6';top: -20px;}
#third .gold_gradation.two::before{content: 'つのコンセプト';top: -10px;left:-0.1px;}
#fourth .gold_gradation::before{content: '治療の流れ';}
#fifth .gold_gradation::before{content: '院長紹介';}
#sixth .gold_gradation::before{content: '医院のご案内';}
/* --------------------- color --------------------- */
h2{
	text-align: center;
}
/* --------------------------------------- header --------------------------------------- */
header{
	width: 100%;
	height: 100%;
	background: #f5f2eb;
}
.header_intro{
	font-size: 12px;
	padding: 10px 0;
	background: #d2c870;
	font-weight: bold;
	color: #484848;
	border-bottom: 2px solid #fff;
}
.header_box{
	padding: 15px 0 15px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.header_box h1 img{
	width: 240px; 
	height:auto;
}
.header_box > p{
	margin-left: auto;
	margin-right: 50px;
	font-size: 14px;
}
.cta_box{
	background: linear-gradient(45deg ,#a5944e, #b9ab36, #a5944e);
	color: #fff;
}
.cta_outer{
	margin: 5px;
	padding: 5px 10px;
	border: 1px solid #fff;
}
.cta_box p{
	font-weight: bold;
	font-size: 12px;
	text-align:center;
	margin-bottom: 4px;
}
.cta_box img{
	margin-bottom: 7px;
	display: inline;
	width: 26px;
	height: 26px;
}
.cta_box i{
	font-size: 26px;
	font-weight: bold;
	margin-right: 0px;
}
.cta_box span{
	font-size: 30px;
	font-weight: bold;
}
/* --------------------------------------- header --------------------------------------- */

/* --------------------------------------- first --------------------------------------- */
#first{
	border-top: 2px solid #fff;
}
#first img{
	width: 100%;
	height: auto;
}
/* --------------------------------------- first --------------------------------------- */

/* --------------------------------------- second --------------------------------------- */
#second{
	padding: 60px 0 80px;
}
#second h2{
	font-size: 26px;
	margin-bottom: 30px;
	font-weight: bold;
}
#second h2 span.one{
	font-size: 40px;
	vertical-align: -6px;
}
table.price{
	width: 100%;
	margin-bottom: 20px;
}
.price caption{
	font-size: 20px;
	text-align: center;
	margin-bottom: 20px;
}
.price th:first-of-type,
.price td:first-of-type{
	width: 10%;
}
.price th,
.price td{
	border: 2px solid #f5f2eb;
	text-align: center;
	padding: 20px 0;
	width: 22.5%;
}
.price th{
	background: #a59a67;
	font-weight: bold;
	color: #fff;
	font-size: 14px;
}

.price th img{
	width: 80px;
}
.price td{
	border: 2px solid #f5f2eb;
	border-bottom: none;
}
.price td img{
	width: 80px;
}
.price_inner td{
	background: rgb(245, 242, 235);
	border-right: 2px solid #fff;
	border-top: none;
	font-size: 14px;
}
.price_inner td:last-of-type{
	border-right: 2px solid #f5f2eb;
}
.price_item{
	font-weight: bold;
	color: #900;
	font-size: 18px;
	letter-spacing: 1px;
}
.price_number{
	font-size: 40px;
	text-shadow: 1px 1px 0 #900,1px -1px 0 #900,-1px 1px 0 #900,-1px -1px 0 #900; 
}
.inner_header{
	font-weight: bold;
	font-size: 16px;
	color: #900;
}
.careful{
	font-size: 12px;
}
.security{
	padding-top: 60px;
	width: 800px;
	margin: 0 auto;
}
#second h2 span.two{
	font-size: 40px;
	font-weight: bold;
	vertical-align: -2px;
}
.security p{
	font-size: 14px;
}
.security img{
	width: 800px;
	height: auto;
	margin: 30px auto 0;
	display: block;
}
.guarantee{
	padding-top: 60px;
}
.guarantee_inner{
	display: flex;
	justify-content: center;
	align-items: center;
}
.guarantee_img1{
	width: 180px;
	margin-right: 120px;
}
.guarantee_img2{
	width: 130px;
}
/* --------------------------------------- second --------------------------------------- */

/* --------------------------------------- third --------------------------------------- */
#third{
	padding-bottom: 60px;
	background-blend-mode: screen ;
	background-image: url('../img/bg.jpg') ;
	background-color: rgba(255, 255, 255, .6);
}
#third h2{
	font-size: 26px;
	vertical-align: middle;
	letter-spacing: 2px;
	padding: 30px 0 20px;
}
#third h2 span{
	vertical-align: middle;
}
#third h2 span.one{
	font-size: 80px;
	font-weight: bold;
	vertical-align: -15px;
}
#third h2 span.two{
	font-size: 40px;
	font-weight: bold;
	vertical-align: -7px;
}
#third .container > p{
	margin: 0 auto 50px;
	width: 900px;
	text-align: justify;
}
.concept_wrap{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.concept_box{
	background: #f0ebdf;
	padding: 10px;
	width:  540px;
	margin-bottom:20px; 
}
.concept_outer{
	border: 1px solid #fff;
	padding: 15px;
	overflow: hidden;
}
.concept_img{
	float: left;
	width: 220px;
}
.concept_img img{
	width: 100%;
}
.concept_inner{
	float: right;
	width: 253px;
	height: 165px;
	text-align: justify;
	padding: 5px;
}
.concept_inner h3{
	font-size: 18px;
	text-align: center;
	padding-bottom: 5px;
	margin-bottom: 8px;
	border-bottom: 1px solid #a5944e;
}
.concept_inner p{
	font-size: 16px;
	height: 118px;
	display: flex;
	align-items: center;
	line-height: 1.5;
}
/* --------------------------------------- third --------------------------------------- */

/* --------------------------------------- fourth --------------------------------------- */
#fourth{
	background: #f5f2eb;
	padding: 60px 0;
}
#fourth h2{
	font-weight: bold;
	font-size: 50px;
}
.flow_box,
.flow_box2{
	width: 100%;
	position: relative;
	height: 220px;
	margin: 50px 0;
}
.flow_box .flow_img,
.flow_box2 .flow_img{
	width: auto;
	height: 220px;
	position: absolute;
}
.flow_box .flow_img{
	top: 0;
	left: 0;
}
.flow_img img{
	width: auto;
	height: 100%;
}
.flow_outer{
	position: relative;
	width: 770px;
	height: 220px;
	margin: 0 auto;
	z-index: 10;
	text-align: justify;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.flow_box .flow_outer{
	margin-left: 330px
}

.flow_box2 .flow_outer{
	margin-right: 330px;
}
.flow_box2 .flow_img{
	top: 0;
	right: 0;
}
.flow_inner{
	padding: 20px 30px;
}
.flow_inner h3{
	font-size: 24px;
	margin-bottom: 15px;
	font-weight: bold;
}
.flow_inner p{
	font-size: 16px;
}
/* --------------------------------------- fourth --------------------------------------- */

/* --------------------------------------- fifth --------------------------------------- */
#fifth{
	padding: 60px 0;
}
#fifth h2{
	font-weight: bold;
	font-size: 50px;
	margin-bottom: 60px;
}
#fifth h3{
	font-size: 26px;
	margin-bottom: 20px;
}
#fifth h4{
	font-size: 22px;
	margin: 30px 0 15px 20px;
	font-weight: bold;
}
.awardwrap_left{
	 float: left;
	 width: 760px
}
.awardwrap_left > img{
	width: 100%;
	margin-bottom: 30px;
}
.awardwrap_left > p{
	margin-bottom: 15px;
	line-height: 1.75;
	margin-left: 20px;
}
.awardwrap_left h3:last-of-type{
	margin-top: 40px;
}
.awardwrap_left table{
	margin-left: 20px;
}
.awardwrap_left table tr *{
	padding: 10px 50px 10px 0;
}
.awardwrap_right{
	float: right;
	width: 290px;
}
.award_box img,
.award_box2 img{
	border: 1px solid #a5944e;
}
.award_box img{
	width: 130px;
	margin-bottom: 26px;
}
.award_box img:nth-child(odd){
	margin-right: 24px;
}
.award_inner{
	display: inline-block;
	width: 130px;
	height: auto;
}
.award_inner img{
	width: 120px;
	margin-left: 5px;
}
.award_inner img:nth-child(odd){
	margin-right: 0;
	margin-bottom: 10px;
}
.awardwrap_right > p{
	font-size: 14px;
	text-align: justify;
	margin: 30px 0 26px;
}
.award_box2 img{
	width: 100%;
	margin: 26px 0;
}
/* --------------------------------------- fifth --------------------------------------- */

/* --------------------------------------- sixth --------------------------------------- */
#sixth{
	background: #f5f2eb;
	padding: 60px 0;
}
#sixth h2{
	font-weight: bold;
	font-size: 50px;
	margin-bottom: 40px;
}
.panorama_wrap{
	margin-bottom: 30px;
	position: relative;
}
.panorama_wrap p{
	font-size: 14px;
	margin-bottom: 20px;
}
.panorama_wrap iframe{
	width: 100%;
	height: 400px;
	vertical-align: bottom;
	pointer-events: none;
}
.ifr_inner{
	position: absolute;
	top: 111px;
	left: 0;
	width: 100%;
	height: 400px;
	transform: translate(0, 0) !important;
}
.map iframe{
	width: 100%;
	height: 300px;
	margin-bottom: 20px;
}
#sixth h3{
	font-size: 26px;
	margin: 10px 0;
	font-weight: bold;
}
.access_box{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.access_box p{
	letter-spacing: .5px;
}
.access_box a{
	display: block;
	width: 200px;
	height: 50px;
	background: linear-gradient(45deg ,#a5944e, #b9ab36, #a5944e);
	color: #fff;
	font-weight: bold;
	text-align: center;
	line-height: 38px;
	padding:5px;
	transition: .3s all;
}
.access_box a span{
	display: block;
	border: 1px solid #fff;
}
.access_box a:hover{
	letter-spacing: .5px;
}
.guide_wrap{
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.about th{
	padding: 10px 30px 0 0;
}
.about td{
	padding: 10px 20px 0 0;
}
.hours table{
	border: 1px solid #f5f2eb !important;
}
.hours th{
	padding: 10px 20px;
	font-weight: bold;
}
.hours td{
	padding: 10px 14px;
}
.hours thead th{
	border-left: 1px solid #a59a67;
	background: #a59a67;
	border-top: 1px solid #a59a67;
	border-bottom: 1px solid #a59a67;
	text-align: center;
	color: #fff;
}
.hours thead td{
	color: #fff;
	background: #a59a67;
	text-align: center;
	font-weight: bold;
	border-top: 1px solid #a59a67;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #a59a67;
	border-left: 1px solid #fff;
}
.hours thead td:last-child{
	border-right: 1px solid #a59a67;
}
.hours tbody th {
	background: #fff;
	border: 1px solid #f5f2eb;
	border-left: 1px solid #fff;
	font-weight: normal;
}
.hours tbody td {
	background: #fff;
	border: 1px solid #f5f2eb;
}
.hours tbody td:last-child{
	border-right: 1px solid #fff;
}
.hours > p{
	font-size: 14px;
	margin-top: 10px;
}
/* --------------------------------------- sixth --------------------------------------- */

/* --------------------------------------- footer --------------------------------------- */
footer{
	padding: 60px 0;
	text-align: center;
}
.fcta_wrap{
	background: linear-gradient(45deg ,#a5944e, #d2c870, #a5944e);
	color: #fff;
	padding: 10px;
	margin:0 auto 50px;
	width: 800px;
}
.fcta_container{
	border: 1px solid #fff;
	padding: 20px 10px;
}
.fcta_container h2{
	font-size: 46px;
	font-weight: bold;
	letter-spacing: 1px;
	text-shadow: 1px 1px 2px #484848,-1px -1px 2px #484848,-1px 1px 2px #484848,1px -1px 2px #484848;
}
.fcta_container > p{
	margin-bottom: 20px;
}
.fcta_box{
	display: flex;
	justify-content: space-around;
}
.fcta_inner1 h3{
	font-size: 26px;
	font-weight: bold;
}

.fcta_inner2{
	font-size: 40px;
	font-weight: bold;
	letter-spacing: 1px;
	text-shadow: 1px 1px 2px #666,-1px -1px 2px #666,-1px 1px 2px #666,1px -1px 2px #666;
}
.fcta_inner2 i{
	font-size: 30px;
}
/* --------------------------------------- footer --------------------------------------- */