@charset "UTF-8";
/* Scss Document */
/* =======================================================================
 共通項目 
======================================================================= */
/* ----------------------------------------------------------- 関数
----------------------------------------------------------- */
/*基本フォント*/
/*基本文字色*/
/*基本背景色*/
/*media screen*/
/* ----------------------------------------------------------- フォントサイズ基本
----------------------------------------------------------- */
html { font-size: calc( 100vw / 32 ); overflow-y: auto; font-family: "メイリオ", Meiryo, Arial, "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #333333; background-color: #faf7e6; }

@media screen and (min-width: 768px) { html { font-size: 62.5%; overflow-y: scroll; font-family: "メイリオ", Meiryo, Arial, "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #333333; background-color: #faf7e6; } }
/* ----------------------------------------------------------- 構成
----------------------------------------------------------- */
body { position: relative; width: 100%; margin: 0 auto; }

section { height: auto; overflow: hidden; margin: 40px 0 0 0; }
section.first { margin: 0 0 0 0; }

.sentence { height: auto; overflow: hidden; }

.pc_none { display: block; }

.sp_none { display: none; }

.mt10 { margin-top: 1rem !important; }

@media screen and (min-width: 768px) { body { position: relative; z-index: 0; }
  section { height: auto; overflow: hidden; margin: 40px 0 0 0; }
  section.first { margin: 0 0 0 0; }
  .pc_none { display: none; }
  .sp_none { display: block; } }
/* -----------------------------------------------------------
　イメージ
----------------------------------------------------------- */
/*画像右回り込みあり*/
.img_right { margin: 0 0 10px 0; text-align: center; }
.img_right img { width: 70%; height: auto; }

.img_right img { width: 70%; height: auto; }

/*画像左*/
.img_left { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-flex-direction: column; flex-direction: column; }
.img_left div { order: 2; width: 100%; }
.img_left div img { width: 100%; height: auto; margin: 10px 0; }
.img_left div a { width: 96%; margin: 0 0 10px 0; display: block; font-size: 4vw; color: #3676b2; text-decoration: none; }
.img_left p { order: 1; width: 100%; line-height: 180%; }

@media screen and (min-width: 768px) { /*画像右回り込みあり*/
  .img_right { float: right; margin: 0 0 10px 10px; }
  .img_right img { width: 300px; height: auto; }
  /*画像左*/
  .img_left { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-direction: row; flex-direction: row; }
  .img_left div { order: 1; width: 360px; }
  .img_left div img { width: 360xp; height: auto; margin: 0 0  10px 0; }
  .img_left div a { width: 360xp; margin: 0 0 10px 0; display: block; font-size: 1.6rem; color: #3676b2; text-decoration: none; }
  .img_left p { order: 2; width: 500px; line-height: 200%; } }
/* -----------------------------------------------------------
　リスト
----------------------------------------------------------- */
ul.list_maru { padding: 0; }
ul.list_maru li { line-height: 130%; font-size: 1.4rem; list-style-type: none; margin: 0 0 10px 0; box-sizing: border-box; background: url(../images/maru.gif) no-repeat; background-position: left top 0.4rem; padding: 0 0 0 5%; line-height: 140%; }
ul.list_maru li .arrow li { margin: 0; padding: 0 0 0 1.5em; text-indent: -1.5em; background: none; }
ul.list_maru li .arrow li::before { content: '→'; margin-right: 0.5em; }

ul.list_normal { line-height: 160%; font-size: 1.4rem; list-style-type: disc; margin: 0; }
ul.list_normal li { margin: 0 0 15px 0; padding: 0 0 0 5px; }

ul.list_normal_two { display: flex; justify-content: space-between; flex-direction: column; }
ul.list_normal_two li { box-sizing: border-box; line-height: 130%; font-size: 1.6rem; list-style-type: disc; margin: 0 0 10px 25px; }

@media screen and (min-width: 768px) { ul.list_maru { padding: 0; }
  ul.list_maru li { line-height: 100%; font-size: 1.6rem; list-style-type: none; margin: 0 0 20px 0; box-sizing: border-box; background: url(../images/maru.gif) no-repeat; background-position: left top 4px; padding: 0 0 0 20px; line-height: 140%; }
  ul.list_normal { line-height: 160%; font-size: 1.6rem; list-style-type: disc; }
  ul.list_normal li { margin: 0 0 15px 0; }
  ul.list_normal_two { display: flex; justify-content: space-between; flex-direction: row; flex-wrap: wrap; }
  ul.list_normal_two li { width: 45%; box-sizing: border-box; line-height: 130%; font-size: 1.6rem; list-style-type: disc; margin: 0 0 10px 25px; } }
/* -----------------------------------------------------------
　枠
----------------------------------------------------------- */
article { height: auto; overflow: hidden; width: 100%; margin: 47vw auto 0 auto; padding: 0 0 0 0; }
article.low { margin: 0 auto; }

.wrapper { height: auto; width: 100%; margin: 40px auto 0 auto; }

.main { width: 96%; margin: 0 auto; }

@media screen and (min-width: 768px) { article { height: auto; overflow: hidden; width: 100%; margin: 0 auto; padding: 0 0 110px 0; }
  article.low { margin: 0 auto; }
  .wrapper { height: auto; width: 1020px; margin: 40px auto 0 auto; padding: 0 0 0 0; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-direction: row; flex-direction: row; }
  .main { width: 740px; margin: 0 0 0 0; padding: 0 0 0 0; } }
/* -----------------------------------------------------------
　色枠
----------------------------------------------------------- */
.blue_frame { background-color: #e7f6fd; color: #333333; border: #683008  1px solid; padding: 10px; }

.blue_frame2 { background-color: #41baee; color: #ffffff; border: #683008 1px solid; padding: 10px; }

@media screen and (min-width: 768px) { .blue_frame { background-color: #e7f6fd; color: #333333; border: #683008  1px solid; padding: 10px; }
  .blue_frame2 { background-color: #41baee; color: #ffffff; border: #683008 1px solid; padding: 10px; } }
/* -----------------------------------------------------------
　テーブル
----------------------------------------------------------- */
/*診療時間*/
table.two_table { padding: 0px; vertical-align: middle; width: 100%; margin: 20px 0 20px 0; text-align: center; border-collapse: collapse; box-sizing: border-box; }
table.two_table tr { margin: 0px; padding: 0px; vertical-align: middle; }
table.two_table tr th { background-color: #e7f6fd; padding: 5px; text-align: center; font-weight: normal; color: #333333; font-size: 1.4rem; vertical-align: middle; box-sizing: border-box; border: #683008 1px solid; }
table.two_table tr th.two_table_left { width: 30%; }
table.two_table tr th.two_table_right { width: 70%; }
table.two_table tr td { text-align: left; padding: 5px; color: #333333; font-size: 1.4rem; vertical-align: middle; box-sizing: border-box; background-color: #ffffff; border: #683008 1px solid; }

@media screen and (min-width: 768px) { /*診療時間*/
  table.two_table { padding: 0px; vertical-align: middle; width: 100%; margin: 20px 0 40px 0; text-align: center; border-collapse: collapse; box-sizing: border-box; }
  table.two_table tr { margin: 0px; padding: 0px; vertical-align: middle; }
  table.two_table tr th { background-color: #e7f6fd; padding: 5px; text-align: center; font-weight: normal; color: #333333; font-size: 1.6rem; vertical-align: middle; box-sizing: border-box; border: #683008 1px solid; }
  table.two_table tr th.two_table_left { width: 30%; }
  table.two_table tr th.two_table_right { width: 70%; }
  table.two_table tr td { text-align: left; padding: 10px; color: #333333; font-size: 1.6rem; vertical-align: middle; box-sizing: border-box; background-color: #ffffff; border: #683008 1px solid; } }
/* -----------------------------------------------------------
　アサイド
----------------------------------------------------------- */
aside { display: none; }

@media screen and (min-width: 768px) { aside { display: block; width: 260px; }
  aside ul { list-style-type: none; font-size: 1.6rem; margin: 0; padding: 0; }
  aside ul li { border-bottom: #683008 1px dashed; margin: 5px 0 0 0; padding: 0 0 5px 0; font-size: 1.6rem; }
  aside ul li a { text-decoration: none; color: #683008; border: #d0cab6 1px solid; border-radius: 10px; display: block; width: 100%; padding: 15px 5px; box-sizing: border-box; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e8e4cc+0,e3debc+100 */ background: #e8e4cc; /* Old browsers */ background: -moz-linear-gradient(top, #e8e4cc 0%, #e3debc 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #e8e4cc 0%, #e3debc 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #e8e4cc 0%, #e3debc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e4cc', endColorstr='#e3debc',GradientType=0 ); /* IE6-9 */ }
  aside ul li a i { display: inline; margin: 0 10px 0 0; }
  aside ul li a:hover { opacity: 0.6; }
  aside ul li:first-child { margin: 0 0 0 0; }
  aside a.aside_bana { margin: 5px 0 0 0; display: block; }
  aside a.aside_bana:hover { opacity: 0.6; }
  aside ul.bnr2 { list-style-type: none; font-size: 1.6rem; margin: 2rem 0 0 !important; padding: 0; }
  aside ul.bnr2 li { border-bottom: none; margin: 5px 0 0 0; padding: 0 0 5px 0; font-size: 2rem; }
  aside ul.bnr2 li a { text-decoration: none; color: #fff; border: #d0cab6 1px solid; border-radius: 10px; display: block; width: 100%; padding: 15px 5px; box-sizing: border-box; background: #009fe3; /* Old browsers */ }
  aside ul.bnr2 li a i { display: inline; margin: 0 10px 0 0; }
  aside ul.bnr2 li a:hover { opacity: 0.6; }
  aside ul.bnr2 li a.kumanomae { background: #F39801; }
  aside ul.bnr2 li:first-child { margin: 0 0 0 0; }
  aside a.aside_bana { margin: 5px 0 0 0; display: block; }
  aside a.aside_bana:hover { opacity: 0.6; } }
/* -----------------------------------------------------------
　見出し
----------------------------------------------------------- */
h1 { margin: 0; }

h2 { font-size: 1.8rem; background-color: #009fe3; padding: 5px 10px; box-sizing: border-box; border-radius: 5px; margin: 30px 0 15px 0; }
h2 span { color: #ffffff; border-left: #ffffff 6px solid; padding: 0 0 0 8px; }
h2.first { margin: 0 0 15px 0; }

h3 { color: #683008; border-bottom: #683008 1px solid; font-size: 1.6rem; font-weight: normal; padding: 0 0 5px 15px; margin: 20px 0 15px 0; line-height: 140%; }
h3.first { margin: 0 0 15px 0; }

h4 { color: #ffffff; background-color: #85cfee; font-size: 1.6rem; font-weight: normal; padding: 10px 15px; margin: 20px 0 15px 0; }
h4.first { margin: 0 0 15px 0; }

h5 { font-size: 1.6rem; font-weight: normal; margin-bottom: 15px; }

.tit_05 { border-radius: 10px; border: 1px solid #683008; background: #FFF; padding: 5px 10px; }

p { font-size: 1.4rem; margin: 0 0 15px 0; line-height: 160%; }

.opa:hover { opacity: 0.8; }

@media screen and (min-width: 768px) { h1 { margin: 0; }
  h2 { font-size: 2.8rem; background-color: #009fe3; padding: 10px; box-sizing: border-box; border-radius: 5px; margin: 30px 0 15px 0; }
  h2 span { color: #ffffff; border-left: #ffffff 6px solid; padding: 0 0 0 14px; }
  h2.first { margin: 0 0 15px 0; }
  h3 { color: #683008; border-bottom: #683008 1px solid; font-size: 2.3rem; font-weight: normal; padding: 0 0 5px 30px; margin: 20px 0 15px 0; line-height: 140%; }
  h3.first { margin: 0 0 15px 0; }
  h4 { color: #ffffff; background-color: #85cfee; font-size: 2rem; font-weight: normal; padding: 13px 30px; margin: 20px 0 15px 0; }
  h4.first { margin: 0 0 15px 0; }
  p { font-size: 1.6rem; margin: 0 0 15px 0; line-height: 160%; } }
/* -----------------------------------------------------------
　ヘッダ
----------------------------------------------------------- */
header { width: 96%; margin: 10px auto 15px auto; }
header .head_frame { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-flex-direction: column; flex-direction: column; width: 98%; margin: 0 auto; }
header .head_frame .head_logo { width: 100%; }
header .head_frame .head_logo img { width: 80%; height: auto; }
header .head_frame .head_logo p { font-size: 3vw; text-align: center; }
header .head_frame .head_info { text-align: center; font-size: 1.6rem; color: #333333; }
header .head_frame .head_info p { margin: 0 0 10px 0; line-height: 160%; }
header .head_frame .head_info p.head_info_tel { font-size: 2rem; color: #683008; }
header .head_frame .head_info p.head_info_tel span span { font-size: 1.6rem; }
header .head_frame .head_info p.head_info_tel a { font-size: 2rem; color: #683008; text-decoration: none; }
header .head_frame .head_time { display: none; }

@media screen and (min-width: 768px) { header { width: 100%; margin: 10px auto 0 auto; }
  header .head_frame { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-direction: row; flex-direction: row; width: 1020px; margin: 0 auto; }
  header .head_frame .head_logo { width: 390px; margin: 12px 0 0 0; }
  header .head_frame .head_logo img { width: 358px; height: auto; }
  header .head_frame .head_logo p { font-size: 1.2rem; text-align: center; margin: 10px 0 0 0; }
  header .head_frame .head_info { width: 350px; text-align: center; font-size: 1.6rem; color: #333333; }
  header .head_frame .head_info p { margin: 20px 0 5px 0; line-height: 160%; }
  header .head_frame .head_info p.head_info_tel { font-size: 2.8rem; color: #683008; }
  header .head_frame .head_info p.head_info_tel span span { font-size: 2rem; }
  header .head_frame .head_time { display: block; width: 340px; } }
/* -----------------------------------------------------------
　キービジュアル
----------------------------------------------------------- */
.key_visual { width: 98%; margin: 0 auto; position: relative; }
.key_visual img { width: 100%; height: auto; }
.key_visual p.key_text_01 { position: relative; top: 43vw; text-align: center; color: #ffffff; font-size: 1.6rem; background-color: #009fe3; width: 90%; margin: 0 auto; padding: 5px 0; border-radius: 8px; }
.key_visual p.key_text_02 { position: relative; top: 44vw; text-align: center; color: #ffffff; font-size: 1.6rem; background-color: #50b7e3; width: 90%; margin: 0 auto; padding: 5px 0; border-radius: 8px; }
.key_visual p.key_text_03 { position: relative; top: 50vw; text-align: center; font-size: 1.5rem; width: 96%; margin: 0 auto; color: #6a3d1c; }
.key_visual p.key_text_04 { position: relative; left: 50%; font-weight: bold; transform: translate(-53%, 145%); text-align: center; font-size: 1.6rem; background: #FFEF6C; width: 90%; margin: 0 auto; padding: 5px 0; border-radius: 20px; border: 4px solid #FFC800; }
.key_visual p.key_text_04 .lightblue { color: #009fe3; }
.key_visual p.key_text_04 .red { color: #f44336; }
.key_visual p.key_text_04 .sp_hidden { display: none; }
.key_visual p.key_text_04 .sp_block { display: block; }

/*下層*/
.key_visual_low { background: url(../images/key_visual_ud.jpg) no-repeat; background-size: contain; width: 100%; height: 15vw; display: -webkit-flex; display: flex; -webkit-justify-content: flex-end; justify-content: flex-end; align-items: flex-end; color: #009fe7; font-size: 1.7rem; box-sizing: border-box; padding: 5px; box-sizing: border-box; text-shadow: 2px 0px 2px #ffffff,2px 0px 2px #ffffff, -2px 0px 2px #ffffff,-2px 0px 2px #ffffff, 0px 2px 2px #ffffff,0px 2px 2px #ffffff,  0px -2px 2px #ffffff,0px -2px 2px #ffffff; }
.key_visual_low.h1_left { -webkit-justify-content: flex-start; justify-content: flex-start; align-items: center; }
.key_visual_low .key_tel { color: #683008; font-size: 60%; display: block; }
.key_visual_low .key_tel a { font-size: 140%; color: #683008; text-decoration: none; }

@media screen and (min-width: 768px) { .key_visual { width: 1020px; margin: 10px auto 0 auto; position: relative; }
  .key_visual img { width: 1020px; height: auto; }
  .key_visual p.key_text_01 { position: absolute; top: 230px; left: 0; right: 0; text-align: center; color: #ffffff; font-size: 2.4rem; background-color: #009fe3; /*width: 480px;*/ width: 680px; margin: 0 auto; padding: 10px 0; border-radius: 8px; }
  .key_visual p.key_text_02 { position: absolute; top: 180px; left: 0; right: 0; text-align: center; color: #ffffff; font-size: 2.4rem; background-color: #50b7e3; width: 480px; margin: 0 auto; padding: 10px 0; border-radius: 8px; }
  .key_visual p.key_text_03 { position: absolute; top: 300px; height: 100px; text-align: center; font-size: 2.6rem; width: 100%; margin: 0 auto; color: #6a3d1c; background-color: rgba(255, 255, 255, 0.7); box-sizing: border-box; padding: 16px 0 0 0; }
  .key_visual p.key_text_04 { position: absolute; width: 85%; transform: translate(-50%, 165%); font-size: 2.6rem; }
  /*下層*/
  .key_visual_low { background: url(../images/key_visual_ud.jpg) no-repeat; background-size: contain; width: 1020px; height: 149px; display: -webkit-flex; display: flex; -webkit-justify-content: flex-end; justify-content: flex-end; align-items: flex-end; color: #009fe7; font-size: 3rem; box-sizing: border-box; padding: 4px 25px; margin: 0 auto; box-sizing: border-box; text-shadow: 2px 0px 2px #ffffff,2px 0px 2px #ffffff, -2px 0px 2px #ffffff,-2px 0px 2px #ffffff, 0px 2px 2px #ffffff,0px 2px 2px #ffffff,  0px -2px 2px #ffffff,0px -2px 2px #ffffff; }
  .key_visual_low.h1_left { -webkit-justify-content: flex-start; justify-content: flex-start; align-items: center; }
  .key_visual_low .key_tel { color: #683008; font-size: 80%; }
  .key_visual_low .key_tel a { font-size: 140%; color: #683008; text-decoration: none; } }
/* -----------------------------------------------------------
　診療時間
----------------------------------------------------------- */
@media screen and (min-width: 768px) { /*診療時間*/
  table.timetable { padding: 0px; vertical-align: middle; width: 100%; margin: 0; text-align: center; border-collapse: collapse; box-sizing: border-box; }
  table.timetable tr { margin: 0px; padding: 0px; vertical-align: middle; border-bottom: #cccccc 1px solid; border-left: #cccccc 1px solid; border-right: #cccccc 1px solid; }
  table.timetable tr th { background-color: #009fe3; padding: 5px 0; text-align: center; font-weight: normal; color: #fff; font-size: 1.4rem; vertical-align: middle; box-sizing: border-box; }
  table.timetable tr td { text-align: center; padding: 5px 0; color: #00afec; font-size: 1.6rem; vertical-align: middle; box-sizing: border-box; background-color: #ffffff; }
  table.timetable tr td.time { width: 110px; color: #313131; font-size: 1.4rem; }
  .notice_time { font-size: 1.4rem; color: #333333; line-height: 120%; text-align: center; margin: 5px 0 0 0; } }
/* -----------------------------------------------------------
　医院概要診療時間
----------------------------------------------------------- */
/*診療時間*/
table.timetable2 { padding: 0px; vertical-align: middle; width: 100%; margin: 20px 0 20px 0; text-align: center; border-collapse: collapse; box-sizing: border-box; }
table.timetable2 tr { margin: 0px; padding: 0px; vertical-align: middle; border-bottom: #cccccc 1px solid; border-left: #cccccc 1px solid; border-right: #cccccc 1px solid; }
table.timetable2 tr th { background-color: #009fe3; padding: 5px 0; text-align: center; font-weight: normal; color: #fff; font-size: 1.4rem; vertical-align: middle; box-sizing: border-box; }
table.timetable2 tr td { text-align: center; padding: 5px 0; color: #00afec; font-size: 1.4rem; vertical-align: middle; box-sizing: border-box; background-color: #ffffff; }
table.timetable2 tr td.time { width: 40%; color: #313131; font-size: 1.4rem; }

@media screen and (min-width: 768px) { /*診療時間*/
  table.timetable2 { padding: 0px; vertical-align: middle; width: 100%; margin: 20px 0 40px 0; text-align: center; border-collapse: collapse; box-sizing: border-box; }
  table.timetable2 tr { margin: 0px; padding: 0px; vertical-align: middle; border-bottom: #cccccc 1px solid; border-left: #cccccc 1px solid; border-right: #cccccc 1px solid; }
  table.timetable2 tr th { background-color: #009fe3; padding: 5px 0; text-align: center; font-weight: normal; color: #fff; font-size: 1.6rem; vertical-align: middle; box-sizing: border-box; }
  table.timetable2 tr td { text-align: center; padding: 5px 0; color: #00afec; font-size: 1.6rem; vertical-align: middle; box-sizing: border-box; background-color: #ffffff; }
  table.timetable2 tr td.time { width: 190px; color: #313131; font-size: 1.6rem; } }
/* -----------------------------------------------------------
　メインナビ
----------------------------------------------------------- */
.main_nav_pc { display: none; }

@media screen and (min-width: 768px) { .main_nav_pc { display: block; width: 100%; height: 60px; margin: 420px 0 0 0; }
  .main_nav_pc nav { width: 1020px; height: 60px; margin: 0 auto; }
  .main_nav_pc nav ul { list-style-type: none; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-direction: row; flex-direction: row; width: 1020px; box-sizing: border-box; background-color: #683008; height: 60px; padding: 0; }
  .main_nav_pc nav ul li { display: block; text-align: center; box-sizing: border-box; font-size: 1.6rem; overflow: hidden; height: 60px; width: 170px; }
  .main_nav_pc nav ul li a { text-decoration: none; display: block; color: #ffffff; height: 40px; padding: 10px 0 0 0; }
  .main_nav_pc nav ul li a span { border-left: #ffffff 1px solid; text-align: center; display: block; width: 100%; margin: 0 0 0 0; height: 40px; line-height: 150%; box-sizing: border-box; padding: 10px 0 0 0; }
  .main_nav_pc nav ul li a:hover { opacity: 0.6; }
  .main_nav_pc nav ul li:first-child a span { border-left: none; }
  .nav_low { margin: 0 0 0 0; } }
/* -----------------------------------------------------------
　ハンバーガー
----------------------------------------------------------- */
/*ハンバーガーアイコン*/
.nav_icon_frame { position: absolute; cursor: pointer; right: 2%; top: 0px; z-index: 99999; padding: 12px 0 0 0; box-sizing: border-box; background-color: #683008; border: #683008 4px solid; }

.nav__icon { width: 40px; height: 28px; }
.nav__icon span { background: #ffffff; position: absolute; left: 0; right: 0; width: 30px; height: 3px; border-radius: 4px; text-align: center; margin: 0 auto; }
.nav__icon span:nth-of-type(1) { top: 4px; }
.nav__icon span:nth-of-type(2) { top: 12px; }
.nav__icon span:nth-of-type(3) { top: 20px; }
.nav__icon p { font-size: 12px; margin: 14px 0 0 0; text-align: center; color: #ffffff; font-weight: bold; }

.nav__icon, .nav__icon span { display: inline-block; transition: all .4s; box-sizing: border-box; z-index: 999; }

.nav__icon.active span:nth-of-type(1) { -webkit-transform: translateY(8px) rotate(-45deg); transform: translateY(8px) rotate(-45deg); }

.nav__icon.active span:nth-of-type(2) { display: none; }

.nav__icon.active span:nth-of-type(3) { -webkit-transform: translateY(-8px) rotate(45deg); transform: translateY(-8px) rotate(45deg); }

.drawr { display: none; position: absolute; top: 20vw; right: 0; left: 0; width: 98%; padding: 0; margin: 0 auto 0 auto; height: auto; z-index: 999999; background-color: #683008; }

.openNav { display: block; }

/*ハンバーガーナビ*/
.main_nav_sp { display: block; width: 100%; height: auto; margin: 0; }

.main_nav_sp nav { width: 100%; margin: 0 auto; }

.main_nav_sp ul { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-flex-direction: column; flex-direction: column; width: 100%; box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0; }

.main_nav_sp ul li { width: 100%; text-align: center; font-weight: normal; font-size: 4.8vw; letter-spacing: 0.05em; line-height: 140%; list-style-type: none; box-sizing: border-box; padding: 0 0 0 0.5em; border-bottom: #cccccc 1px solid; }

.main_nav_sp ul li:first-child { border-top: #cccccc 1px solid; }

.main_nav_sp ul li a { color: #ffffff; text-decoration: none; width: 100%; display: block; padding: 10px 0; text-shadow: none; box-sizing: border-box; }
.main_nav_sp ul li a i { display: none; }

.main_nav_sp ul li.navi-blue { border-bottom: #ccc 1px solid; background-color: #009fe3; }

.main_nav_sp ul li.navi-orange { border-bottom: #ccc 1px solid; background-color: #F39801; }

.main_nav_sp ul li:last-child a { color: #ffffff; text-decoration: none; width: 100%; display: block; padding: 10px 0; text-shadow: none; box-sizing: border-box; }
.main_nav_sp ul li:last-child a i { display: none; }

@media screen and (min-width: 768px) { .main_nav_sp { display: none; } }
/* -----------------------------------------------------------
　お知らせ
----------------------------------------------------------- */
.notice_frame { padding: 0 3vw; box-sizing: border-box; overflow-y: scroll; height: 50vw; width: 96%; margin: 0 auto 30px auto; }
.notice_frame dl dt { margin: 0 0 10px 0; color: #009fe3; font-size: 1.6rem; }
.notice_frame dl dd { color: #333333; margin: 0 0 40px 0; font-size: 1.6rem; line-height: 130%; }

@media screen and (min-width: 768px) { .notice_frame { padding: 0; box-sizing: border-box; overflow-y: scroll; height: 232px; width: 720px; margin: 5px auto 0 auto; }
  .notice_frame dl { padding: 0; box-sizing: border-box; }
  .notice_frame dl dt { margin: 0 0 10px 0; color: #009fe3; font-size: 1.6rem; }
  .notice_frame dl dd { color: #333333; margin: 0 0 40px 0; font-size: 1.6rem; line-height: 130%; } }
/*スマホ用スライドバー*/
@media screen and (max-width: 767px) { .notice_frame::-webkit-scrollbar { width: 12px; background: #ffffff; }
  .notice_frame::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); border-radius: 10px; }
  .notice_frame::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); } }
/* -----------------------------------------------------------
　たいら整形外科の特長
----------------------------------------------------------- */
.features { width: 100%; height: auto; overflow: hidden; border-top: #9acde3 3px solid; border-bottom: #9acde3 3px solid; box-sizing: border-box; background-color: #ffffff; padding: 15px 0; margin: 0 0 10px 0; }
.features div { z-index: 0; }
.features div div { text-align: center; }
.features div div img { width: 90%; height: auto; }
.features div p { width: 98%; z-index: 2; line-height: 160%; margin: 15px auto 0 auto; text-align: left; }
.features.-open { background-color: #009fe3; border-top: #009fe3 3px solid; border-bottom: #009fe3 3px solid; }
.features.-open a { text-decoration: none; }
.features.-open p { width: fit-content; top: 5px; font-size: 1.8rem; font-weight: bold; text-align: center; font-size: 2.0rem; color: #fff; line-height: 1.5; }
.features.-open p span { line-height: 2; }
.features.-open p span.guide { display: block; margin-inline: auto; text-align: center; padding: .5em; margin-top: .5em; border-radius: 1.5em; color: #009fe3; background: #fff; font-size: 1.4rem; text-decoration: none; }
.features.-open p span.recruit { display: block; text-align: center; font-size: 1.6rem; text-decoration: none; }
@media screen and (min-width: 768px) { .features.-open p { padding: 0 .8em; text-align: initial; font-size: 2.8rem; }
  .features.-open p span.guide { font-size: 1.6rem; width: 65%; padding: initial; }
  .features.-open p span.recruit { font-size: 1.8rem; } }

@media screen and (min-width: 768px) { .features { width: 740px; height: 180px; overflow: hidden; border-top: #9acde3 3px solid; border-bottom: #9acde3 3px solid; box-sizing: border-box; background-color: #ffffff; padding: 0; margin: 0 0 10px 0; }
  .features div { position: relative; z-index: 0; }
  .features div div { display: inline-block; position: relative; margin: 0 0 0 403px; z-index: 1; }
  .features div div::after { position: absolute; display: block; content: ""; top: 0; left: 0; width: 100%; height: 100%; box-shadow: inset 80px 0 120px #fff; }
  .features div div img { width: auto; height: 174px; }
  .features div p { position: absolute; top: 50px; left: 5px; width: 450px; z-index: 2; line-height: 160%; margin: 0; } }
.prp { width: 100%; max-width: 740px; margin: 0 0 10px 0; padding: 15px 0; background-color: #fbe3d6; border-top: 3px solid #fbe3d6; border-bottom: 3px solid #fbe3d6; overflow: hidden; box-sizing: border-box; }
.prp div { position: relative; }
.prp div div { text-align: center; }
.prp div div img { width: 90%; height: auto; }
.prp div p { width: 98%; margin: 15px auto 0 auto; font-size: 1.6rem; font-weight: bold; line-height: 1.5; text-align: center; padding: 0 10px; }
.prp div p span { display: block; line-height: 2; }
.prp div p span.recruit { font-size: 1.6rem; }
.prp div p span.guide { margin: 0.5em auto 0; padding: 0.5em; border-radius: 1.5em; background: #e97132; color: #FFF; font-size: 1.4rem; text-align: center; text-decoration: none; width: 75%; }
.prp div p a { text-decoration: none; }
@media screen and (min-width: 768px) { .prp { width: 740px; height: 180px; padding: 0; background-color: #fbe3d6; border-top: 3px solid #fbe3d6; border-bottom: 3px solid #fbe3d6; }
  .prp div div { display: inline-block; margin-left: 403px; position: relative; }
  .prp div div::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-shadow: inset 80px 0 120px #fff; }
  .prp div div img { width: auto; height: 240px; }
  .prp div p { position: absolute; top: 15px; left: 5px; width: 360px; padding: 0 10px; margin: 0; font-size: 1.6rem; text-align: left; }
  .prp div p span.recruit { font-size: 1.8rem; }
  .prp div p span.guide { font-size: 1.6rem; width: 65%; padding: initial; } }

/* -----------------------------------------------------------
　医院概要
----------------------------------------------------------- */
.overview .overview_name { color: #009fe3; font-size: 1.8rem; text-align: center; }
.overview .overview_frame .overview_frame_left img { width: 100%; height: auto; }
.overview .overview_frame .overview_frame_left a.mapbtn { text-align: center; text-decoration: none; color: #ffffff; background-color: #683008; font-size: 1.6rem; border-radius: 3px; display: block; width: 100%; padding: 5px 0; }
.overview .overview_frame .overview_frame_right { margin: 30px 0 0 0; }
.overview .overview_frame hr { margin: 0 0 10px 0; border: none; border-bottom: #683008 1px solid; }
.overview .overview_frame .overview_title { color: #009fe3; font-size: 1.5em; }
.overview .overview_frame .overview_text { color: #333333; font-size: 1.5rem; }
.overview .overview_frame .overview_tel { padding: 10px 0 5px 0; color: #683008; font-size: 1.6rem; }
.overview .overview_frame .overview_tel span { font-size: 2rem; }
.overview .overview_frame .overview_tel a { font-size: 2rem; color: #683008; text-decoration: none; }
.overview iframe.googlemap { width: 100%; height: 250px; border: none; margin: 15px 0 0 0; }

@media screen and (min-width: 768px) { .overview .overview_name { color: #009fe3; font-size: 2.8rem; text-align: center; }
  .overview .overview_frame { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-direction: row; flex-direction: row; }
  .overview .overview_frame .overview_frame_left { width: 360px; }
  .overview .overview_frame .overview_frame_left img { width: 360px; height: auto; }
  .overview .overview_frame .overview_frame_left a.mapbtn { text-align: center; text-decoration: none; color: #ffffff; background-color: #683008; font-size: 1.6rem; border-radius: 3px; display: block; width: 100%; padding: 5px 0; margin: 10px 0 0 0; }
  .overview .overview_frame .overview_frame_right { margin: 0 0 0 0; width: 360px; }
  .overview .overview_frame hr { margin: 0 0 10px 0; border: none; border-bottom: #683008 1px solid; }
  .overview .overview_frame .overview_title { color: #009fe3; font-size: 1.5em; margin: 13px 0; }
  .overview .overview_frame .overview_text { color: #333333; font-size: 1.5rem; }
  .overview .overview_frame .overview_tel { padding: 10px 0 0 0; color: #683008; font-size: 2rem; line-height: 110%; }
  .overview .overview_frame .overview_tel span { font-size: 2.8rem; }
  .overview iframe.googlemap { width: 100%; height: 400px; border: none; margin: 35px 0 0 0; } }
/* -----------------------------------------------------------
　フッター
----------------------------------------------------------- */
.footer_frame { display: none; }

.copyright { text-align: center; box-sizing: border-box; margin: 0; color: #ffffff; padding: 5px 0; font-size: 1.2rem; background-color: #009fe3; margin: 0 0 0 0; }

.copyright a { color: #ffffff; text-decoration: none; padding: 5px 0; background-color: #009fe3; }

@media screen and (min-width: 768px) { footer { background-color: #50b7e3; padding: 30px 0 0 0; }
  .footer_frame { display: block; width: 1020px; margin: 0 auto; }
  .footer_frame ul { list-style-type: none; height: auto; text-align: center; margin: 0 auto; }
  .footer_frame ul:not(:last-of-type) { margin: 0 auto 20px; }
  .footer_frame ul li { display: inline; margin: 0 15px 0 0; }
  .footer_frame ul li a { color: #ffffff; text-decoration: none; font-size: 1.4rem; }
  .footer_frame ul li a::after { content: "|"; vertical-align: middle; margin: 0 0 0 10px; font-size: 1.2rem; }
  .footer_frame ul li:last-of-type a::after { content: ""; }
  .footer_frame ul li i { display: none; }
  .copyright { text-align: center; box-sizing: border-box; margin: 0; color: #ffffff; padding: 15px 0; font-size: 1.2rem; background-color: #009fe3; margin: 30px 0 0 0; }
  .copyright a { color: #ffffff; text-decoration: none; padding: 10px 0; background-color: #009fe3; } }
/* -----------------------------------------------------------
　ページトップへ
----------------------------------------------------------- */
#linkpagetop { float: right; }

#linkpagetop img { width: 100%; height: auto; }

#pagetop { position: fixed; bottom: 15vw; right: 0px; height: 15vw; text-align: center; margin: 0 2% 0 0; }

#pagetop a { display: block; color: #FFF; }

#pagetop_position { float: right; margin: 0px; padding: 0px; }

@media screen and (min-width: 768px) { #linkpagetop { float: left; }
  #linkpagetop img { width: 80px; height: auto; }
  #pagetop { position: fixed; bottom: 110px; left: 50%; margin: 0 0 0 600px; height: 110px; text-align: center; }
  #pagetop a { display: block; color: #ffffff; }
  #pagetop_position { float: right; margin: 0px; padding: 0px; } }
@media screen and (min-width: 768px) and (max-width: 1500px) { #pagetop { position: fixed; bottom: 80px; left: 90%; margin: 0 0 0 0; height: 105px; text-align: center; } }
/* -----------------------------------------------------------
　院長紹介
----------------------------------------------------------- */
.doctor_name { text-align: right; }

@media screen and (min-width: 768px) { .doctor_name { text-align: right; } }
/* -----------------------------------------------------------
　アクセス
----------------------------------------------------------- */
.access_map { width: 80%; height: auto; margin: 0 auto 40px auto; display: block; }

/* -----------------------------------------------------------
　医療連携病院
----------------------------------------------------------- */
.collaboration_frame ul li { list-style: none; margin-bottom: 15px; width: 96%; }
.collaboration_frame .collaboration_frame_left img { width: 100%; height: auto; border: 1px solid #ccc; }
.collaboration_frame .collaboration_frame_right img { width: 100%; height: auto; border: 1px solid #ccc; }

@media screen and (min-width: 768px) { .collaboration_frame { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-direction: row; flex-direction: row; margin-left: 30px; }
  .collaboration_frame ul li { list-style: none; margin-bottom: 15px; }
  .collaboration_frame .collaboration_frame_left { width: 302px; }
  .collaboration_frame .collaboration_frame_left img { width: 300px; height: auto; border: 1px solid #ccc; }
  .collaboration_frame .collaboration_frame_right { width: 302px; margin-right: 30px; }
  .collaboration_frame .collaboration_frame_right img { width: 300px; height: auto; border: 1px solid #ccc; } }
/* -----------------------------------------------------------
　自費診療
----------------------------------------------------------- */
#private .two_table tr td:last-of-type { text-align: right; width: 6em; }
@media screen and (min-width: 768px) { #private .two_table tr td:last-of-type { width: 10em; } }
#private .two_table.wide tr td:last-of-type { width: 50%; }
@media screen and (min-width: 768px) { #private .two_table.wide tr td:last-of-type { width: 50%; } }

/* -----------------------------------------------------------
Menubox
----------------------------------------------------------- */
.menubox { width: 100%; margin: 0px auto 40px; text-align: center; clear: both; }

.menubox:last-child { margin: 0 auto; }

.menucol { display: inline-block; width: 350px; margin: 0 8px 20px; }

.menucol .fig { height: 160px; margin-bottom: 0px; overflow: hidden; }

.menucol .fig img { width: 100%; height: 100%; border-top-right-radius: 10px; border-top-left-radius: 10px; box-sizing: border-box; object-fit: cover; }

.menucol .cap { color: #009FE3; background: #fff; padding-top: 10px; padding-bottom: 10px; font-size: 1.6em; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; }

.menucol a { text-decoration: none; }

@media screen and (max-width: 767px) { .menubox { width: 100%; margin: 0 auto; text-align: center; }
  .menucol { display: block; width: 90%; margin: 0 0 15px; margin: 0 auto 15px; }
  .menucol .fig { width: 100%; margin-bottom: 0px; border-top-right-radius: 10px; border-top-left-radius: 10px; }
  .menucol .fig img { width: 100%; height: auto; transform: translate(0%, -15%); overflow: hidden; } }
/* -----------------------------------------------------------
　運動器リハビリテーション施設基準認定（4月1日～）
----------------------------------------------------------- */
h2.reha-tbl-title { margin-top: 0; }

table.reha-tbl { background: #fff; font-size: 1.4em; border: 1px solid #009FE3; margin-bottom: 15px; }

table.reha-tbl tr th { background: #009FE3; color: #fff; padding: 0.5em; border-right: 0.1em solid #fff; }

table.reha-tbl tr th:last-child { border-right: none; }

table.reha-tbl tr td { padding: 0.5em; text-align: center; border: 0.1em solid #009FE3; }

table.reha-tbl tr td br { display: none; }

@media screen and (max-width: 767px) { h2.reha-tbl-title { font-size: 1.6em; letter-spacing: 1px; }
  h2.reha-tbl-title span { display: block; }
  table.reha-tbl { font-size: 1.2em; }
  table.reha-tbl tr td { font-size: 1em; vertical-align: middle; }
  table.reha-tbl tr td span { font-size: 0.8em; }
  table.reha-tbl tr td br { display: block; }
  table.reha-tbl th { vertical-align: middle; }
  table.reha-tbl th:nth-child(4) { width: 13%; }
  table.reha-tbl th:nth-child(5) { width: 32%; } }
@media screen and (max-width: 767px) { .fluid-image { width: 100%; height: auto; } }
.recruit_bnr { background: #F39801; text-align: center; font-size: 1.6rem; display: flex; justify-content: center; flex-wrap: wrap; padding: 2rem; }
.recruit_bnr dt { width: 100%; color: #fff; font-size: 2.8rem; font-weight: bold; }
@media screen and (max-width: 767px) { .recruit_bnr dt { font-size: 2.0rem; margin: 0 0 0.5rem; } }
.recruit_bnr dd { margin: 1.5rem 1rem 0; }
@media screen and (max-width: 767px) { .recruit_bnr dd { margin: 1rem 0 0; width: 100%; } }
.recruit_bnr dd a { display: inline-block; padding: 1rem 2rem; border-radius: 1.5em; color: #F39801; background: #fff; text-decoration: none; }
.recruit_bnr dd a:hover { opacity: 0.8; }
@media screen and (max-width: 767px) { .recruit_bnr dd a { display: block; }
  .recruit_bnr dd a:hover { opacity: 1; } }

.btn_link { display: inline-block; padding: 1rem 2rem; border-radius: 1.5em; color: #fff; background: #F39801; text-decoration: none; }
@media screen and (min-width: 768px) { .btn_link:hover { opacity: 0.8; } }

.youtube_modal { display: block; position: relative; }
.youtube_modal::before { position: absolute; top: 0; left: 0; display: block; content: ''; width: 100%; height: 100%; z-index: 1; background: url(../images/icon_play.png) no-repeat; background-position: center center; background-size: 64px 64px; }
@media screen and (min-width: 768px) { .youtube_modal::before { background-size: 96px 96px; } }
.youtube_modal img { width: 100%; height: auto; }

.bnr { margin-bottom: 15px; }
.bnr img { width: 100%; }

/*# sourceMappingURL=style.css.map */
