@charset "utf-8";

/* -----------------------------------------------------------
　PC・スマホ・他ページ共通
----------------------------------------------------------- */

/* :::::::::: 診療時間 :::::::::: */
  
section table.schedule {
  width:100%;
  text-align:center;
  vertical-align:middle;
  margin: 0 0 20px 0;
}

section table.schedule caption {
  caption-side:bottom;
  text-align:left;
  font-size:0.9em;
  color:#212121;
  margin:2% 0 0;
}

section table.schedule tr {
  border-bottom:solid 1px #333;	
}

section table.schedule th {
  background:#93d1eb;
  color:#FFF;
  font-size:1em;
  padding:0.3em 0;
  font-weight:normal;
  line-height:1.1em;
  vertical-align:middle;
}

section table.schedule td {
  font-size:1em;
  color:#212121;
  width:11%;
  line-height:1.1em;
  padding:0.3em 0;
  background:#FFFFFF;
  vertical-align:middle;
}

section table.schedule .time {
  width:23%;
  letter-spacing: 0.2em;
  padding-left: 1%;
}
  
section table.schedule td.time {  
  color:#212121;
  background:#e7f8ff;
  padding:0.3em;
}


/* :::::::::: 診療時間表の下テキスト :::::::::: */

.schedule-caption {
	
}

.schedule-caption td {
	padding: 0 0 5%;
}

.schedule-caption .sc1 {
	padding-right: 15px;
}

.schedule-caption .sc2 {

	text-align: left;
}

.schedule-caption .sc3 {
	text-align: right;
}

.schedule-caption .sc4 {
	text-align: left;
}


/* -----------------------------------------------------------
　トップページ
----------------------------------------------------------- */

@media screen and (min-width: 769px){
  
  /* :::::::::: 【PC】お知らせ・ブログ欄 :::::::::: */
  
  div.notice_area {
	width:980px;
	height:auto;
	margin:0 auto;
	background:url(../images/index/notice_bg.png) no-repeat top right;
  }
    
  section.notice {
	width:680px;
	margin:0 0 30px !important;
  }
  
  section.notice h2 {margin:0;}
  
  section.notice dl {
    width:100%;
    height:135px;
    overflow-y:scroll;
    box-sizing:border-box;
    margin:0;
	padding:10px;
  }
  
  section.notice dl dt{
    font-size:20px;
    line-height:1.1em;
    margin:0 0 5px;
	color:#e6ab0c;
  }
  
  section.notice dl dt span {
    font-size:14px;
  }
  
  section.notice dl dd{
    font-size:16px;
    line-height:1.3em;
	margin:0 0 20px;
	color:#212121;
  }
  
  /* :::::::::: 【PC】バナー :::::::::: */
  
  div.index_topic {
	width:100%;
	min-width:1050px;
	padding:20px 0;
	background:#0188c6;
	margin:0 0 30px;
  }
  
  div.index_topic ul {
	width:980px;
	height:auto;
	overflow:hidden; 
	margin:0 auto; 
  }
  
  div.index_topic ul li {
	position:relative;
	width:  237px;
	height:167px;
	margin:0 10px 0 0;
	float:left;
	list-style-type:none;
	overflow:hidden;
  }
  
  div.index_topic ul li:last-child {margin:0;}
  
  div.index_topic ul li a {
	display:block;
	width:100%;
	height:100%;  
  }
  
  div.index_topic ul li p {
	position:absolute;
    width:100%;
	padding:0.3em 0;
	font-size:21px;
	line-height:1.1em;
	color:#212121;
	background:rgba(255,255,255,0.8);
	text-align:center;
	bottom:0;
	z-index:100;
  }
  
  div.index_topic ul li a img {
    display: block;
    height: auto;
    max-width: 100%;
    transition: 0.5s;
  }

  div.index_topic ul li a:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  
  /* :::::::::: 【PC】医院概要 :::::::::: */
  
  section.summary {
	width:980px;
	height:auto;
  }
  
  section.summary .summary_left {
	width:480px;
	float:left;  
  }
  
  .summary_right {
	width:434px;
	float:right;
  }
  
  section.summary dl {
	width:100%;
	height:auto;
	margin:0;
  }
  
  section.summary dl dt {
	width:120px;
	height:34px;
	line-height:34px;
	text-align:center;
    font-size:16px;
    color:#FFF;
	background:#004ea2;
	border-radius:17px;
	float:left;
	clear:both;
	margin:0 0 15px;
  }
  
  section.summary dl dd {
	width:340px;
	height:auto;
	margin:0 0 15px 20px;
	float:left; 
	padding:6px 0 0;
	line-height:1.3em;
  }
  
  section.summary dl dd:last-child {
	clear:both;
	width:100%;
	margin:0;
  }
  
  section.summary figure {
	float:right;
	width:434px;
  }
  
  section.summary figure figcaption {
	display:inline-block;
	float:right;
	padding:0.4em 1em;
	font-size:1em;
	border:solid 1px #0188c6;
	text-align:center;
	border-radius:0.9em;
	line-height:1em;
	background:#e7f8ff;
	margin:5px 0 0;
  }
  
  section.summary figure figcaption::after {
	content: "\00bb";
	margin:0 0 0 0.5em;
	color:#0188c6;
  }
  
  section.summary figure figcaption a {
	text-decoration:none;
	color:#0188c6;  
  }
  
}

@media screen and (max-width: 768px){
  
  /* :::::::::: 【SP】お知らせ・ブログ欄 :::::::::: */
  
  
 section.notice dl::-webkit-scrollbar {
    width: 12px;
  }
  
  section.notice dl::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
  }
  
  section.notice dl::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
  }

  section.notice h2 {margin:0;}
  
  section.notice {
	width:96%;
	 margin:0 auto 8%!important; 
  }
  
  section.notice dl {
    width:100%;
    height:10em;
    overflow-y:scroll;
    box-sizing:border-box;
    margin:0;
	padding:0.5em;
  }
  
  section.notice dl dt{
    font-size:1.1em;
    line-height:1.1em;
    margin:0 0 2%;
	color:#e6ab0c;
  }
  
  section.notice dl dt span {
    font-size:0.8em;
  }
  
  section.notice dl dd{
    font-size:1em;
    line-height:1.3em;
	margin:0 0 3%;
	color:#212121;
  }
  
  
  /* :::::::::: 【SP】バナー :::::::::: */
  
  div.index_topic {
	width:96%;
	padding:2% 2% 0;
	background:#0188c6;
	margin:0 0 8%;
  }
  
  div.index_topic ul {
	width:100%;
	height:auto;
	overflow:hidden; 
	margin:0 auto; 
  }
  
  div.index_topic ul li {
	position:relative;
	width: 49%;
	height:auto;
	margin:0 2% 2% 0;
	float:left;
	list-style-type:none;
	overflow:hidden;
  }
  
  div.index_topic ul li:nth-of-type(2n) {margin:0;}
  
  div.index_topic ul li p {
	position:absolute;
    width:100%;
	padding:0.3em 0;
	font-size:1.1em;
	line-height:1.1em;
	color:#212121;
	background:rgba(255,255,255,0.8);
	text-align:center;
	bottom:0;
	z-index:100;
  }
  
  div.index_topic ul li img {
    display: block;
    height: auto;
    width: 100%;
  }

  /* :::::::::: 【SP】医院概要 :::::::::: */
  
  section.summary {
	width:96%;
	height:auto;
	margin:0 auto
  }
  
  section.summary .summary_left {
	width:100%;
	margin:0 0 5%;
  }
  
  section.summary dl {
	width:100%;
	height:auto;
	margin:0;
	text-align:center;
  }
  
  section.summary dl dt {
	display:inline-block;
	width:6em;
	height:auto;
	line-height:1.1em;
	text-align:center;
    font-size:1em;
    color:#FFF;
	background:#004ea2;
	border-radius:1em;
	padding:0.3em;
	clear:both;
	margin:0 0 2%;
  }
  
  section.summary dl dd {
	width:100%;
	height:auto;
	margin:0 auto 5%;
	padding:6px 0 0;
	line-height:1.3em;
  }
  
  section.summary dl dd a {text-decoration:none;}
  
  section.summary dl dd:last-child {
	clear:both;
	width:100%;
	margin:0;
  }
  
  section.summary figure {
	width:100%;
  }
  
  section.summary figure figcaption {
	display:inline-block;
	padding:0.4em 1em;
	font-size:1em;
	border:solid 1px #0188c6;
	text-align:center;
	border-radius:0.9em;
	line-height:1em;
	background:#e7f8ff;
	margin:2% 0 0;
  }
  
  section.summary figure figcaption::after {
	content: "\00bb";
	margin:0 0 0 0.5em;
	color:#0188c6;
  }
  
  section.summary figure figcaption a {
	text-decoration:none;
	color:#0188c6;  
  }
}

/* -----------------------------------------------------------
　下層ページ
----------------------------------------------------------- */

@media screen and (min-width: 769px){
  
  /* :::::::::: 【PC】初めての方へ :::::::::: */ 
  
  #first ul.belonging {
	width:100%;
	margin:0;  
  }
  
  #first ul.belonging li {
	box-sizing:border-box;
	width:100%;
	height:auto;
	overflow:hidden;
	padding:30px;
	background:#f9f6da;
	margin:0 0 15px;
	list-style-type:none;
  }
  
  #first ul.belonging li span {
	display:block;
	width:90px;
	height:90px;
	float:left;
	margin:0 30px 0 0;
	border-radius:5px;
  }
  
  #first ul.belonging li:nth-child(1) span {background:url(../images/sub/belonging01.png) no-repeat center center,#f6a031;}
  #first ul.belonging li:nth-child(2) span {background:url(../images/sub/belonging02.png) no-repeat center center,#f6a031;}
  #first ul.belonging li:nth-child(3) span {background:url(../images/sub/belonging03.png) no-repeat center center,#f6a031;}
  
  #first ul.belonging li dl {
	margin:0;
  }
  
  #first ul.belonging li dl dt {
    color:#f6a031;
	font-weight:bold;
	font-size:26px;
	margin:0 0 3px;
	line-height:1.1em;
  }
  
  #first ul.belonging li dl dd {
	margin:0;
	line-height:1.4em;
  }  
  
  #first ul.flow {
	width:100%;
	margin:0;  
  }
  
  #first ul.flow li {
	position:relative;
	box-sizing:border-box;
	width:100%;
	height:150px;
	padding:30px;
	background:#f9f6da;
	margin:0 0 50px;
	list-style-type:none;
  }
  
  #first ul.flow li:last-child {margin:0;}
  
  #first ul.flow li::after {
	position:absolute;
	display:block;
	content:"";
	width:0;
	height:0;
	margin:auto;
	border-top:solid 30px #0188c6;
	border-left:solid 20px transparent;
	border-right:solid 20px transparent;
	left:0;
	right:0;
	bottom:-40px;
  }
  
  #first ul.flow li:last-child::after {content:none;}
  
  #first ul.flow li span {
	display:block;
	width:90px;
	height:90px;
	float:left;
	margin:0 30px 0 0;
	border-radius:5px;
	background:#f6a031;
	font-size:40px;
	line-height:90px;
	text-align:center;
	color:#FFF;
  }
  
  #first ul.flow li dl {
	margin:0;
  }
  
  #first ul.flow li dl dt {
    color:#f6a031;
	font-weight:bold;
	font-size:26px;
	margin:0 0 3px;
	line-height:1.1em;
  }
  
  #first ul.flow li dl dd {
	margin:0;
	line-height:1.4em;
  }  
	 
  /* :::::::::: 【PC】クリニック紹介 :::::::::: */
  
  .gv_galleryWrap {margin:0 auto;}
  
  .flipsnap .item img  {
    width:100%;
  }
  
  .ContTxtArea p.comment {
    width:698px;
    height:39px;
    margin:20px auto;
    text-indent:-9999px;
  }    
    
  /* :::::::::: 【PC】アクセス・診療時間 :::::::::: */   
  
  #access section.summary dl dd:last-child {
	clear:none;
	width:340px;
	margin:0 0 15px 20px;
  }  
    
  #access table.schedule {font-size:1.2em;}
  
  #access table.schedule td {padding:0.8em 0;}   
  
  section .map_box {
    position:relative;
    width:100%;
    height:400px;
	clear:both;
  }
  
  section iframe {
    width:100%;
    height:100%;
    pointer-events:none;
  }
  
  section .map_box .map_caution {  
    position:absolute;
    bottom:2%;
    left:2%;
    padding:3px;
    margin:0;
    background:#FFFFFF;
    max-width:85%;
    font-size:14px;
    line-height:16px;
  }  
}


@media screen and (max-width: 768px){
  
  /* :::::::::: 【SP】初めての方へ :::::::::: */ 
  
  #first ul.belonging {
	width:100%;
	margin:0;  
  }
  
  #first ul.belonging li {
	box-sizing:border-box;
	width:100%;
	height:auto;
	overflow:hidden;
	padding:1em 0.5em;
	background:#f9f6da;
	margin:0 0 3%;
	list-style-type:none;
  }
  
  #first ul.belonging li span {
	display:block;
	width:5em;
	height:5em;
	margin:0 auto 3%;
	border-radius:5px;
  }
  
  #first ul.belonging li:nth-child(1) span {background:url(../images/sub/belonging01.png) no-repeat center center,#f6a031;background-size:auto 60%;}
  #first ul.belonging li:nth-child(2) span {background:url(../images/sub/belonging02.png) no-repeat center center,#f6a031;background-size:auto 60%;}
  #first ul.belonging li:nth-child(3) span {background:url(../images/sub/belonging03.png) no-repeat center center,#f6a031;background-size:auto 60%;}
  
  #first ul.belonging li dl {
	margin:0;
  }
  
  #first ul.belonging li dl dt {
    color:#f6a031;
	font-weight:bold;
	font-size:1.2em;
	margin:0 0 1%;
	line-height:1.1em;
  }
  
  #first ul.belonging li dl dd {
	margin:0;
	line-height:1.4em;
  }  
  
  #first ul.flow {
	width:100%;
	margin:0;  
  }
  
  #first ul.flow li {
	position:relative;
	box-sizing:border-box;
	width:100%;
	height:13em;
	padding:1em 0.5em;
	background:#f9f6da;
	margin:0 0 3em;
	list-style-type:none;
  }
  
  #first ul.flow li:nth-child(2) {height:15em;}
  #first ul.flow li:nth-child(3) {height:16em;margin:0;}
  
  #first ul.flow li::after {
	position:absolute;
	display:block;
	content:"";
	width:0;
	height:0;
	margin:auto;
	border-top:solid 1em #0188c6;
	border-left:solid 0.6em transparent;
	border-right:solid 0.6em transparent;
	left:0;
	right:0;
	bottom:-2em;
  }
  
  #first ul.flow li:last-child::after {content:none;}
  
  #first ul.flow li span {
	display:block;
	width:2em;
	height:2em;
	margin:0 auto 3%;
	border-radius:5px;
	background:#f6a031;
	font-size:2em;
	line-height:2em;
	text-align:center;
	color:#FFF;
  }
  
  #first ul.flow li dl {
	margin:0;
  }
  
  #first ul.flow li dl dt {
    color:#f6a031;
	font-weight:bold;
	font-size:1.2em;
	margin:0 0 1%;
	line-height:1.1em;
  }
  
  #first ul.flow li dl dd {
	margin:0;
	line-height:1.4em;
  }  
  
  /* :::::::::: 【SP】クリニック紹介 :::::::::: */
  
  /*** 画面幅に対しての画像の表示サイズ
  　　 max-widthは画像ファイルの横幅サイズ ****/
  
  .viewport {
    width:80%;
    max-width:662px;
    overflow:hidden;
    margin:0 auto;
  }
  
  /*** 画像枚数×100% ****/
  
  .flipsnap {
    width:600%;
  }
  
  ul.flipsnap  {
    margin:0;
  }
  
  /*** 100%÷画像枚数 ****/
  .item {
    float:left;
    width:calc(100% / 6);
    cursor:pointer;
    overflow:hidden;
  }
  
  .item p {
    padding:3px 0 8px 0;
    font-weight:bold;
    color:#333;
    text-align:center;
  }
  p.comment {
    text-align:center;
    margin-top:10px;
  }
  
  /* :::::::::: 【SP】アクセス・診療時間 :::::::::: */
  
  section .map_box {
    position:relative;
    width:97%;
    height:20em;    
    margin:0 auto 5%;
  }

  section iframe {
    width:100%;
    height:100%;
    pointer-events:none;
  }
  
  section .map_box .map_caution {  
    position:absolute;
    bottom:2%;
    left:2%;
    padding:3px;
    margin:0;
    background:#FFFFFF;
    max-width:80%;
    font-size:13px;
    line-height:15px;
  }    
  
}