﻿@charset "utf-8";

body {
	margin: 0;
	padding:0;
	background-color: #fff;
	font-size: 14px;
	line-height: 160%;
	color: #333;
	font-family: "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

img {
	border: 0;
	vertical-align: top;
}

.overflow {
	overflow:hidden;
	/zoom:1;
}
.left {
	float: left;
}
.right {
	float: right;
}

.rollover {
}


/*clearfix**************************/
.clearfix:after {  
    visibility: hidden;
    display: block;　
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
/* clearfix for ie7 */
.clearfix{
    display: inline-block;
}
.clearfix {
    display: block;
}
/*clearfix End************************/



 /*  リンク  */
a:link    { color: #999; text-decoration: underline; }
a:visited { color: #999; text-decoration: underline; }
a:hover   { color: #ccc; text-decoration: underline; cursor:pointer; }
a:active  { color: #ccc; text-decoration: underline; }
 
 
/*  共通  */
.contents {
	width: 960px;
	margin: 0 auto;
}
h2 {
	background: url(../images/h2_bg.png) repeat-x;
	width:100%;
}

table.pickup {
	border-top: 1px solid #d1c0a5;
	border-left: 1px solid #d1c0a5;
}
table.pickup th {
	background-color: #d1c0a5;
	color: #fff;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #d1c0a5;
	text-align: center;
	padding: 10px;
}
table.pickup th.line {
	border-bottom: 1px solid #d1c0a5;
}
table.pickup td {
	border-bottom: 1px solid #d1c0a5;
	border-right: 1px solid #d1c0a5;
	text-align: center;
}
hr {
    border: none;
    border-top: solid 1px #ccc;
    height: 1px;
    color: #ccc;
}
a:hover img.opacity {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -moz-opacity: 0.8;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}


/*  ファーストビュー  */
header {
	background-color: #81d7d0;
	height: 50px;
	width: 100%;
	margin: 0 auto;
}

h1 {
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size:11px;
}
.fv {
    height: 641px;
    background: url(../images/01_top_bg_left.png); //全体の背景
    position: relative;
}
.fv:before {
    width: 50%;
    height: 641px;
    content: "";
    position: absolute;
    top: 200;
    left: 50%;
    background: url(../images/01_top_bg_right.png); //右側の背景
}
.fv .image {
    position: absolute;
    left: 50%;
    margin-left: -480px; //画像幅960px半分をネガティブマージン
}



/* ニキビのループ */
.doctor_01 {
	background: url(../images/03_img07.jpg) no-repeat;
	width: 866px;
	height: 240px;
	position: relative;
	margin: 50px auto 70px ;
}
.doctor_01 p.img {
	position: absolute;
	display: block;
	width: 450px;
	top: 35px;
	left: 50px;
}
.doctor_01 p.text {
	position: absolute;
	display: block;
	width: 450px;
	top: 135px;
	left: 50px;
}
.offer_box {
	background: #fff;
	width: 860px;
	margin: 0 auto;
	padding-left: 50px;
	padding-right: 50px;
	position: relative;
}
.offer_box .hoken {
	position: absolute;
	top: -30px;
	right: 50px;
}
.offer_box .flower {
	position: absolute;
	top: -70px;
	left: 0;
}
.offer_01 hr {
    border: none;
    border-top: dotted 1px #999;
	width: 700px;
    height: 1px;
    color: #999;
    margin: 25px 0 0 0;
}
.offer_01 hr.short,
.offer_02 hr.short,
.offer_03 hr.short {
    border: none;
    border-top: dotted 1px #999;
	width: 290px;
    height: 1px;
    color: #999;
    margin: 25px 0;
}
.offer_01 {
	background: url(../images/03_offer_bg.jpg) repeat-x;
	height: 380px;
}



/* しみ、色素沈着 */
.doctor_02 {
	background: url(../images/04_img05.jpg) no-repeat;
	width: 866px;
	height: 240px;
	position: relative;
	margin: 50px auto 70px ;
}
.doctor_02 p {
	position: absolute;
	display: block;
	width: 430px;
	top: 70px;
	left: 50px;
}
.offer_02 hr {
    border: none;
    border-top: dotted 1px #999;
	width: 860px;
    height: 1px;
    color: #999;
    margin: 30px 0 0;
}
.offer_02 {
	background: url(../images/04_offer_bg.jpg) repeat-x;
	height: 950px;
}



/* 毛穴、凸凹 */
.doctor_03 {
	background: url(../images/05_img04.jpg) no-repeat;
	width: 866px;
	height: 240px;
	position: relative;
	margin: 50px auto 70px ;
}
.doctor_03 p {
	position: absolute;
	display: block;
	width: 430px;
	top: 60px;
	left: 50px;
}
.offer_03 hr {
    border: none;
    border-top: dotted 1px #999;
	width: 850px;
    height: 1px;
    color: #999;
    margin: 35px 0 0 55px;
}
.offer_03 {
	background: url(../images/05_offer_bg.jpg) repeat-x;
	height: 830px;
}


/* よしえクリニックとは */
.about_box {
	position: relative;
}
.about_box hr {
	border: none;
    border-top: dotted 1px #999;
	width: 450px;
    height: 1px;
    color: #999;
    margin: 30px 0;
}
.about_box .info1 {
	position: absolute;
	top: 50px;
	left: 140px;
	width: 450px;
}
#no1 {
	background: url(../images/06_img03.png) no-repeat;
	height: 250px;
}
.about_box .info2 {
	position: absolute;
	top: 30px;
	left: 500px;
	width: 460px;
}
#no2 {
	background: url(../images/06_img05.png) no-repeat;
	height: 266px;
}
.about_box .info3 {
	position: absolute;
	top: 50px;
	left: 140px;
	width: 460px;
}
#no3 {
	background: url(../images/06_img07.png) no-repeat;
	height: 250px;
}
.about_box .info4 {
	position: absolute;
	top: 30px;
	left: 500px;
	width: 460px;
}
#no4 {
	background: url(../images/06_img09.png) no-repeat;
	height: 265px;
}
.foryou {
	background: url(../images/06_img11.jpg) no-repeat;
	position: relative;
	height: 580px;
}
.foryou .ex {
	position: absolute;
	top: 520px;
	left: 0;
}



/* 疾患・お悩み */
.menu {
	background: url(../images/07_img06.png) no-repeat;
	height: 726px;
	padding: 0 50px;
}
table.all td {
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 18px;
	line-height: 60px;
	color: #817546;
	text-align: center;
	padding: 5px 5px 0;
	width: 210px;
}
table.all td a {
	display:block;
	width: 100%;
	height: 100%;
	border: 1px solid #817546;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	color: #817546;
	text-decoration: none;
	border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}
table.all td a:hover {
	background-color: #817546;
	color: #fff;
}
table.all td.none a:hover {
	background-color: #fff;
	color: #817546;
	cursor: default;
}
.doctor_yoshie {
	background: url(../images/08_bg.png) repeat;
  padding-bottom: 40px;
}
.doctor_yoshie .contents {
	width: 860px;
	background-color: #fff;
	padding: 50px;
}
.doctor_yoshie .contents {
	width: 860px;
	background-color: #fff;
	padding: 50px;
}
.career {
	font-size: 12px;
	line-height: 160%;
}
.career_box {
  margin-top: 20px;
  /*border: 1px solid #ccc;
  padding: 15px;*/
}
.career_box .career_subtitle {
  font-weight: bold;
}
.career_box a {
  color: #333;
}
.career ul.career_kouen li {
  margin-bottom: 0.5em;
}


/* アクセス */
.spot {
	background-color: #ffccde;
	padding: 10px 20px;
	font-family:  "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 20px;
}
.map {
	font-size: 12px;
	line-height: 160%;
}
.totop {
	background: url(../images/08_img17.png) no-repeat right bottom;
	height: 130px;
	text-align: right;
}


/* フッター */
footer {
	background-color: #81d7d0;
	padding: 50px 0;
}
footer .contents {
	background-color: #fff;
	width: 860px;
	padding: 25px 50px 35px;
	border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}
footer .contents hr {
    border: none;
    border-top: dotted 1px #999;
    height: 1px;
    color: #999;
}
footer .copy {
	color: #fff;
	text-align: center;
	font-size: 12px;
}

/* 190418 プロフィールのスタイルを追加 */
dl.profile {
	display: flex;
	flex-wrap: wrap;
	font-size: 12px;
}
dl.profile dt {
	width: 20%;
}
dl.profile dd {
	width: 80%;
}

