@charset "utf-8";
@import url("//share.cr-cms.net/hp_agency/hpagency.css");
@import url("//use.fontawesome.com/releases/v5.6.1/css/all.css");

/*-------------------------------------------
フラット01 グリーン 右メイン
-------------------------------------------*/

.pc{display:inline;}
.sp{display:none;}

.large_font_size{font-size: 1.8em !important;}

.ta_c{text-align:center !important;}
.ta_r{text-align:right !important;}
.ta_l{text-align:left !important;}

.mb0{margin-bottom: 0px !important;}
.pb0{padding-bottom: 0px !important;}
.m_auto{margin-left: auto; margin-right: auto;}

.fw_b{font-weight: bold;}

body, #contents{
 	font-size:16px;
 	line-height:1.8;
}

#contents{
	/*--background: #fdfff3;--*/
    /*--background: #f7f7f7;--*/
	width:100% !important;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}
#contents_outer{width:1024px;/*--width:980px;--*/ margin: 0px auto;}

#contents_body{background: #fff; padding-top:30px !important;}

#mainContents{margin-right: 20px;}
#sideContents{margin-left: 20px;}

#topMenu .topMenu li a,.footer *,.mainContents .article h5,#mainTopics .topics li p.date, #listTopics .topics li p.date,#mainTopics .topics li h3,#mainTopics .topics .description,.sideServices ul li a{font-size: 16px;}

a{color:#1fb8b5;}

#listTopics,
#mainTopics,#mainContents,#mainContents_outer,
#mainArticles,.mainArticles .article,
.mainArticles div.gallery{width: 690px;}

.mainArticles .article .image{max-width: 714px;}
.mainArticles .article_right .image{margin-right: 0;}
.mainArticles .article_left .image{margin-left: 0;}

#mainArticles a:hover img, #sideBanners a:hover img, div.freeHtml a:hover img, div.image img.gallery:hover, #title h1 a:hover {
    filter: alpha(opacity=75);
    -moz-opacity: 0.75;
    opacity: 0.75;
}

#mainImage,.mainImage{width:100% !important;}
.mainImage{border-top: #1fb8b5 3px solid;}
#mainImage{padding-top: 0px !important;}
.mainImage img {
    max-width: 100%; /*-- 初期状態にリセット --*/
	width:100%;
	height: 500px;
	object-fit: cover;
}

#title{
	width:100% !important;
	padding:15px 0px 0px !important;
}

#title h1 {
    margin: 0;
    padding: 0;
    text-align: left;
    height: 70px;
    width: 400px;
}
#title h1 a {
    background: url("/materials/174477151266901.png") no-repeat;
    background-size: contain;
    display: inline-block;
    overflow: hidden;
    text-indent: 110%;
    white-space: nowrap;
    height: 100%;
    width: 80%;
    margin-top: 8px;
}

#title_outer {
	/*--width: 100%;--*/
	/*--width:980px !important;--*/
    width:1024px !important;
    background: url(/materials/174477111941601.png) no-repeat right top;/*-- 電話番号部分 --*/
	margin:0px auto;
    background-size: 290px 70px;

}

#title_body{margin: 10px 0px;}

#title .description{position: absolute; top:0;}

#footer,.footer .services{background-image: none !important; background: #1fb8b5; color: #fff !important;}
#footer a,.footer .services a,.footer .copyright, .copyright a{color: #fff !important; text-decoration: none !important;}
#footer a:hover,.footer .services a:hover,.copyright a:hover{text-decoration: underline !important; color: #fff !important;}

#topMenu{position: relative !important; background-color: #1fb8b5 !important;}
#topMenu .topMenu li{padding: 0px !important; width:20% !important;}
#topMenu .topMenu li a{width:100% !important; color: #fff; line-height: 55px !important;}
#topMenu .topMenu li a:hover{color: #ccc;}


.gallery_grid li.galleryGrid .comment {
	text-align:center;
}
/*-------------------------------------------
改行
-------------------------------------------*/
.article p {
    margin-bottom: 1em;
}

/*wrap*/
#wrap{
 	background:#fff;
	/*--font-family: 'Noto Serif JP', serif;--*/
    font-family: 'Noto Sans JP', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'Hiragino Sans', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
}
#wrap_body{
	padding-top:0px;
}

/*注意事項のリスト用*/
ol.pp {
padding-left: 2em;
}
ol.pp li {
list-style-type: decimal;
padding: 5px;
}
ul.notes {

list-style-type: none;
margin-left:1em;
}
ul.notes li::before {
content: "◆";
margin-left: -1em;
font-family: "メイリオ", sans-serif;
}
ul.ps {
list-style-type: none;
margin-left:1em;
}
ul.ps li::before {
content: "※";
margin-left: -1em;
font-family: "メイリオ", sans-serif;
}

.cost .ps{
	background-color: #f7f7f7;
    border: solid 1px #ccc;
    padding: 5px 1em 5px 2em;
    margin: 1em 0;
    box-sizing: border-box;
}

ul.maru {

list-style-type: none;
margin-left:1em;
margin-bottom: 1em;
}
ul.maru li::before {
content: "●";
margin-left: -1em;
font-family: "メイリオ", sans-serif;
}

ul.simpleList {
    padding-left: 2em;
}
ul.simpleList li {
    list-style-type: disc;
    padding: 5px;
}

#products_list{width: 670px;}
#products_list li{
	width :210px;
	height: 70px; 
	display: inline-block;
	margin-bottom: 10px;
	margin-left: 0px !important;
	margin-right: 0px !important;
	padding: 0px !important;
	vertical-align: middle;
	
}
#products_list li a.linkbtn{
	display: block;
	box-sizing: border-box;
	width :210px;
	height: 70px !important;
	line-height: 30px;
	margin: 0px !important;
	padding:5px  0px !important;
	cursor: pointer;
}

.one_line{line-height: 60px !important;}

#products_list li:nth-of-type(2),#products_list li:nth-of-type(5),#products_list li:nth-of-type(8),#products_list li:nth-of-type(11),#products_list li:nth-of-type(14){
	padding-left: 5px !important; padding-right: 5px !important;
}

ul.StyleIconList {
    list-style: outside none;
    line-height: 2;
    padding-left: 2.2em;
}
ul.StyleIconList li {
    position: relative;
    font-size: 16px;
}
ul.StyleIconList li::before ,
ul.StyleIconList li::after {
    display: block;
    content: '';
    position: absolute;
}
ul.StyleIconList li::before {
    top: 0.4em;
    left: -1.9em;
    width: 1.2em;
    height: 1.2em;
    background-color: #ffde00;
    border-radius: 100%;
}
ul.StyleIconList li::after {
    top: 0.8em;
    left: -1.6em;
    width: 0.3em;
    height: 0.3em;
    border-right: 2px solid #FFF;
    border-bottom: 2px solid #FFF;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

ol.StyleOrderList {
    counter-reset: number 0;
    list-style: outside none none;
    padding-left: 40px;
    line-height: 2;
}
ol.StyleOrderList li::before {
    background: #2ba34a;
    border-radius: 50%;
    color: #fff;
    content: counter(number, decimal);
    counter-increment: number 1;
    display: inline-block;
    height: 2em;
    margin-left: -40px;
    margin-right: 0.5em;
    text-align: center;
    width: 2em;
    font-family: monospace;
}
ol.StyleOrderList li {
    margin-bottom: 0.4em;
}

/*------------------------------------------------

以下はユーザ側でtable（class無し）を作成された際の基本装飾になります。
このCSSに手は加えず、PCスマホとも、その他のtable装飾より上に記述してください。
なお、従来のnormalTblなどを装飾する際は、セレクタに.articleを付けてください。
記述例） .article table.normalTbl

------------------------------------------------*/

.article table:not(.contactTable) {
    border-collapse: collapse;
    border-left: 1px solid #ccc;
    border-spacing: 0;
    border-top: 1px solid #ccc;
    margin: 10px auto;
}
.article table:not(.contactTable) td,
.article table:not(.contactTable) th {
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    height: auto;
    padding: 10px;
    box-sizing: border-box;
}
.article table:not(.contactTable) th {
    background-color: #f7f7f7;
    text-align: center;
}

.article table.normalTbl,.freeHtml  table.normalTbl{
    border-collapse: collapse;
    border-left: 1px solid #ccc;
    border-spacing: 0;
    border-top: 1px solid #ccc;
    margin: 10px auto;
    width: 100%;
}
.article table.normalTbl th {
	background-color: #f7f7f7;
	color: #333;
	height: auto;
	line-height: 150%;
	/*--padding: 10px;--*/
	padding: 10px 8px;
	text-align: center;
	vertical-align: middle;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	width:30%;
    font-weight:normal;
}

.article table.normalTbl td {
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	height: auto;
	line-height: 150%;
	/*--padding: 10px;--*/
	padding: 10px 8px;
	width: 70%;
}

/* 診療時間 */
.article table.timeTbl,
.freeHtml table.timeTbl{
	border-collapse:collapse;
	width:100%;
	background-color: #FFF;
	margin-top: 20px;
	color: #666464;
}

.freeHtml table.timeTbl{font-size: 12px; margin: 0 0 10px;}

.article table.timeTbl th,
.article table.timeTbl td,
.freeHtml table.timeTbl th,
.freeHtml table.timeTbl td{
  padding:5px;
  text-align:center;
  border:solid 1px #ffde00;
  width: auto;
}
.article table.timeTbl th,
.freeHtml table.timeTbl th{
  /*--background:#f7f7f7;--*/
  background: #FFF47C;
}

.freeHtml  table.normalTbl th{
	background-color: #f7f7f7;
	color: #333;
	height: auto;
	line-height: 150%;
	padding: 10px 8px;
	text-align: center;
	vertical-align: middle;
	border-right: #ffde00 1px solid;
	border-bottom: #ffde00 1px solid;
	width:100%;
    font-weight:normal;
}

.freeHtml  table.normalTbl td{
	border-right: #CCC 1px solid;
	border-bottom: #CCC 1px solid;
	padding: 10px 8px;
	width:100%;
	text-align: center;
}

.freeHtml{margin-bottom: 20px;}
.freeHtml p{text-align: center;}
.freeHtml img{float:none !important; display: block; margin: 0px auto !important; margin-bottom: 20px !important;}

#sideContents{margin-top:0px !important; margin-bottom: 20px !important;}

.freeHtml table.timeTbl th{font-weight: normal;}
.freeHtml table.timeTbl th,
.freeHtml table.timeTbl td{padding:3px;}

.article table.priceTbl {
border-collapse: collapse;
border-left: 1px solid #ccc;
border-spacing: 0;
border-top: 1px solid #ccc;
margin: 10px auto;
width: 100%;
/*--float: left;--*/
}
.article table.priceTbl th {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
color: #333;
height: auto;
line-height: 150%;
padding: 5px;
text-align: center;
vertical-align: middle;
font-feature-settings : "palt";
width: 60%;
}
.article table.priceTbl td {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
height: auto;
line-height: 150%;
padding: 5px;
text-align: right;
vertical-align: top !important;
}

/*セル背景色指定*/
.th-no {
	width:10%;
    background: #ffb096;
}
.th-col {
    width: 15%;
    background: #ffcfb6;
}
.th-row,.th-row2 {
    background: #ffeede;
    font-weight: normal;
}
.th-row2,.td-col{font-size: 13px; text-align: right !important;}

.article table.priceTbl span{text-decoration: line-through; font-weight: normal !important; font-size: 11px !important; color: #333;}
.article table.priceTbl span.discount{background: #d9a220 !important; color: #fff !important; text-decoration: none !important; margin-right: 5px; padding: 2px;}
.article table.priceTbl td strong{color: #bf0000;}


/*-- お問い合わせ部分 --*/

table.contactTable label {
    font-size: 100%;
    width: 100%;
    display: inline-block;
}

table.contactTable input.button {
    background-image: none;
    background-color: #ffde00;
    color: #6d4500;
    border: none;
    display: block;
    font-size: 16px;
    height: 50px;
    letter-spacing: 5px;
    margin: 0 auto;
    outline: none;
    width: 150px;
}
table.contactTable input.button:hover {
    background-image: none;
	cursor: pointer;
}

table.contactTable input[name="form_back"] {
    background-image: none;
    background:#ccc;
	border: none;
	color:#333;
    display: block;
    font-size: 16px;
    height: 50px;
    letter-spacing: 5px;
    margin: 0 auto;
    margin-top:10px;
    outline: none;
    width: 150px;
}

/*汎用ボタン*/
a.linkbtn {
	background: #ffde00;
	/*--color: #fff;--*/
	color:#333;
	display: inline-block;
	margin:20px  0px;
	padding: 6px 18px;
	text-align: center;
	text-decoration: none;
    border-radius: 4px;
}
a.linkbtn:hover {
  filter: alpha(opacity=75);
  -moz-opacity:0.75;
  opacity:0.75;
  transition: 1.0s;
}

/*-- hタグ --*/

#mainArticles h2,.mainContents .article h3, #mainTopics h2, #listTopics h2, .mainContents div.gallery h3,#mainArticles .article h4,.mainContents .article h5{
	
}

#mainArticles h2{
    border-bottom: 0px none;
    color: #1fb8b5;
}

#mainTopics h2{border-bottom: 0px none;}

.pankuz p{border-bottom: 0px none;}

.mainContents .article h3, .mainContents div.gallery h3 {
    width: 100%;
	color: #1fb8b5;
	font-size: 20px;
	/*--line-height: 1;--*/
    line-height: 32px;
    min-height: 32px;
	margin: 20px 0;
    /*--margin: 20px 0;--*/
    /*--text-align: center;--*/
    /*--
    padding: 1.2em 0;
    border-top: solid 1px  #1fb8b5;
    border-bottom: solid 1px #1fb8b5;--*/
    position: relative;
}

.mainContents .article h3::before, .mainContents div.gallery h3::before{
    background: url("/materials/174478795831701.png") no-repeat;
    background-size: contain;
    content: "";
    width: 37px;
    height: 32px;
    display: inline-block;
    line-height: 32px;    
    vertical-align:text-bottom;
}

/*--#mainTopics h2, --*/
.mainContents .article h3 a, .article h3 a:hover {

}
#mainArticles .article h4 {
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-size: 1.1em;
}


.mainContents .article h5 {
	color:#33a6c1;
	font-weight: bold;
}

.envelope {
    text-align: center;
    display: block;
    background-color: #fdfff3;
    border: solid 1px #ccc;
    padding: 1em;
    margin: 1em 0;
    box-sizing: border-box;
}

.envelope h4{border-bottom: solid 2px #ccc;}

.marker {
    background : #ffecc0;
    background : linear-gradient(transparent 60%, #ffecc0 60%);
}


/*-- ご相談の流れ --*/

/* 表組テーブル */
table#flowTbl {
    border-collapse: collapse;
    border-spacing: 0;
    border: none;
    margin: 10px auto;
    width: 95%;
}
#flowTbl td {
    border: 4px solid #1fb8b5;
    border-radius: 8px;
    display: block;
    height: auto;
    margin-bottom: 56px;
    padding: 4%;
    position: relative;
}
#flowTbl td::after {
    color: #1fb8b5;
    content: "▼";
    font-family: monospace;
    font-size: 48px;
    left: 0;
    right: 0;
    top: 100%;
    bottom: auto;
    position: absolute;
    text-align: center;
    transform: scaleY(0.5);
}
#flowTbl tr:last-child td {
    margin-bottom: 0;
    /*--background:#FEE;--*/
}
#flowTbl tr:last-child td::after {
    display:none;
}
#flowTbl td strong {
    color: #6c8509;
    display: block;
    font-size: 130%;
    /*--font-style: italic;--*/
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-bottom: 5px;
}


.and_title .article_right .image {
    margin-top: 50px !important;
}

#guide img{  width: 211px;
  height: 140px;
  object-fit: cover; /* この一行を追加するだけ！ */}
  
  
  #line{
	background: #00b900 !important;
	padding: 10px;
	box-sizing: border-box;
	position: relative;
	height: 150px !important;
}
#line h3{
	font-size: 20px !important;
	background:#fff100 !important;
	color:#00b900 !important;
	font-weight: bold;
	padding: 3px 0px;
	margin-bottom: 10px !important;
	margin-right: 140px !important;
	border-left:0px none !important;
	text-align: center !important;
}
#line h4{ color:#fff100 !important; font-weight: bold; margin-right: 140px !important; text-align: center; margin-bottom: 10px; padding-bottom: 0px !important;}
#line h4 span{font-size: 18px !important;}
#line h4::after{background: none !important; height: 0px !important;}
#line h5{color:#fff !important; text-align: center !important; font-weight: bold; border-top:#fff 1px solid;  border-bottom:#fff 1px solid; margin-right: 140px !important; background: none !important;}
#line .image{margin: 0px !important; position: absolute; right: 10px !important; top:10px !important;}
#line img{width:130px !important;}

.sideBanner_body{padding: 0px !important; width:250px !important;}
.sideBanner_body img{width:100% !important;}

.sideServices h2{background: #1fb8b5;}

.sideServices ul{background: none; padding: 0px 0 15px; width: 250px;}
.sideServices ul li a{background-image: none; padding: 0;}

#sideMobile{background: #1ab1ae;}

/*-- サイド部分　関連施設　タイトル・ボタン --*/

.title_related{
  font-size: 14px;
  padding: 26px 30px;
  background: #1fb8b5;
  color: #fff;
}

.sideServices ul,
ul.side_related{padding-top: 5px;}

.sideServices ul li,
ul.side_related li {width: 250px; display: block; margin: 5px 0; box-sizing: border-box; background: #ffde00; border-radius: 4px; /*--background: #f7f7f7; border:#ccc 1px solid; --*/}

.sideServices ul li a,
ul.side_related li a{ display: block; text-decoration: none; /*--padding: 5px;--*/ padding:5px 10px 5px 25px; color: #6d4500; font-feature-settings: "palt"; letter-spacing: 0; /*--color: #333;--*/}

.sideServices ul a::before,
ul.side_related li a::before{
    font-family: "Font Awesome 5 Free";
    content: "\f105";
    font-weight: bold;
    margin-right: 5px;
    margin-left: -13px;
}

.sideServices ul a:hover,
ul.side_related li a:hover{background: #ffe84c; text-decoration: none !important;}



/*side*/
#sideContents {
    margin-top: 79px;
  }
  .side-logo {
      text-align: center;
        max-width: 240px;
      margin: 0 auto;
  }
  .side-logo img {
      width: 100%;
  }
  .license {
    font-size: .9em;
    font-feature-settings: 'palt';
    color: #666;
    padding-top: 10px;
    display: block;
  }
  .side-text{
    text-align:center;
    padding-top:10px;
  }
  .shop {
      padding: 10px 0;
      font-weight: bold;
      color:#444;
      border-top: 1px solid #ccc;
      line-height: 1.4em;
      font-size: 140%;
  }
  .add,.time {
      padding: 10px 0;
      border-top: 1px solid #ccc;
      line-height: 1.4em;
  }
  .tel {
      border-top: 1px solid #ccc;
      padding: 6px 0;
  }
  .tel-link {
    font-size: 1.3em;
    color: #1fb8b5;
  }
  .freeHtml iframe{margin: 10px 0 20px !important;}


/*ブログ一覧お知らせ*/
.mainContents .article h3 a, .article h3 a:hover {
color: #777;
text-decoration: none;
}

/* 記事半分 */
.mainArticles .articlehalf {
	width: 48.5%;
  	display: inline-block;
  	vertical-align: top;
    text-align:left;
    font-size:var(--font-size);
    padding: 1%;
    box-sizing: border-box;
	margin: 0px 2px 10px 2px;
}

.mainArticles .articlehalf img {
    margin-bottom: 0px;
  	max-width: 330px;
}

/* 記事3分の1 */
.mainArticles .article_one_third {
	width: 32.3%;
  	display: inline-block;
  	vertical-align: top;
    text-align:left;
    font-size:var(--font-size);
    /*--padding: 1%;--*/
    box-sizing: border-box;
	margin: 0px 2px 10px 2px;
}

.mainArticles .article_one_third img {
    margin-bottom: 0px;
  	/*--max-width: 170px;--*/
      max-width: 230px;
}
.mainArticles .article_one_third {
    padding-bottom: 0px;
    margin-bottom: 5px;
}

.mainArticles .articlehalf .article_body,
.mainArticles .article_one_third .article_body{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.mainArticles .articlehalf .article_body h4,
.mainArticles .article_one_third .article_body h4{order:1; text-align: center;}
.mainArticles .articlehalf .article_body .image,
.mainArticles .article_one_third .article_body .image{order:2;}
.mainArticles .articlehalf .article_body p,
.mainArticles .article_one_third .article_body p{order:3;}

table.contactTable input[type="text"], table.contactTable input[type="password"], table.contactTable textarea {
    font-size: 16px;
    padding: 4px 8px;
    font-family: inherit;
    border-color: #AAA;
}

#wrap {
    min-width: 1040px;
}

.mainTopics .topics li h3 {
    font-size: 18px;
}

.mainTopics .topics li .description,
.mainTopics .topics li .more a{
    font-size: 14px;
}

.gallery_grid li.galleryGrid .image img {
    max-width: 80%;
}

.freeHtml #contact-box{
  position:fixed;
  top:108px;
  right:0px;
  z-index:100;
  width:70px;
}