@charset "UTF-8";
@import "base.css";
@import "fonts.css";

/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/

/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/

/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */
h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,th,td,pre,address,li,dt,dd {
	font-size: 140%;
}
	
h1 {} /* Header内で設定 */
h2 {}
h3 { margin-bottom: 15px; }
#index h3 { margin-bottom: 0;}
h4 { margin-bottom: 10px; }

a { color: #FF7F00; text-decoration:underline; }
a:hover,
a:active { color: #FFAE5E; text-decoration: none; }
a:visited {
	
}

p { margin: 0 0 1em; line-height: 1.6; }

dt img,dd img,li img { vertical-align: bottom; }

.section { padding: 20px 10px 20px 10px; }
.section .section { padding: 10px 0 10px 0 ; }

.image_l { float: left; margin: 0 16px 8px 0; }
.image_r { float: right; margin: 0 0 8px 16px; }

.case {
	margin: 10px 20px;
	background: url(../images/arrow_h.jpg) center 40% no-repeat;
}
.case-noimg { margin: 10px 20px; }

.caption {
	text-align: center;
	border-top: 2px solid #ccc;
	}

ul.totop {
	clear: both;
	padding-bottom: 20px;
}
ul.totop li {
	float: right;
	list-style: none;
}

.alpha { float: left; }
.beta { float: right; }

#content ul { margin: 0 20px 0 10px; }
#content ul li {
	list-style: none;
	background: url(../images/li_bg.jpg) 0 2px no-repeat;
	padding-left: 25px;
	}
#content ul.totop li { background: none; }

#content table {
	border-collapse: separate;
	border-spacing: 1px;
	border: 1px solid #70C6E2;
	width: 580px;
	font-size: 100%;
	margin: 15px 0;
	}

#content table th,
#content table td {
	padding: 10px 8px;
	border: 0;
	}

#content table th {
	background: #7EC8E6;
	color: #fff;
	width: 150px;
	font-weight: bold;
	}
#content table td {	background: #E0F2F9; }

.caution {
  color: #990000;
	font-weight: bold;
	}

#content .flow {
  background: url(../images/arrow_l.jpg) center bottom no-repeat;
	padding-bottom: 30px;
	margin-bottom: 20px;
	}
	
#content .flow_end {
	margin-bottom: 10px;
	}

.center { text-align: center; }
.right { text-align: right; }

.text01 { font-weight: bold; color: #14489B; }
#content dl dt { color: #0199CB ; font-weight: bold; } 

#main p.subtitle {
	color: #000;
	font-weight: bold;
	border-bottom: 1px dotted #999;
	line-height: 1.6;
	padding-left: 10px;
	padding-bottom: 3px;
	margin-bottom: 6px;
	}
* html #main p.subtitle { padding-left: 10px; }

#catch_img p { margin: 0; line-height: 1; }

.box {
  border: 1px solid #C9C9C9;
	padding: 5px;
	margin: 10px 0 ;
	}

/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/

html {
	background: none;
}

body {
  background: url(../images/body_bg.jpg) top repeat-x;
	color: #333;
	text-align: center;
}
#wrapper {
	width: 910px;
	margin: 0 auto;
  background: url(../images/wrapper_bg.jpg) 0 top repeat-y;
}
#main {
  padding: 20px 15px 20px 15px;
	margin: 0 0 0 0;
	text-align: left;
  background: url(../images/main_bg.jpg) top no-repeat;
}
#content {
	width: 600px;
	text-align: left;
  float: left;
}


/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/

#header {
	width: 910px;
	height: 168px;
	margin: 0 auto;
	text-align: left;
  background: url(../images/header_bg.jpg) 0 0 no-repeat;
}
#header h1,
#header #top {
  padding: 13px 0 0 0 ;
	margin-bottom: 8px;
	font-size: 100%;
	}
#header #header_area { margin-top:5px; }
#header #header_area .beta { margin-top:5px; }

/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/

#footer {
	clear: both;
  background: #14489B;
}
#footer #footer_area {
  width: 910px;
	margin: 0 auto;
	background: #14489B url(../images/footer_bg.jpg) top no-repeat;
	padding-top: 30px;
	padding-bottom: 15px;
	}
#footer #footer_area .alpha img { margin-left: 5px; }

#footer address {	float: right; }
#footer address img {	margin-right: 5px; }

/*==========================================================================*/
/*                             gnavi                                  */
/*==========================================================================*/

#gnavi {
  width: 900px;
	height: 60px;
	margin-left: 5px;
}

#gnavi ul {
	margin: 0;
}
#gnavi ul li {
	float: left;
	list-style: none;
}
/*==========================================================================*/
/*                            Navigation                                    */
/*==========================================================================*/

#navi {
	float: right;
	width: 260px;
}

#navi dl,
#navi ul {
	margin: 0 0 0 0;
	text-align: left;
}

#navi dl dt,
#navi dl dd,
#navi ul li {
	list-style: none;
	margin: 0;
	vertical-align: top;
}
#navi dl dt { margin: 5px 0;	}
#navi dl dd { margin: 0 10px;	}
#navi dl dd.map { margin-bottom: 10px; }
#navi p.navi_ban { margin: 0 0 10px 0; }

#navi p.navi_ban_pc { margin: 10px 0; display: block; text-align: center;width: 260px;height: 65px;}
 p.navi_ban_sp { margin: 10px auto;display: none;}

#navi .navi_box {
  border: 5px solid #AFE3ED;
	padding: 5px;
	margin-top: 10px;
	}

#navi .navi_box ul { margin: 5px 0 10px 5px; }
#navi .navi_box ul li {
	list-style: none;
	background: url(../images/li_bg.jpg) 0 5px no-repeat;
	padding-left: 15px;
	}

#navi ul.nav_menu { margin-bottom: 10px; }

/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/

#content .dt_box {
  border: 1px solid #CCCCCC;
  border-bottom: none;
  background: #F5FDFF;
  padding: 5px 0 5px 10px;
	color: #14C3F2;
	margin: 10px 20px 0 20px;
	font-weight: bold;
  }
  
#content .dd_box {
  border: 1px solid #CCCCCC;
	background: #FFFFFF;
	color: #333333;
  border-top: 1px dotted #CCCCCC;
  padding: 10px 10px 10px 10px;
  margin: 0 20px 20px 20px;
  }


/* index
------------------------------------------------------------------------*/
#top_h2 {
	width: 910px;
	height: 305px;
	background: url(../images/index_h2_bg.jpg) no-repeat;
	box-sizing: border-box;
	text-align: right;
	padding: 168px 23px 0 0;
	color: #0f4794;
	font-weight: bold;
	font-size: 22px;	
	text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
}
#top_h2 span {
	display: block;
	font-size: 18px;
	padding-top: 7px;
	margin-right: -13px;
	font-weight: normal;color: #000
}
#index .section { padding: 0 0 10px 0; }
#index .h3 { margin-bottom: 15px; padding:0 !important; }

#index .greeting p { padding: 0 10px; }
#index .greeting_text {
  background: url(../images/index_greeting_bg.jpg) right 0 no-repeat;
	padding-right: 200px;
	}

#index #index_info {
  background: url(../images/index_info_bg.jpg) 0 0 repeat-y;
	
	}
#index #info_area {
  background: url(../images/index_info_bg02.jpg) 0 bottom no-repeat;
	padding: 0;
	padding-bottom:20px;
	}
#index #info_area p {
	line-height: 1;
	margin: 0;
	}
#index #tiny {
  margin: 0 20px;
	border: 1px dotted #999;
	}

#tiny table { border: none; background: none; width: 400px; }
#tiny table td { border: none; background: none;}


#index .text_deco {
  font-weight: bold;
	line-height: 2;
	margin: 10px;
	color: #14489B;
	}

/* pkup_tab */
#index p#original {
	padding: 0;
	width: 600px;
	height: 250px;
	clear: both;
	margin:0 0 20px 0;
	}

#index img#largeImg {
	display: block;
	width:600px;
	height: 250px;
	}

#index p.thumbs { margin: 0;
	display: table;
}
#index p.thumbs a {
	/* background: url(../images/pkup01_tab_off.jpg) top left no-repeat; */
	background: url(../images/thum_right_bg.jpg) top right no-repeat, url(../images/thum_left_bg.jpg) top left no-repeat;
	height: 57px;
	box-sizing: border-box;
	text-decoration: inherit;
	padding: 8px 6px 6px 6px;
	color: #ff8000;
	font-size: 10px;
	display: table-cell;
	width: 119px;
	border-right: 1px solid #fff;
	font-weight: bold;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
}
#index p.thumbs a:nth-child(3) {
	width: 126px;
}
#index p.thumbs a:last-child{
	border: 0;
}
#index p.thumbs a span {
	color: #010101;
	font-size: 14px;
	font-weight: bold;
	border-bottom: 4px solid #e7e7e7;
	padding-bottom: 4px;
	display: block;
	line-height: 19px;
}
#index p.thumbs a:nth-child(1),#pickup_list .item:nth-child(1) .inner .ttl span{
	color: #fd8105
}
#index p.thumbs a:nth-child(1):hover span{
	border-color: #fd8105
}
#index p.thumbs a:nth-child(2),#pickup_list .item:nth-child(2) .inner .ttl span{
	color: #03a5a8
}
#index p.thumbs a:nth-child(2):hover span{
	border-color: #03a5a8
}
#index p.thumbs a:nth-child(3),#pickup_list .item:nth-child(3) .inner .ttl span{
	color: #13bdf0
}
#index p.thumbs a:nth-child(3):hover span{
	border-color: #13bdf0
}
#index p.thumbs a:nth-child(4),#pickup_list .item:nth-child(4) .inner .ttl span{
	color: #0394cd 
}
#index p.thumbs a:nth-child(4):hover span{
	border-color: #0394cd
}
#index p.thumbs a:nth-child(5),#pickup_list .item:nth-child(5) .inner .ttl span{
	color: #254899
}
#index p.thumbs a:nth-child(5):hover span{
	border-color: #254899
}

#index p.thumbs img {
	float: left;
	display: block;
	width: 119px;
	margin: 0 1px 0 0;
	padding: 0;
	}
	
/*#pickup_list .item::before {
	position: relative;
	content: "";
	background: url(../images/frame_spc.jpg);
	padding: 6px;
}*/
#thums_list a:hover{
	cursor: pointer;
}
#pickup_list  {
	margin: 0 0 20px;
}
#pickup_list .item{
	display: none;
	padding: 6px;
	background: url(../images/frame_spc.jpg);	
}

#pickup_list .item.active{
	display: block;
}

#pickup_list .item .inner {
	background: #fff;
	border-radius: 3px;
	padding: 13px 60px;
}
#pickup_list .item .inner .img {
	float:left;
	margin:0 25px 0 0;
}
#pickup_list .item .inner .ttl {
	margin-bottom: 0
}
#pickup_list .item .inner .ttl span {
	/*font-size: 40px;*/
	font-size: 34px;
	color: #ff8001;
	margin-bottom: 10px;
	padding-bottom: 10px;
	background: url(../images/ttl_bg.jpg) repeat-x bottom;
	display: inline-block;
	box-sizing: border-box;
	width: 275px;
	line-height: 43px;
	margin-top: 10px;
	font-weight: normal;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
}
#pickup_list .item .inner .txt {
	color: #8b8b8b;
	line-height: 19px;
	font-size: 130%;
}
#pickup_list .item .inner .link{
	margin-bottom: 0
}
#pickup_list .item .inner .link a {
	width: 277px;
	height: 42px;
	padding: 9px 5px 0 15px;
	text-decoration: inherit !important;
	color: #3f3f3f !important;
	box-sizing: border-box;
	display: inline-block;
	border: 1px solid #d8d8d8;
	border-radius: 8px;
	background: #ffffff;
	background: -moz-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
	background: -webkit-linear-gradient(top, #ffffff 0%,#ebebeb 100%);
	background: linear-gradient(to bottom, #ffffff 0%,#ebebeb 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ebebeb',GradientType=0 );
}
#pickup_list .item .inner .link a.fix {
	padding-left: 8px;
	padding-right: 3px;
}
#pickup_list .item .inner .link a:hover {
	opacity: 0.7;
}
#pickup_list .item .inner .link span {
	background: url(../images/icon01.jpg) no-repeat left center;
	display: block;
	padding-left: 21px;
	font-size: 15px;
}

.bnr01 {	
	padding: 7px 6px;
	background: url(../images/frame_spc02.jpg);
}
.bnr01 .inner {
	background: #fff url(../images/bnr01_bg.jpg) right bottom no-repeat;
	border-radius: 1px;
	padding:5px 12px;
	box-shadow: 1px 1px 2px #89c9d2,-1px 1px 2px #89c9d2,-1px -1px 2px #89c9d2;
}
.bnr01 .inner .ttl {
	color: #51B7CE;
	font-weight: bold;
	background: url(../images/ttl_bg02.jpg) no-repeat bottom left;
	font-size: 22px;
	margin-bottom: 8px;
}
.bnr01 .inner .txt {
	margin-bottom: 0;
	font-size: 130%;
	text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
}

.mb0 {
	margin-bottom: 0
}
.mb10 {
	margin-bottom: 10px
}
.mb15 {
	margin-bottom: 15px
}
.mb20 {
	margin-bottom: 20px
}
/* staff
------------------------------------------------------------------------*/
#staff .alpha {	width: 200px;	}
#staff .beta {	/*width: 350px;*/	}

#staff .beta dl {
	width: 350px;
	line-height: 1.8;
	}
#staff .beta dt {
	width: 90px;
	float: left;
	clear: both;
	padding: 0;
	margin: 0;
	}
#staff .beta dd {
	width: 260px;
	float: left;
	padding: 0;
	margin: 0;
	}
#staff .beta .dd_80 { padding-left: 80px; }
#staff .beta .dd_90 { padding-left: 90px; }
#staff .beta .dt_130 { width: 130px; }
.dd_line { border-bottom: 1px dotted #CCCCCC; }
.line { border-top: 1px dotted #CCCCCC; width: 100% !important;line-height: 0;margin: 5px 0 !important}

#staff .beta dd dl { width: 270px; }

#staff .beta dd dt {
	width: 80px;
	float: left;
	clear: both;
	padding: 0;
	margin: 0;
	font-weight: normal;
	color: #666666;
	}
#staff .beta dd dd {
	width: 190px;
	float: left;
	padding: 0;
	margin: 0;
	}
	
#staff .bn_staff { margin-bottom:20px; }

/* treatment
------------------------------------------------------------------------*/
#treatment .alpha {	width: 200px;	}
#treatment .beta {	/*width: 350px;*/	}

/* caries
------------------------------------------------------------------------*/
#caries #content table { width: 570px; }

#caries #content .th01 { width: 150px; }
#caries #content .th02 {
	width: 420px;
	background: #FFBF00;
	}
#caries #content .td01 {
	width: 150px;
	text-align: center;
	color: #0199CB;
	font-weight: bold;
	}
#caries #content .td02 {
	width: 420px;
	vertical-align: top;
	background: #FFFAEE;
	}

#caries #content .td02 .bg_white {
	width: 400px;
	background: #FFFFFF;
	border: 1px solid #FFE299;
	padding: 5px 10px;
	margin-top: 10px;
	}
	
/* perio
------------------------------------------------------------------------*/
#perio #content table { width: 570px; }
#perio #content table th { width: 120px; }

#perio .bn_perio {
	margin: 15px 0 0 10px;
	padding: 0;
	}
	
#perio .bn_perio li {
	float: left;
	padding: 0 10px 0 0;
	background: none;
	width: 135px;
	}

#perio .bn_perio li.li_none { padding: 0; }

/* esthe
------------------------------------------------------------------------*/

#esthe .image_l02 { float: left; width: 275px; }
#esthe .image_r02 { float: right; width: 275px;  }

#esthe .case {
	margin: 10px 50px;
	}

#esthe .case02 {
	margin: 10px 0;
	background: url(../images/arrow_h02.jpg) center 40% no-repeat;
}

#esthe .case03 {
	margin: 10px 0;
	background: url(../images/arrow_h.jpg) center 40% no-repeat;
}

#esthe .image_l02 .image_l  {margin: 0 8px 8px 0; }

#navi .qr {
  text-align: center;
  margin: 20px 0 0 0;
}
.red{color:#FF0000;}

#index .index_text {
	border: 1px dashed#CCC;
	padding: 20px;
	width: 95%;
	margin : 0 auto 20px auto;
	text-align: center;
}
#index .index_text h3 {
	font-size: 24px;
	margin-bottom: 20px;
	color: #51B7CE;
	font-weight: 600;
}
.fix_h4 span{
	display: none;
}