@charset "utf-8";
#heading{ text-align:center; margin:30px auto;}
h2 {
  display: flex;
  justify-content: center;
  align-items: center;
}

h2::before,
h2::after {
  content: "";
  flex-grow: 1;
  height: 8px;
  background-image: repeating-linear-gradient(-45deg, #777 0, #777 1px, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 50%);
  background-size: 8px 8px;
}

h2::before {
  margin-right: 30px;
}

h2::after {
  margin-left: 30px;
}

h4{padding:0;}

.linkarea{clear:both; margin-top:12px; text-align:center;}
p.links{margin:20px 0;}
p.links a{background-color:#E3CD93; color:#333333; border-radius:20px; -webkit-border-radius: 20px; -moz-border-radius:20px; padding:4px 20px;}
p.links a:hover{text-decoration:none; background-color:#D8C072;}


/****院長自ら若返った！小国英昭のフェイスリフト体験記*/
div.greeting{margin:12px auto 60px; padding:0; width:990px;}
div.greeting:after{display:block; content:""; clear:both;}
div.greeting .readph{float:left;}
div.greeting .readtxt{width:64%; float:right;}

/****「BEFORE」「AFTER」のボタンを押して若返り効果をご覧ください。*/
div.inf001{margin:0 auto 80px; width:1000px;}
div.inf001:after{content:""; clear:both; display:block;}
div.inf001 div.ph{width:400px; float:left; margin-right:50px;}
div.inf001 div.txt{width:50%;	float:right;	padding-top:4px;}
div.inf001 div.txt img{max-width:100%;}
div.inf001 div.txt p.img{text-align:center; margin:2px 0;}
/*施術を見るボタン*/
#info { margin-top:12px; border-bottom:4px solid #CE9B05;}
#info p{margin:0; line-height:0;}
#info img{width:109px;}
/*写真*/
#slideshow {margin:0 auto; width:400px; border: 2px solid #CE9B05; border-radius: 18px; -webkit-border-radius: 18px; -moz-border-radius: 18px;	margin-top: 2px; padding:12px;	clear:both;}
#image {width: 400px;	height: 402px;}
#hidden {display: none;	text-align:center;}
#image .inner {position: relative;}
#image_before, #image_after {position: absolute; top: 0; left: 0;}
#image_after{opacity: 0;}

/****小国院長がトータルリフトを実践******/
#inf02{margin:12px auto 30px; width:990px;}
#inf02 ul{margin:0 auto; list-style:none;}
#inf02 ul li{ padding:8px; border-top:2px solid #CCCCCC; display:inline-block; vertical-align:top; margin:12px 0 24px;}

#inf02 ul li h5{margin:0 0 0.2em 0;	padding:11px 0 14px 55px;	font-size:126%;	color:#996600; line-height:1;}
#inf02 ul li h5.n1{ background:url(images/list_n01.gif) no-repeat;}
#inf02 ul li h5.n2{ background:url(images/list_n02.gif) no-repeat;}
#inf02 ul li h5.n3{ background:url(images/list_n03.gif) no-repeat;}
#inf02 ul li h5.n4{ background:url(images/list_n04.gif) no-repeat;}
#inf02 ul li h5.n5{ background:url(images/list_n05.gif) no-repeat;}

#inf02 ul li.c1{ display:block; border:none;}
#inf02 ul li.c2,
#inf02 ul li.c3,
#inf02 ul li.c4,
#inf02 ul li.c5{width:47%;}

/****術後の経過*/
/*inf03*/
#inf03{margin:0 auto;}
#inf03 p{text-align:center;}
#inf03 span{display:block;}
#inf03 ul.pass{padding:0; list-style:none; display:flex; justify-content: center; align-items: center;}
#inf03 ul.pass li{margin:0 12px 0 0; padding:0; vertical-align:middle;}
#inf03 ul.pass li.ttl{background-color:#CCCCCC; width:100px; padding:1em 1em 1em 0.6em; order-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px;
  -webkit-clip-path: polygon(0% 0%, 85% 0%, 100% 50%, 85% 100%, 0% 100%);
  clip-path: polygon(0% 0%, 85% 0%, 100% 50%, 85% 100%, 0% 100%);}
#inf03 .radius_inner{padding:12px 12px 11px 12px; margin:0 auto 30px; text-align:center;}

@media screen and (max-width:1020px) {
div.greeting{margin:12px auto 60px; padding:0; width:auto;}
div.greeting .readph{width:33%;}
div.greeting .readph img{max-width:100%;}
div.greeting .readtxt{width:64%;}

div.inf001{margin:0 auto 40px; width:auto;}
div.inf001 div.ph{width:400px; float:left; margin-right:0;}
div.inf001 div.txt{width:48%;	float:right;	padding-top:4px;}

#inf02{width:auto;}
}

@media screen and (max-width:870px) {
div.inf001 div.txt{width:40%;}
}

@media screen and (max-width:780px) {
div.greeting{margin:12px auto 60px; padding:0; width:auto;}
div.greeting .readph{width:auto; float:none; text-align:center;}
div.greeting .readtxt{width:auto; float:none;}

div.inf001{margin:0 auto 40px; width:auto;}
div.inf001 div.ph{width:auto; margin:0 auto; float:none; margin-right:0;}
div.inf001 div.txt{width:auto;	float:none; margin-top:20px;	padding-top:4px;}

#slideshow{width:auto;}
#image { margin:0 auto; width: 310px; height: 302px;}
#hidden{display: none;	text-align:center;}
#image .inner{position: relative;}
#image .inner img{width:300px;}
#image_before, #image_after {position: absolute; top: 0; left: 0;}
#image_after {opacity: 0;}

#inf02 ul li.c1{ display:block; border:none;}
#inf02 ul li.c2,
#inf02 ul li.c3,
#inf02 ul li.c4,
#inf02 ul li.c5{width:auto; display:block;}

#inf03 p{text-align:left;}
#inf03 p.links{text-align:center;}
#inf03 span{display:inline;}

}

@media screen and (max-width:540px) {
#inf03 ul.pass{display:block;}
#inf03 ul.pass li.ttl{ width:auto; margin-bottom:12px; -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 100% 100%, 0% 100%);
  clip-path: polygon(0% 0%, 100% 0%, 100% 1000%, 100% 100%, 0% 100%);}
#inf03 ul.pass li img{width:80%;}
}