@charset "UTF-8";
/****************************************
common
*****************************************/
*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html,body{
  margin:0;
  padding:0;
  line-height: 1;
}

body{
	background: #fff;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}

p{line-height:1.6 !important;}
img{width:100%;}

.relative{position: relative;}
.txt-r{text-align:right;}
.txt-l{text-align:left;}
.txt-c{text-align:center;}

.mincho{font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}



/****************************************
header
*****************************************/
.site-header{
	transition: .5s;
	width: 100%;
}
.bg-w{background: rgba(255,255,255,0.8);}
.site-header.transform{
	background: rgba(255,255,255,0.9);
	padding: 20px;
}

.header-inline{position: relative; max-width:1200px;margin: 0 auto; padding:48px 10px;
display: flex;
justify-content: space-between;
transition: .5s;
width: 100%;
z-index: 9999;
height: 110px;
}
header p{font-size:.75rem;}
.headline{display:inline-block;position: absolute; top:5px; left:10px;}
header img{max-width:330px;}
header h1{display:inline-block;position: absolute; top:50px; left:10px;text-align: left;}
header h1 a{text-decoration:none;}
.logo{font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif; font-size:2rem;}
.head-tel{position: absolute; top:5px; right:0;font-family: 'Hiragino Kaku Gothic ProN', '游ゴシック', YuGothic, 'メイリオ', Meiryo, sans-serif;width: 430px;}
.telnumber{font-size:2rem;}
.reserve{display: inline-block; vertical-align:middle;background:#004680; padding:5px 8px; margin-right:5px;font-size:.75rem; color:#fff;}
.open-time{font-size:.9rem;padding: 8px 0;text-align: left;line-height: 1.5;}
.h-netYoyaku{display:inline-block;background:#A07C3D;font-size:1rem;color:#fff;padding: 8px 10px;margin-right:10px;position: absolute;left: 0px;top: 5px;}
/*上部固定*/
.site-header{
   /* position: fixed;*/
    justify-content: space-between;
    transition: .5s;
    width: 100%;
    z-index: 9999;}

.is-fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
}

@media screen and (max-width: 599px) { 
.logo { font-size: 1.5rem;}
.header-inline{height: 100px;}
}
/****************************************
nav
*****************************************/
.pc-nav{width:100%; background-color: rgba(0,70,128,0.8);}
/*.pc-nav{width:100%; background:url(/wp/wp-content/themes/stinger7child/images/header_naviBG.png) no-repeat center center;}*/
nav{text-align: center;max-width:1200px;margin: 0 auto;}
nav ul{
margin: 0 ;
padding: 0 ;
}
nav ul li{
list-style: none;
display: inline-block;
width: 12%;
min-width: 90px;
}
nav ul li a{
display: block;
width: 100%;
padding: 5px 0;
text-decoration: none;
color: #fff;
}
nav ul li.current a{
color: #fff;
}
nav ul li.current {
color: #FFF2CC;
}
nav ul li a:hover{
color: #FFF2CC;
}

@media screen and (max-width: 599px) { 
    /*　画面サイズ 599pxまで適用　*/
    .zdo_drawer_menu{display:block;}
    .pc-nav,.head-tel{display:none;}
    nav ul li{display:block;}
    h1 img{max-width:300px;}
  }
  @media screen and (min-width: 600px) and (max-width: 999px) {
    /*　画面サイズ 600pxから999pxまで適用　*/
    .zdo_drawer_menu{display:block;}
    .pc-nav,.head-tel{display:none;}
    nav ul li{display:block;}
  }
  @media screen and (min-width:1000px) {
    /*　画面サイズ 1000px以上から適用　*/
    .zdo_drawer_menu{display:none;}
    .pc-nav{display:block; height: 60px;}
  }
/****************************************
Main Visual
*****************************************/

.mainvisual .inner {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
    background: #eee;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
@media screen and (max-width: 599px) { 
    /*　画面サイズ 599pxまで適用　*/
.pc-view {
    display: none;
  }
  .sp-view {
    display: block;
  }
}
@media screen and (min-width: 600px) and (max-width: 999px) {
    /*　画面サイズ 600pxから999pxまで適用　*/
.sp-view {
  display: none;
}
}
@media screen and (min-width:1000px) {
    /*　画面サイズ 1000px以上から適用　*/
.sp-view {
  display: none;
}
}
/****************************************
Main-Menu
*****************************************/
.Main-MenuArea{
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  flex-direction: row;
  margin-bottom:100px;
}
.col01 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  color:#fff;
  position: relative;
   -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.col01 a, .menu-box a {position:absolute;display: block;top: 0;
    left: 0;
    height:100%; 
    width: 100%; }
.menu-box_h3{color:#fff; text-align:left; line-height:1.5}
.col01 li{width:90%;margin:0 auto;text-align: center;/* position: absolute; *//* top: 25%; */}

@media screen and (max-width: 599px) { 
    /*　画面サイズ 599pxまで適用　*/
.col01 {height: 200px;}
.person-01  { order: 1; width: 50%;}
.person-02  { order: 2; width: 50%;}
.person-03  { order: 3; width: 50%;}
.person-04  { order: 4; width: 50%;}
.col01 li{text-align:left; line-height:1.2}
.menu-box_h2{font-size:.9rem;border-bottom: solid 1px #fff;position: absolute;top: 10%;}
.menu-box_h3{font-size:.8rem;}
}
@media screen and (min-width: 600px) and (max-width: 999px) {
    /*　画面サイズ 600pxから999pxまで適用　*/
.col01 {height: 300px;}
.person-01  { order: 1; width: 25%;}
.person-02  { order: 2; width: 25%;}
.person-03  { order: 3; width: 25%;}
.person-04  { order: 4; width: 25%;}
.col01 li{text-align:left; line-height:1.2}
.menu-box_h2{font-size:1.2rem;border-bottom: solid 1px #fff;position: absolute;top: 20%;}
.menu-box_h3{font-size:.9rem;}
}
@media screen and (min-width:1000px) {
    /*　画面サイズ 1000px以上から適用　*/
.col01 {height: 480px;}
.person-01  { order: 1; width: 25%;}
.person-02  { order: 2; width: 25%;}
.person-03  { order: 3; width: 25%;}
.person-04  { order: 4; width: 25%;}
.menu-box_h2{font-size:1.5rem;border-bottom: solid 1px #fff;position: absolute;top: 33%;}
.menu-box_h3{/* position: absolute; *//* top: 40%; */}
}

.person-01{background: url(/wp/wp-content/themes/stinger7child/images/top/topmenu_01.jpg) no-repeat center;
  background-size: cover;}
.person-02{background: url(/wp/wp-content/themes/stinger7child/images/top/topmenu_02.jpg) no-repeat center;
  background-size: cover;}
.person-03{background: url(/wp/wp-content/themes/stinger7child/images/top/topmenu_03.jpg) no-repeat center;
  background-size: cover;}
.person-04{background: url(/wp/wp-content/themes/stinger7child/images/top/topmenu_04.jpg) no-repeat center;
  background-size: cover;}

.person-02:before,.person-01:before,.person-03:before,.person-04:before {
	content: ' ';
	background-color: rgba(0, 0, 0, .5);
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.person-01 a, .person-02 a, .person-03 a, .person-04 a{
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
text-indent:-999px;
}
/****************************************
Main
*****************************************/
section {
    max-width: 1200px;
    margin: 0 auto !important;
    width:100%;
  }
  section + section {
     margin-top: 120px !important;
  }

section h2{font-size:1.25rem;text-align:center; margin-bottom:2rem;}
section h2 span{
     position: relative;
     display: inline-block;
     padding-bottom:0.5em;
     border-bottom: 1px solid #004680;
}

/****************************************
設備
*****************************************/
.FacilityArea{
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  flex-direction: row;
}
.FacilityBox span{/* display:block; *//* margin-bottom:10px; */}
.FacilityBox{position:absolute; bottom:0; left:0; width: 100%; background:rgba(255,255,255, .8); padding:20px 10px;}

.link_box{
    position:relative;
    width: 100%;
    padding: 2%;
    /* border:solid 1px #CCC; */
    /* margin:0px auto 20px; */
}
 
.FacilityBox a{
    position:absolute;
    top:0;
    /* left: 20px; */
    width:100%;
    height:100%;
    color:#000;
    text-decoration: none;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

.FacilityBox h3{font-size:2rem;    margin-top: 20px;}
@media screen and (max-width: 599px) { 
    /*　画面サイズ 599pxまで適用　*/
#FacilityArea{flex-direction: col;}
.facility-01  { order: 1; width: 100%;}
.facility-02  { order: 2; width: 100%;}
.facility-03  { order: 3; width: 100%;}
}
@media screen and (min-width: 600px) and (max-width: 999px) {
    /*　画面サイズ 600pxから999pxまで適用　*/
.facility-01  { order: 1; width: 30%;margin: 0 5px;}
.facility-02  { order: 2; width: 30%;margin: 0 5px;}
.facility-03  { order: 3; width: 30%;margin: 0 5px;}

}
@media screen and (min-width:1000px) {
    /*　画面サイズ 1000px以上から適用　*/
.facility-01  { order: 1; width: 31%;margin: 0 10px;}
.facility-02  { order: 2; width: 31%;margin: 0 10px;}
.facility-03  { order: 3; width: 31%;margin: 0 10px;}
}


/****************************************
もっと健康に、美しく！
*****************************************/
.contentsArea{display: flex;}
#main-content{width:50%;
background:#ddd url(/wp/wp-content/themes/stinger7child/images/top/top_contents_01.png) no-repeat center center;
background-size:cover;
height:360px;
position: relative;
}
#Sidebar{
  display:flex;
  flex-flow: column wrap;
  width:50%;
}

.side01{background:#ddd url(/wp/wp-content/themes/stinger7child/images/top/top_contents_02.png) no-repeat center right;
background-size:cover;
height:180px;
position: relative;
}
.side02{background:#ddd url(/wp/wp-content/themes/stinger7child/images/top/top_contents_03.png) no-repeat center right;
background-size:cover;
height:180px;
position: relative;
}

@media screen and (max-width: 768px) {
  .contentsArea {
    flex-direction: column;}
   #main-content{width:95%; margin:0 auto;}
  #Sidebar{width:95%; margin:0 auto;}
}

.contentsArea01{padding:1rem; position: absolute;top:5%; height: 100%;}
.contentsArea_ttl{font-size:20px; font-weight:bold;}
.contentsArea_subttl{display:block; font-size:10px;}
.contentsArea_txt{ font-size:.8rem;}
.contentsArea_w50{width:60%;}
.contentsArea_w70{width:70%;}
.contentsArea_mt5{margin-top:5%;}
.contentsArea_mt3{margin-top:3%;}
.contentsArea_link{position: relative; font-size:.8rem;margin-top:3%;}
.contentsArea_link {text-decoration: none;}
.contentsArea_link:after {
  font-family: 'FontAwesome';
  content: "\f138";
   position: absolute;
   padding-left:5px;
   color:#004680;
   }
.contentsArea01 a{
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
text-indent:-999px;
}

@media screen and (max-width: 599px) { 
    /*　画面サイズ 599pxまで適用　*/
.contentsArea_w70{width:80%;}
}

/****************************************
当院で行う治療内容
*****************************************/

.parent2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.children {
  width: 260px;
  height: 220px;
  margin: 10px 15px;
  text-align: center;
  position: relative;
}
.parent2 .children img {
  object-fit: cover;
}
.cp_ribbon {
	line-height: 50px;
	position: absolute;
	top: 120px;
	display: block;
	width: calc(100% + 18px);
	height: 50px;
	margin-right: -9px;
	margin-left: -9px;
	text-align: center;
	color: #ffffff;
	background: #004680;
}
.cp_ribbon:before, .cp_ribbon:after {
	position: absolute;
	content: '';
}
.cp_ribbon:before {
	bottom: -10px;
	left: 0;
	width: 0;
	height: 0;
	border-top: 10px solid #808080;
	border-left: 10px solid transparent;
}
.cp_ribbon:after {
	right: 0;
	bottom: -10px;
	width: 0;
	height: 0;
	border-top: 10px solid #808080;
	border-right: 10px solid transparent;
}

@media screen and (max-width: 620px) { 
    /*　画面サイズ 620pxまで適用　*/
.children {
  width: 150px;
  height: 137px;
  margin: 10px 15px;
  text-align: center;
}
.cp_ribbon {top: 75px;height: 35px;}
.cp_ribbon span{font-size:14px;position: relative;top: -8px;}
}

/****************************************
院長挨拶
*****************************************/
.greeting{max-width: 100%;margin-top: 100px; 
background:url(/wp/wp-content/themes/stinger7child/images/top/top_greeding_bg.jpg) no-repeat center center;
background-size:cover; }
.bg-mask { height: 100%;background: rgba(255,255,255,0.8);}
#greeting{padding:60px 20px;}
.greeting_contentsArea{display: flex;}
.greeting_contents_txt{flex: 2; order: 1;}
.greeting_contents_txt h3{font-size:1.2rem; font-weight:bold; margin:1.5rem 0;}
.greeting_contents_photo{flex: 1; margin:1rem; order: 2;}
.doctor_mane{margin-top:1rem;}

@media screen and (max-width: 620px) { 
.greeting_contentsArea{flex-direction:column;}
.greeting_contents_txt{order: 2;}
.greeting_contents_photo{order: 1;}
}

/****************************************
フッター
*****************************************/
footer{background:#E6EDF3;padding:60px 0 0 0px;}
.footer_innner{max-width: 1200px;margin: 0 auto;width: 100%;display: flex;}
.footer_Larea{flex: 1;position: relative; padding: 1rem;}
.footer_Rarea{flex: 1;position: relative; padding: 1rem;}
.footer_Larea h3{font-size: 2rem; font-weight:500; border-bottom:1px solid #004680; margin-bottom:2rem;}
.footer_telnumber{font-size: 3rem;}
.footer_reserve{display: inline-block;vertical-align:middle;background:#004680;padding:5px 8px;margin-right:5px;font-size: 1rem;color:#fff;}
.fotter_contactBtnArea{width:90%; margin:0 auto; padding:1.5rem 0;}
.footer_contactBtn {
	display: block;
	position: relative;
	padding: 1rem;
	text-align: center;
	text-decoration: none;
	color: #fff;
	background: #a07c3d;
	border:1px solid #a07c3d;
	font-size:1.25rem;
	border-radius:5px;
}
.footer_contactBtn:hover {
	 background: #fff;
         color: #a07c3d;
	 cursor: pointer;
	 text-decoration: none;
}

@media screen and (max-width: 768px) { 
.footer_innner{flex-direction: column;}
}

.Practice-time table{
  width: 100%;
  border-spacing: 0;
  margin: .5rem 0;
}

.Practice-time table th{
  border-bottom: solid 1px #004680 !important;
  border-left: solid 1px transparent !important;
  padding: 10px 0;
  color:#004680 !important;
  /* text-align: left; */
  width: 120px;
  background:transparent;
  box-shadow: 1px 1px 0 transparent inset;
  font-size: 1rem !important;
}
.Practice-time table tr:first-child{border-top: solid 1px #004680 !important;}

.Practice-time table td{
  border-bottom: solid 1px #004680 !important;
  border-left: solid 1px transparent !important;
  text-align: center;
  padding: 10px 0;
  background:transparent;
  font-size: 1rem !important;
}
.footer_access{width: 100%;display: flex;margin: 1rem 0;}
.footer_accessL{background:#fff;border-radius:10px;padding:1rem;font-size:1rem;color:#004680;text-align:center;width: 150px;height: 150px;position: relative;border: 2px solid #004680; }
.footer_accessL span{display:block; font-size:1.5rem; font-weight:500;}
.footer_accessR{padding:0 1rem;}
.footer_accessR p{margin:.5rem 0;}

.footer_accessBtn {
	display: block;
	position: relative;
	padding: 1rem;
	text-align: center;
	text-decoration: none;
	background: #fff;
	border:1px solid #004680;
	font-size:1rem;
	border-radius:5px;
	color: #004680;
}
.footer_accessBtn:link{color: #004680;}
.footer_accessBtn a:visited { color:#004680;text-decoration: none;}
.footer_accessBtn:hover {
	 background: #004680;color: #fff;cursor: pointer;text-decoration: none;}

.footer_accessBtn:active{color: #fff;}
.copyright{padding:1.5rem 0; text-align:center; color:#fff; background:#004680; font-size:.9rem;}

.pagetop {
    position: fixed;
    bottom: 20px;
    right: 20px;
}

.pagetop{ width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(0,70,128,0.8);
  text-align:center;}
.pagetop img{width:50px;padding: 10px;margin: 10px;}
.yoyaku-btn{ width: 120px;height: 120px; border-radius: 5px;background: rgba(160,124,61,0.8);z-index: 9999;}
.yoyaku-btn{position: fixed;top: 200px;right: 0px;text-align:center;}
.yoyaku-btn img{width:100px;padding: 10px;margin: 10px;}