@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;800;900&display=swap');

@media screen and (max-width: 900px){

.wrapper{
	width: 94%;
	margin-left: 3%;
	margin-right: 3%;
}

.pc{
	display: none!important;
}
	
.sp{
	display: block!important;
}
	
.box_2{
	width: 100%;
	margin-bottom: 20px;
}

.box_3{
	width: 48%;
	margin-bottom: 20px;
}
	
.box_4{
	width: 48%;
	margin-bottom: 20px;
}	
	




/*🔲🔲🔲🔲🔲🔲🔲🔲 TOP page TOP画像 SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

main{
	padding-top: 60px;
}

#top_bg{
	background-image: url("../images/top_bg.webp?0329_2");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	width: 100%;
	height: auto;
	padding-top: 40px;
	padding-bottom: 20px;
	overflow-x: hidden;
}

#top_bg h2{
	font-size: 30px;
	margin-bottom:30px;
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 5px rgba(0, 0, 0, 1);
}

#top_left{
	padding: 15px;
	display: inline-block;
	margin-bottom: 20px;
}

#top_left p{
	font-size: 14px;
}

#top_right{
	padding: 15px;
	border-radius: 10px;
	padding-right: 0px!important;
	margin-right: 0px!important;
	overflow-x: hidden;
}

#top_right h3{
	font-size: 18px;
	margin-bottom: 15px;
}
	
.top_right_block{
	margin-bottom: 20px;
}

.top_right_block h4{
	color: #009eb8;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 5px;
}
	
.top_right_block p{
	line-height: 1.6!important;
}

.top_right_block h4 img{
	width: 24px;
	margin-right: 5px;
}

.top_right_block p span{
	font-size: 14px;
}

#top_news_btn{
	background-color: #009eb8;
	text-align: center;
	display: inline-block;
	border-radius: 5px;
	font-size: 18px;
	font-weight: 600;
}

#top_news_btn a{
	color: #fff;
	padding: 8px 50px;
	display: block;
}

#top_tel{
	color: #00a63c;
	font-weight: 700;
}

#top_tel span{
	font-size: 28px!important;
	font-weight: 700;
}

.flex_bet_start .top_right_block:first-child{
	margin-right: 20px;
}

	

	
/* トップページ ニュース部分タブ SP */


/*tabの形状*/
.news_tab_menu li a{
	padding: 5px 10px;
}

.news_tab_btn{
	padding: 10px;
	border-top-left-radius: 10px;
    border-top-right-radius: 10px;
	padding-bottom: 20px;
	margin-bottom: -10px;
}

.news_tab_btn a{
	font-size: 16px!important;
}

.news_tab_btn img{
	width: 24px;
	margin-right: 5px;
	margin-top: -3px;
}



/*エリアの表示非表示と形状*/
.news_tab_area {
	display: none;/*はじめは非表示*/
	opacity: 0;/*透過0*/
	margin-bottom: 50px;
}

.news_tab_area .wrapper{
	padding: 15px 20px;
}

.news_tab_area dt{
	width: 100%;
	padding-bottom: 0px;
	border-bottom: none;
	margin-bottom: 10px;
}

.news_tab_area dd{
	width: 100%;
}

	
	
/*🔲🔲🔲🔲🔲🔲🔲🔲 トップページ主要メニュー8個 SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

#top_main_menu_bg{
	padding-top: 40px;
	padding-bottom: 30px;
	margin-bottom: 60px;
}

.top_main_menu{
	background-color: #fff;
	border-radius: 10px;
	width: 48%;
	text-align: center;
	position: relative;
	box-shadow: 3px 3px 5px -3px rgba(0, 0, 0, 0.3);
	margin-bottom: 40px;
	transition:all 0.3s;
}

.top_main_menu a{
	display: block;
	width: 100%;
	padding: 15px;
	padding-top: 30px;
}

.top_main_menu::before{
	content: url("../images/top_main_menu_deco.svg");
	width: 90px;
	top: -20px;
	left: calc(50% - 45px);
	position: absolute;
}

.top_main_menu::after{
	content: url("../images/icn_cd_list_arrow.svg");
	width: 16px;
	height: 16px;
	bottom: 10px;
	right: 10px;
	position: absolute;
	transition:all 0.3s;
}

.top_main_menu:hover::after{
	transform: translate(5px,0px);
}

.top_main_menu img{
	width: 48px;
	margin-bottom: 10px;
}

.top_main_menu h2{
	font-size: 17px;
}

.top_main_menu p{
	font-size: 13px;
}

	


/*🔲🔲🔲🔲🔲🔲🔲🔲 トップページ診療科部門一覧24個 SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

.cd_list{
	width: 48%;
	margin-bottom: 10px;
	font-size: 14px;
	height: 80px;
	overflow: hidden;
	position: relative;
	
}

.cd_list::after{
	content: url("../images/icn_cd_list_arrow.svg");
	position: absolute;
	width: 16px;
	height: 16px;
	right: 10px;
	top: calc(50% - 8px);
	transition:all 0.3s;
}

.cd_list a{
	background-color: #fff;
	font-size: 14px;
	padding: 10px;
	color: #333;
	height: 100%;
	transition:all .3s;
}

#cd_list_bg{
	display: none;
}
	
	
	
	
/*🔲🔲🔲🔲🔲🔲🔲🔲 トップページ4つのバナー SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

#top_banner_bg{
	padding-top: 40px;
	padding-bottom: 20px;
	margin-bottom: 70px;
}

.top_banner_block{
	width: 100%;
	margin-bottom: 15px;
}

.top_banner_block::after{
	width: 20px;
	right: 15px;
	top: calc(50% - 10px);
}

.top_banner_block a{
	display: flex;
	align-items: center;
	padding: 15px;
}

.top_banner_block img{
	width: 64px;
	margin-right: 15px;
}

.top_banner_block h2{
	font-size: 18px;
}
	
	
	
	


/*🔲🔲🔲🔲🔲🔲🔲🔲 病院の紹介(about)SP 🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

#about_main h2{
	font-size: 21px;
	margin-bottom: 30px;
}
	
	


/*🔲🔲🔲🔲🔲🔲🔲🔲 院長挨拶(about_1)SP 🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

#about_1_greet_left{
	width: 100%;
	margin-bottom: 30px;
}

#about_1_greet_right{
	width: 100%;
}

ol li span{
	color: #009eb8;
	font-weight: 500;
	margin-right: 8px;
}

	


/*🔲🔲🔲🔲🔲🔲🔲🔲 ご来院の皆さまへ(patient) 🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

#corona_box{
	padding: 20px;
	margin-bottom: 40px;
}

#corona_box p{
	color: #E7312F;
	font-size: 18px;
	font-weight: 700;
	position: relative;
	padding-left: 45px;
	line-height: 1.5!important;
}

#corona_box p::before{
	content: "";
	background-image: url("../images/icn_corona.svg");
	background-repeat: no-repeat;
	width: 36px;
	height: 36px;
	position: absolute;
	left: 0px;
	top: calc(50% - 18px);
}

#patient_block{
	border: solid 1px #009EB8;
	border-radius: 10px;
	padding: 20px;
	margin-bottom: 60px;
}




/*🔲🔲🔲🔲🔲🔲🔲 医療関係の皆さまへ（related）SP　🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

#related_left{
	width: 100%;
	margin-bottom: 20px;
}

#related_right{
	width: 60%;
}

.tel_sentence,.fax_sentence{
	font-size: 16px;
	font-weight: 500;
	position: relative;
	padding-left: 30px;
	display:inline-block;
}

.tel_sentence::before{
	width: 24px;
	height: 24px;
	top: calc(50% - 12px);
}

.fax_sentence::before{
	width: 24px;
	height: 24px;
	top: calc(50% - 12px);
}

.tel_sentence a,.fax_sentence a{
	font-size: 30px;
	margin-left: 0px;
	line-height: 1.0!important;
	display: block;
	margin-top: -3px;
	vertical-align: middle;
}

.icn_24px{
	width: 24px;
	margin-left: 8px;
	margin-top: -3px;
}

.no_border_table{
	border: none;
	margin-bottom: 40px;
}

.no_border_table th{
	border: none;
	font-weight: 500;
	text-align: left;
	padding: 5px;
	display: block;
}

.no_border_table td{
	border: none;
	padding: 5px;
	display: block;
}

.no_border_table td:last-child{
	margin-bottom: 20px;
}
	
	
	
/*🔲🔲🔲🔲🔲🔲🔲🔲 サイトマップ SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

.sitemap_box{
	width: 90%;
}

.sitemap_box ul{
	margin-bottom: 30px;
}

.sitemap_box li::before{
	content: url("../images/icn_sitemap_arrow.svg");
	width: 8px;
	height: 10px;
	position: absolute;
	left: 0px;
}
	
	
	
/*🔲🔲🔲🔲🔲🔲🔲🔲 コンタクトページ SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

.contact_table_wrap{
	padding: 20px;
}

.contact_table th{
	width: 100%;
	vertical-align: top;
	display: block;
	padding-bottom: 10px;
}

.contact_table td{
	display: block;
	width: 100%;
	padding-bottom: 30px;
}

.contact_table_wrap hr{
	margin-bottom: 30px;
}

.contact_attention{
	border: solid 1px #009eb8;
	padding: 20px;
	border-radius: 10px;
	margin-bottom: 40px;
}

.contact_attention h2{
	font-size: 18px;
	margin-bottom: 15px;
}

.contact_attention ol li{
	margin-bottom: 15px;
}

#ssl_block {
	margin-bottom: 70px;
}

#ssl_block h2{
	font-size: 18px;
	margin-bottom: 15px;
}

#contact_btn{
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

#contact_btn input{
	padding: 15px;
	width: 80%;
	line-height: 1;
	border-radius: 5px;
	margin-left: 0px;
	margin-right: 0px;
	font-size: 16px;
	margin-bottom: 20px;
}

#contact_btn input:hover{
	opacity: 0.8;
}
	
	
	
	
/*🔲🔲🔲🔲🔲🔲🔲🔲 ニュース一覧 SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

.news_list{
	margin-bottom: 40px;
}

.news_list dd{
	padding-bottom: 8px;
	margin-bottom: 30px;
}

.page_block{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 10%;
}

.page_block ul{
	display:flex;
	list-style: none;
	margin-bottom: 20px;
}

.page_block ul li{
	border:solid 1px #ccc;
	border-radius: 5px;
	margin-right:5%;
}
	
.page_block li a{
	display: block;
	padding: calc(100vw / 80);
	text-decoration: none;
	color: #009eb8;
}

#page_first_last a{
	margin-right: 40px;
	margin-left: 0px;
}

#closed_table{
	width: 100%;
}

#closed_table th{
	padding: 5px 10px;
	background-color: #eee;
}

#closed_table td{
	padding: 5px 10px;
	background-color: #fff;
}
	
	
	
/*🔲🔲🔲🔲🔲🔲🔲🔲 ハンバーガーメニュー SP🔲🔲🔲🔲🔲🔲🔲🔲🔲🔲*/

/*ハンバーガーボタン*/
.el_humburger {
  position: fixed;
  top: 15px;
  right: 15px;
  width: 54px;
  height: 48px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 9999;
  cursor: pointer;
  pointer-events: auto;
  text-align: center;
}
 
.el_humburger_wrapper {
	margin-bottom: 5px;
	width: 54px;
	display: inline-block;
	background-color: #fff;
	padding: 15px;
	border: solid 1px #009eb8;
}
 
.js_humburgerOpen .el_humburger_text.el_humburger_text__menu {
  display: none; 
}
 
.el_humburger_text.el_humburger_text__close {
  display: none;
}
 
.js_humburgerOpen .el_humburger_text.el_humburger_text__close {
  display: block; 
}
 
.el_humburger span.el_humburger_bar {
  display: block;
  width: 100%;
  margin: 0 auto 6px;
  height: 3px;
  background: #009eb8;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out; 
}
 
.el_humburger span.el_humburger_bar:last-child {
  margin-bottom: 0; 
}
 
.js_humburgerOpen .el_humburger span.el_humburger_bar {
  background: #009eb8; 
}

.js_humburgerOpen .el_humburger span.el_humburger_bar.top {
  -webkit-transform: translateY(9px) rotate(-45deg);
  -ms-transform: translateY(9px) rotate(-45deg);
  transform: translateY(9px) rotate(-45deg); 
}
 
.js_humburgerOpen .el_humburger span.el_humburger_bar.middle {
  opacity: 0; 
}
 
.js_humburgerOpen .el_humburger span.el_humburger_bar.bottom {
  -webkit-transform: translateY(-9px) rotate(45deg);
  -ms-transform: translateY(-9px) rotate(45deg);
  transform: translateY(-9px) rotate(45deg); 
}
 
.el_humburgerButton.el_humburgerButton__close {
  top: 2%;
  right: 2%; 
}
 
.el_humburgerButton__close span.el_humburger_bar {
  display: block;
  width: 100px;
  margin: 0 auto;
  height: 8px;
  background: #000; 
}
 
.el_humburgerButton__close span.el_humburger_bar.top {
  -webkit-transform: translateY(5px) rotate(-45deg);
  -ms-transform: translateY(5px) rotate(-45deg);
  transform: translateY(5px) rotate(-45deg); 
}
 
.el_humburgerButton__close span.el_humburger_bar.bottom {
  -webkit-transform: translateY(-6px) rotate(45deg);
  -ms-transform: translateY(-6px) rotate(45deg);
  transform: translateY(-6px) rotate(45deg); 
}
 
.navi {
  position: fixed;
  right: 0;
	top: 0px;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  width: 80%;
  z-index: 999;
  padding-top: 100px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  transform:translateZ(0) translateX(100%);
  overflow: auto; 
}

.js_humburgerOpen .navi {
    transform:translateZ(0) translateX(0); 
}

.navi_item {
  position:relative;
  margin-bottom: 28px;
  white-space: nowrap;
  margin-left: 40px; 
}
	
.navi_item a{
	color: #009eb8;
}
 
.navi_item.op_innerLink {
    cursor: pointer; 
}
 
.el_spChildNavOpen {
  position: absolute;
  top: -6px;
  left: 80%;
  z-index: 20;
  -webkit-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
  padding: 10px; 
}
 
.js_openParent.js_fire > .el_spChildNavOpen {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); 
}

 .js_openParent.js_fire > .el_spChildNavOpen > .el_spChildNavOpen_wrapper:after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0; 
}
 
.el_spChildNavOpen_wrapper {
  position: relative;
  width: 15px;
  height: 15px;
  -webkit-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
}

.el_spChildNavOpen_wrapper:before {
    content: "";
    width: 100%;
    height: 2px;
    background-color: #009eb8;
    position: absolute;
    top: calc(50% - 1px);
}

.el_spChildNavOpen_wrapper:after {
    content: "";
    width: 2px;
    height: 100%;
    background-color: #009eb8;
    position: absolute;
    left: calc(50% - 1px);
    -webkit-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
}

.nav_child{
	padding-top:20px;
	overflow-x: scroll;
	height: 100%;
}
 
.nav_child_item{
  position: relative;
  font-size:16px;
  padding-left:20px;
  margin-bottom:10px;
}
	
.nav_child_item a{
	color: #666;
}
 
.nav_child_item > a{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  top:0;
}
 
.nav_child_item:last-child{
  margin-bottom:0px;
}
 
.js_openSwitch {
  cursor: pointer; }
 
.js_openTarget {
  display: none; 
}	

    
}  

 