@charset "UTF-8";
/*
Theme Name: Interview
Theme URI:
Description: Doctor's Interview（メイン）のデザインテーマ
Version: 1.0
Author: SAKAO
Author URI: https://caloo.co.jp/
*/
/*============================================================
　デフォルトスタイルのリセット
  ============================================================*/
html, body, header, footer, section, summary, article, aside, details, menu, nav, figcaption, figure, img, div, span, iframe, form, label,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, del, em, small, strong, mark, dl, dt, dd, ol, ul, li,
table, caption, tbody, thead, tfoot, tr, th, td, input {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
}

header, footer, section, summary, article, aside, nav, figure, img {
  display: block;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  line-height: 1;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

li {
  list-style: none;
  list-style-type: none;
}

select {
  border-radius: 0;
  border: 0;
  margin: 0;
  padding: 0;
  background: none transparent;
  vertical-align: middle;
  font-size: inherit;
  color: inherit;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}

.clearfix:after {
  content: " ";
  clear: both;
  display: block;
}

/*============================================================
　基本スタイル
  ============================================================*/
/*　変数　*/
/*　共通　*/
html {
  min-height: 100%;
  position: relative;
}

body {
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", 'Verdana', "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-size: 14px;
  color: #2c2c2c;
}

a,
button {
  color: #2c2c2c;
  text-decoration: none;
  transition: all .3s;
}

a:hover,
button:hover {
  text-decoration: underline;
  opacity: 0.7;
  transition: all .3s;
}

a:after,
button:after {
  transition: all .3s;
}

input,
select {
  border: solid 1px #cccccc;
  border-radius: 5px;
  background-color: #fff;
  color: #666666;
}

input::-webkit-input-placeholder {
  color: #666666;
}

input:-ms-input-placeholder {
  color: #666666;
}

input::-moz-placeholder {
  color: #666666;
}

input:focus,
select:focus,
button:focus {
  outline: 0;
  border-color: #f7ab00;
}


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

footer dl dt,
button[class^="btn-"],
a[class^="btn-"],
div.views {
  font-family: 'Montserrat', sans-serif;
  letter-spacing: 5px;
}

h2,
footer dl dt,
button[class^="btn-"],
a[class^="btn-"] {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.main h2,
.topmain h2,
.topside h2,
.other-interview h2,
.new-list h2 {
  text-align: center;
  position: relative;
  padding-bottom: 60px;
  margin-bottom: 50px;
}

.main h2:after,
.topmain h2:after,
.topside h2:after,
.other-interview h2:after,
.new-list h2:after {
  position: absolute;
  content: "";
  top: 65px;
  left: -30px;
  margin-left: 50%;
  width: 60px;
  height: 1px;
  background-color: #000;
}

h3.no-article {
  margin: 0 auto 50px;
}

/*　レイアウト　*/
#container { 
  overflow-x: hidden;
  min-height: 100% !important;
  margin-bottom: 463px;
}

#contents {
  width: 1050px;
  margin: 0 auto;
  padding-bottom: 75px;
}

.main {
  width: 100%;
  margin-top: 75px;
}

.topmain,
.topside {
  margin-top: 40px;
}

.topmain {
  width: 700px;
  float: left;
}

/*　ボタン　*/
button[class^="btn-"],
a[class^="btn-"] {
  position: relative;
  display: block;
  background-color: #fff;
  border: 1px solid #2c2c2c;
  color: #2c2c2c;
  text-align: center;
  text-decoration: none;
  width: 100%;
  border-radius: 5px;
  cursor: pointer;
}

button[class^="btn-"]:after,
a[class^="btn-"]:after {
  position: absolute;
  top: 50%;
  content: '';
  border-top: 2px solid #2c2c2c;
  border-right: 2px solid #2c2c2c;
  transform: rotate(45deg);
  right: 10px;
  width: 5px;
  height: 5px;
  margin-top: -3px;
}

button[class^="btn-"]:hover,
a[class^="btn-"]:hover {
  background-color: #2c2c2c;
  color: #fff;
}

button[class^="btn-"]:hover:after,
a[class^="btn-"]:hover:after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

/*　WP-PageNavi　*/
div.wp-pagenavi {
  text-align: center;
}

div.wp-pagenavi span.pages, div.wp-pagenavi span.extend, div.wp-pagenavi a.first, div.wp-pagenavi a.last {
  display: none;
}

div.wp-pagenavi span.current,
div.wp-pagenavi a {
  display: inline-block;
  width: 60px;
  cursor: pointer;
  padding: 20px 0;
  color: #000;
  border-bottom: solid 2px #000;
  background-color: #fff;
  margin: 0 2px;
  font-weight: bold;
  transition: all .3s;
}

div.wp-pagenavi span.current:hover,
div.wp-pagenavi a:hover {
  background-color: #000;
  color: #fff;
  border-color: #000;
  text-decoration: none;
  opacity: 1;
  transition: all .3s;
}

div.wp-pagenavi span.current {
  color: #666666;
  background-color: #cccccc;
  border-bottom: solid 2px #cccccc;
}

/*　new　*/
div.new {
  border-radius: 100px;
  color: #fff;
  background-color: #f7ab00;
  opacity: 0.9;
  width: 55px;
  height: 55px;
  line-height: 55px;
  position: absolute;
  top: -20px;
  right: -20px;
  text-align: center;
  z-index: 1;
}

/*　tag　*/
div.tag {
  color: #fff;
  background-color: #15568a;
  border-radius: 10px;
  padding: 4px 20px;
  font-size: 12px;
  display: inline-block;
  position: absolute;
  top: -10px;
  left: -5px;
}

/*　SP用画像（非表示）　*/
img.sp-img,
div.sp-img {
  display: none !important;
}

/*============================================================
　ヘッダー
  ============================================================*/
header {
  width: 100%;
  height: 120px; 
  border-bottom: solid #dedede 1px;
}

header .inner {
  max-width: 1050px;
  margin: 0 auto;
  position: relative;
  height: 120px; 
}

header a#di-logo {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

header a#di-logo img {
  width: 374px;
}

header h1 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  color: #666666;
  margin-top: 11px;
  font-weight: normal;
  font-size: 13px;
}

header h1 a {
  color: #666666;
}

header h1 ul {
  display: inline-block;
  width: 400px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: right;
  vertical-align: bottom;
}

header h1 ul li {
  display: inline;
}

/* SPメニュー非表示 */
#btn-menu,
#menu {
  display: none;
}

/*============================================================
　フッター
  ============================================================*/
footer {
  background-color: #3f3f3f;
  color: #cccccc;
  padding-top: 80px;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 463px;
}

div.footer-menu {
  width: 1050px;
  margin: 0 auto 60px;
  display: flex;
  justify-content: space-around;
}

div.footer-menu a {
  color: #cccccc;
}

div.footer-menu dl {
  display: inline-block;
  width: 31%;
  vertical-align: top;
}

div.footer-menu dl dt {
  font-size: 24px;
  margin-bottom: 45px;
}

div.footer-menu dl dd {
  font-size: 12px;
}

div.footer-menu dl dd h4 {
  font-size: 16px;
  font-weight: normal;
  margin-bottom: 25px;
}

div.footer-menu dl dd p {
  line-height: 2;
}

div.footer-menu ul li {
  margin-bottom: 20px;
}

div.footer-box {
  border-top: solid 1px #292929;
  position: relative;
}

div.footer-box:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  border-top: 1px solid #5f5f5f;
}

div.copyright {
  width: 1050px;
  margin: 0 auto;
  padding: 35px 0;
  position: relative;
}

div.copyright div.caloologo {
  display: inline-block;
  font-size: 12px;
  letter-spacing: 1.5px;
}

div.copyright div.caloologo img {
  width: 95px;
  display: inline;
  margin-left: 10px;
}

div.copyright p {
  position: absolute;
  top: 40px;
  right: 0;
  font-size: 11px;
  letter-spacing: 2px;
}

/*　ページトップへ　*/
p.gotop {
  position: fixed;
  right: 5%;
  bottom: 0;
}

p.gotop a {
  width: 50px;
  height: 50px;
  display: block;
  background-color: #cccccc;
  position: relative;
}

p.gotop a span {
  width: 16px;
  height: 16px;
  border-top: 2px solid #666;
  border-right: 2px solid #666;
  transform: rotate(-45deg);
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

/*============================================================
　TOPページ：スライダー
  ============================================================*/

#top-slider {
  margin: 0 auto 45px;
  padding: 0 20px;
  border-bottom: solid #dedede 1px;
}
#top-slider .wpsisac-slick-slider-wrp {
  max-width: 1050px;
  margin: 0 auto;
  position: relative;
}
#top-slider .wpsisac-slick-slider .slick-dots li {
  margin: 0 4px !important;
}
#top-slider .wpsisac-slick-slider .slick-dots li button {
  width: 10px !important;
  height: 10px !important;
}
#top-slider .wpsisac-slick-slider .slick-dots li button:hover {
  cursor: pointer;
}
#top-slider .wpsisac-slide-wrap {
  height: 400px;
}
#top-slider .wpsisac-slick-slider.design-1 .wpsisac-image-slide img {
  width: auto;
  height: 100%;
}
/* スライダードット */
#top-slider .wpsisac-slick-slider .slick-dots li.slick-active button {
  background: #666 !important;
}
#top-slider .wpsisac-slick-slider .slick-dots li button {
  border:none;
  background: #eee !important;
}
#top-slider .wpsisac-slick-slider.design-1 .slick-dots {
  position: absolute;
  bottom: -35px !important;
  left: 15px;
  right: 15px;
}
/* スライダー矢印 */
#top-slider .wpsisac-slick-slider.design-1 .slick-arrow {
  display: none !important;
}

/*============================================================
　TOPページ：メインコンテンツ
  ============================================================*/
.main h2,
.topmain h2,
.personal-main h2,
.treatment-main h2 {
  font-size: 22px;
}

.main ul.list,
.topmain ul.list,
.personal-main ul.list,
.treatment-main ul.list {
  max-width: 1050px;
  margin: 0 0 10px;
  display: flex;
  flex-wrap: wrap;
}

.main ul.list li,
.topmain ul.list li,
.personal-main ul.list li,
.treatment-main ul.list li {
  margin: 0 30px 60px 20px;
  width: 300px;
  list-style: none;
  position: relative;
}

.main .btn-more,
.topmain .btn-more,
.personal-main .btn-more,
.treatment-main .btn-more {
  padding: 18px 0;
  width: 650px;
  margin: 0 auto 100px;
  display: block;
}

.main .btn-more:after,
.topmain .btn-more:after,
.personal-main .btn-more:after,
.treatment-main .btn-more:after {
  width: 8px;
  height: 8px;
  margin-top: -5px;
  right: 20px;
}

.topmain ul.list,
.personal-main ul.list,
.treatment-main ul.list {
  -js-display: flex;
  display: flex;
}

.topmain ul.list {
  width: 700px;
}

.main ul.list li {
  display: inline-block\9;
  vertical-align: top\9;
  margin: 0 10px 60px\9;
}

ul.list li a {
  display: block;
}

ul.list li a br {
  display: none;
}

ul.list li img {
  width: 300px;
  height: 170px;
  border-radius: 5px;
}

ul.list li h3 {
  margin: 10px 0;
  line-height: 1.6;
  min-height: 44px;
}

ul.list li p {
  font-size: 12px;
  line-height: 1.6;
}

ul.list li dl {
  border-top: solid 1px #cccccc;
  font-size: 12px;
  line-height: 1.4;
  color: #666666;
  margin: 10px 0;
}

ul.list li dl dt {
  margin: 10px 0 5px;
}

ul.doctor-list {
  font-weight: bold;
}

ul.doctor-list li {
  margin: 0 10px 0 0 !important;
  display: inline;
}

/*============================================================
　TOPページ：サイドコンテンツ
  ============================================================*/
.topside {
  width: 300px;
  float: right;
}

.topside .btn-more,
.topside .btn-search {
  padding: 14px 0;
  margin-top: 20px;
  font-size: 12px;
}

.topside .btn-search {
  background-color: #f3f2ee;
}

.topside .search-box {
  background-color: #f3f2ee;
  padding: 45px 30px;
  margin-bottom: 40px;
}

.topside .search-box ul li {
  margin-bottom: 15px;
}

.topside .search-box input,
.topside .search-box select {
  width: 100%;
  height: 34px;
  padding-left: 10px;
}

/* セレクトボタン共通(トップ・検索結果一覧) */
#searchform ul li label {
  position: relative;
  display: block;
}

#searchform ul li label:after {
  content: '';
  position: absolute;
  top: 14px;
  right: 10px;
  display: block;
  width: 4px;
  height: 4px;
  border-right: 2px solid #666666;
  border-bottom: 2px solid #666666;
  transform: rotate(45deg);
}

/* 注目のタグ */
.topside .sidebox div.tag-cloud {
  padding-top: 15px;
}

.topside .sidebox div.tag-cloud a {
  margin: 0 1em .8em 0em;
}

/* バナー */
.topside .banner {
  margin-top: 40px;
}

.topside .banner ul li {
  margin-bottom: 20px;
}

.topside .banner ul li a img {
  opacity: 1;
  transition: all .3s;
  width: 100%;
}

.topside .banner ul li a img:hover {
  opacity: 0.7;
  transition: all .3s;
}

.search-box h2,
.sidebox h2 {
  font-size: 16px;
  padding-bottom: 0;
}

.search-box h2:after,
.sidebox h2:after {
  top: 45px;
}

/* トップサイドボックス共通 */
.topside .sidebox {
  border: solid #dcdcdc 1px;
  padding: 45px 30px 35px;
  margin-bottom: 40px;
}

/*============================================================
　新着インタビュー（トップ、記事中）
  ============================================================*/

/* 新着インタビュー（トップサイドボックス） */
.topside .sidebox .tag,
.topside .sidebox h3,
.topside .sidebox p,
.topside .sidebox .tag-list,
.topside .sidebox .new {
  display: none;
}

.topside .sidebox ul li a {
  border-bottom: solid 1px #cccccc;
  padding: 25px 0px;
  overflow: hidden;
  display: flex;
  color: #666666;
}

.topside .sidebox ul li a:hover {
  opacity: 0.7 !important;
  transition: all .3s !important;
}

.topside .sidebox ul li:last-child a{
  border-bottom: none;
}

.topside .sidebox .thumbnail img {
  width: 65px;
  height: 65px;
  object-fit: cover;
  border-radius: 50%;
}

.topside .sidebox ul li dl {
  margin: 0 0 0 15px;
  line-height: 1.6;
  width: 155px;
  border: none;
}

.topside .sidebox ul li dl dt {
  margin-top: 0;
}

.topside .sidebox ul li dl dt span{
  display: block;
}

/* 新着インタビュー（記事中） */
.new-list ul.list > li > a:hover {
  text-decoration: none;
  opacity: 1;
}

.new-list ul.list > li > a img:hover,
.new-list ul.list > li > a h3:hover {
  opacity: 0.7;
  transition: all .3s;
  text-decoration: underline;
}

/*============================================================
　インタビュー記事：共通
  ============================================================*/
div.detail-body {
  width: 100% !important;
}

section.treatment-main,
section.personal-main {
  width: 1050px;
  margin: 0 auto;
}

section.treatment-main div.interview,
section.personal-main div.interview {
  margin: 20px 0 60px;
  overflow: hidden;
  clear: both;
}

section.treatment-main div.interview > div:first-child,
section.personal-main div.interview > div:first-child {
  padding: 40px;
  line-height: 2;
}

section.treatment-main div.interview h2,
section.personal-main div.interview h2 {
  font-size: 26px;
  padding-left: 20px;
  margin: 80px 0 65px;
  line-height: 1.2;
}

section.treatment-main div.interview h3,
section.personal-main div.interview h3 {
  margin: 60px 0 40px;
  line-height: 1.6;
  font-size: 18px;
  font-weight: bold;
}

section.treatment-main div.interview h3.inline,
section.personal-main div.interview h3.inline {
  display: inline-block;
  width: 580px;
}

section.treatment-main div.interview p,
section.treatment-main div.interview div,
section.personal-main div.interview p,
section.personal-main div.interview div {
  line-height: 2;
}

section.treatment-main div.interview p,
section.personal-main div.interview p {
  width: 580px;
  display: inline-block;
  font-size: 16px;
  line-height: 2;
  vertical-align: top;
}

section.treatment-main div.interview a,
section.treatment-main div.message a,
section.personal-main div.interview a{
  text-decoration: underline;
}

section.treatment-main div.interview img,
section.personal-main div.interview img {
  /*width: 370px;
				height: 250px;
				display: inline;*/
  border-radius: 5px;
  display: inline;
  margin: 5px 0 0 90px;
}

section.treatment-main div.interview .alignleft,
section.personal-main div.interview .alignleft {
  float: right;
  margin-right: 6px;
}

section.treatment-main div.interview .alignright,
section.personal-main div.interview .alignright {
  float: right;
  margin-right: 60px;
}

section.treatment-main div.interview .aligncenter,
section.personal-main div.interview .aligncenter {
  margin-left: 150px;
}

section.treatment-main div.interview .alignnone,
section.personal-main div.interview .alignnone {
  clear: both;
}

section.treatment-main .sidebox,
section.personal-main .sidebox {
  display: none;
}


/*　目次(治療法・人柄)　*/
section.treatment-main .interview .no_bullets,
section.personal-main .interview .no_bullets  {
  width: 580px;
  border: double 3px #ccc;
  margin: 80px 0 0;
  padding: 35px 20px 20px;
  position: relative;
  line-height: 1.5;
}

section.treatment-main .interview .toc_title,
section.personal-main .interview .toc_title  {
  color: #fff;
  background-color: #aaa;
  width: 70px;
  line-height: 25px;
  font-size: 14px;
  border-radius: 1px;
  text-align: center;
  position: absolute;
  top: -13px;
  left: 20px;
}

section.treatment-main .interview .toc_list > li > a,
section.personal-main .interview .toc_list > li > a {
  position: relative;
  padding-left: 17px;
}

section.treatment-main .interview .toc_list > li,
section.personal-main .interview .toc_list > li {
  border-top: dashed 1px #ccc;
  margin: 25px 0 0;
  padding: 25px 0 0;
}

section.treatment-main .interview .toc_list > li:first-of-type,
section.personal-main .interview .toc_list > li:first-of-type {
  border-top: none;
  margin: 0;
  padding: 0;
}

section.treatment-main .interview .toc_list > li > a:before,
section.personal-main .interview .toc_list > li > a:before {
  position: absolute;
  content:"■";
  font-size: 90%;
  top: 2px;
  transform: translateX(-17px);
}

section.treatment-main .interview .toc_list a,
section.personal-main .interview .toc_list a  {
  text-decoration: underline;
  display: inline-block;
  margin-bottom: 13px;
  padding-left: 32px;
}

section.treatment-main .interview .toc_list a:hover {
  color: #2771ad;
  opacity: 1;
}

section.personal-main .interview .toc_list a:hover {
  color: #009847;
  opacity: 1;
}


/*　自由診療の費用(治療法・人柄)　*/
section.treatment-main .interview .price h2,
section.personal-main .interview .price h2  {
  font-weight: normal;
  font-size: 18px;
  line-height: 1.6;
  border-bottom: dashed 1px #ccc;
  border-left: none;
  margin: 60px 0 20px;
  padding: 0 0 5px 0;
}

section.treatment-main .interview .price p,
section.personal-main .interview .price p  {
  width: 100%;
  font-size: 14px;
  margin-top: 20px;
}

section.treatment-main .interview .price h2 + p,
section.personal-main .interview .price h2 + p {
  margin-top: 0 !important;
}

section.treatment-main .interview .price #pricelist-readmore,
section.personal-main .interview .price #pricelist-readmore {
  display: none;
}

section.treatment-main .interview .price #pricelist-readmore-btn,
section.personal-main .interview .price #pricelist-readmore-btn {
  width: fit-content;
  margin-top: 10px;
  color: #868686;
  text-decoration: underline;
  text-decoration-color: #868686;
  cursor: pointer;
  transition: opacity .3s;
}

section.treatment-main .interview .price #pricelist-readmore-btn:hover,
section.personal-main .interview .price #pricelist-readmore-btn:hover {
  opacity: 0.5;
}


/*　ドクターからのメッセージ　*/
div.message {
  background-color: #fdf7f0;
  padding: 50px;
  margin-bottom: 60px;
  min-height: 330px;
  position: relative;
}

div.message div {
  color: #71675c;
  font-size: 24px;
  position: relative;
  margin-bottom: 40px;
}

div.message div ul {
  font-size: 16px;
  position: absolute;
  top: 6px;
  right: 10px;
  display: block;
}

div.message div ul li {
  display: inline-block;
  margin-left: 10px;
}

div.message p {
  line-height: 2;
  display: inline-block;
  width: 700px;
}

div.message img {
  display: inline-block;
  width: 190px;
  height: 190px;
  border-radius: 200px;
  position: absolute;
  top: 110px;
  right: 50px;
}

/*　別のインタビューを見るボタン　*/
a.btn-another {
  display: inline-block;
  position: absolute;
  width: auto;
  border: none;
  border-bottom: solid 2px;
  bottom: 0;
  right: 0;
  border-radius: 0;
  padding: 20px 40px 20px 15px;
  letter-spacing: 2px;
  font-weight: bold;
}

a.btn-another:after {
  right: 20px;
}

/*　この病院の他のインタビュー記事　*/
.other-interview h2 {
  margin-bottom: 20px;
}

.other-interview ul.list {
  width: 800px;
  margin: 0 auto 70px;
  border-top: solid #ccc 1px;
}

.other-interview ul.list > li {
  position: relative;
  padding: 10px 0 10px 180px;
  border-bottom: solid #ccc 1px;
  min-height: 100px;
  width: 100%;
  margin: 0;
}

.other-interview ul.list li a {
  display: block;
}

.other-interview ul.list li a:hover {
  text-decoration: none;
}

.other-interview ul.list li div.new {
  width: 35px;
  height: 35px;
  line-height: 35px;
  left: 0;
  font-size: 11px;
  top: 5px;
}

.other-interview ul.list li .thumbnail {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
}

.other-interview ul.list li div.tag {
  position: relative;
  top: auto;
  left: auto;
  margin: 0 10px 0 0;
}

.other-interview ul.list li ul {
  display: inline-block;
}

.other-interview ul.list li .doctor-list li {
  margin-right: 10px;
  color: #666666;
  font-size: 12px;
}

.other-interview ul.list img {
  display: inline-block;
  width: 141px;
  height: 80px;
  border-radius: 5px;
}

.other-interview ul.list h3 {
  font-size: 16px;
  line-height: 1.6;
  margin: 5px 0;
  min-height: auto;
}

.other-interview ul.list h3 br {
  display: none;
}

.other-interview ul.list p {
  font-size: 12px;
  line-height: 1.4;
  margin: 5px 0 8px;
}

/*　動物病院情報　*/
.hospital-box {
  overflow: hidden;
  position: relative;
  border: solid 1px #ccc;
  padding: 40px;
  margin: 20px auto;
  position: relative;
}

.hospital-box div.hospital-img {
  position: absolute;
  top: 40px;
  left: 40px;
  width: 222px;
  height: auto;
}

.hospital-box div.hospital-img img {
  width: 100%;
  height: auto;
  border-radius: 5px;
}

.hospital-box div.hospital-info {
  padding-left: 250px;
}

.hospital-box div.hospital-info p {
  position: relative;
  width: fit-content;
  min-height: 30px;
  margin-bottom: 30px;
  padding-right: 180px;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.4;
}

.hospital-box div.hospital-info p a {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 150px;
  height: 28px;
  line-height: 26px;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  border: 1px solid #ccc;
  border-radius: 3px;
  transition: opacity .3s;
}

.hospital-box div.hospital-info p a:before,
.hospital-box div.hospital-info p a:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  transition: opacity .3s;
}

.hospital-box div.hospital-info p a:before {
  background: linear-gradient(180deg, #fff, #e5e5e5);
  z-index: -1;
}

.hospital-box div.hospital-info p a:after {
  background: #fff;
  z-index: -2;
}

.hospital-box div.hospital-info p a:hover {text-decoration: none; opacity: 1;}
.hospital-box div.hospital-info p a:hover:before {opacity: 0;}

.hospital-box div.hospital-info p a span {color: #2771ad; padding-right: 4px;}

.hospital-box div.hospital-info dl {
  overflow: hidden;
}

.hospital-box div.hospital-info dl dt {
  float: left;
  clear: both;
  width: 90px;
  height: 20px;
  background-color: #999;
  color: #fff;
  font-size: 12px;
  text-align: center;
  padding: 4px 0;
  letter-spacing: 2px;
}

.hospital-box div.hospital-info dl dd {
  float: left;
  width: 560px;
  margin: 0 0 10px 20px;
  line-height: 1.6;
  font-size: 12px;
}

.hospital-box div.hospital-info dl dd:first-child {
  width: 330px;
}

.hospital-box div.hospital-info dl dd:last-child {
  margin-bottom: 0;
}

.hospital-box div.caloo-btn {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  margin-top: 30px;
}

.hospital-box div.caloo-btn div {
	width: 48%;
  height: 40px;
}

.hospital-box div.caloo-btn div:first-child:nth-last-child(3),
.hospital-box div.caloo-btn div:first-child:nth-last-child(3) ~ div {width:32%;}

.hospital-box div.caloo-btn div:first-child:nth-last-child(4),
.hospital-box div.caloo-btn div:first-child:nth-last-child(4) ~ div {width:24%;}

.hospital-box div.caloo-btn div:first-child:nth-last-child(5),
.hospital-box div.caloo-btn div:first-child:nth-last-child(5) ~ div {width:19%;}

.hospital-box div.caloo-btn div a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
  border-radius: 3px;
}

.hospital-box div.caloo-btn div a span::before {
  margin-right: 5px;
  font-size: 15px;
}

.hospital-box [class$='-btn'] a {
  border: 1px solid #2771ad;
  color: #2771ad;
}

.hospital-box [class$='-btn'] a:hover {
  background-color: #2771ad;
  color: #fff;
  text-decoration: none;
  opacity: 1;
}

.hospital-box .line-btn a {
  border: 1px solid #06c755;
  color: #06c755;
}

.hospital-box .line-btn a:hover {
  background-color: #06c755;
}


/*　この記事に関するキーワード　*/
div.tag-box {
  width: 100%;
  margin: 20px 0 70px 0;
}

div.tag-box p {
  display: inline-block;
  margin-top: 3px;
}

ul.tag-list {
  display: inline-block;
  margin: 0 0 0 10px;
  padding: 0;
  max-width: 900px;
  vertical-align: top;
}

ul.tag-list li {
  display: inline-block;
  margin: 0 1em .5em 0em !important;
  padding: 0;
  width: auto !important;
}

ul.tag-list li a,
div.tag-cloud a {
  position: relative;
  display: inline-block;
  height: 20px;
  line-height: 20px;
  padding: 0 0.6em 0 1em;
  background-color: #eeeeee;
  border-radius: 0 3px 3px 0;
  color: #868686;
  font-size: 12px;
}

ul.tag-list li a:before,
div.tag-cloud a:before {
  position: absolute;
  top: 0;
  left: -10px;
  content: '';
  width: 0;
  height: 0;
  border-color: transparent #eeeeee transparent transparent;
  border-style: solid;
  border-width: 10px 10px 10px 0;
}

ul.tag-list li a:after,
div.tag-cloud a:after {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 2;
  display: block;
  content: '';
  width: 5px;
  height: 5px;
  margin-top: -2px;
  background-color: #fff;
  border-radius: 100%;
}

ul.tag-list li a:hover,
div.tag-cloud a:hover {
  text-decoration: none;
}

@-moz-document url-prefix() {
  ul.tag-list li a:before,
  div.tag-cloud a:before {
    left: -9px;
    border-width: 11px 10px 10px 0;
  }
  ul.tag-list li a:after,
  div.tag-cloud a:after {
    margin-top: -3px;
  }
}

/*============================================================
　インタビュー記事：頼れる獣医が教える治療法
  ============================================================*/
section.treatment-main div.detail-head {
  margin-top: 60px;
  position: relative;
  letter-spacing: 1px;
}

/* vol. */
section.treatment-main div.detail-head p.vol-num {
  color: #254e77;
  text-align: right;
}

section.treatment-main div.detail-head p.vol-num span {
  margin-left: 0.5em;
}

/* タイトル・病院名・先生名 */
section.treatment-main div.detail-head div.detail-ttl,
section.treatment-main div.detail-head dl  {
  width: 675px;
  position: absolute;
  right: 0;
}

/* 病院名・先生名 */
section.treatment-main div.detail-head dl{
  bottom: 0;
  display: inline-block;
  line-height: 1.3;
}

/* 診察領域 */
section.treatment-main div.detail-head p.tag {
  color: #fff;
  margin: 20px 0 20px;
  background: #15568a;
  display: inline-block;
  line-height: 28px;
  padding: 0 25px;
  font-size: 15px;
  border-radius: 30px;
}

/* タイトル */
section.treatment-main div.detail-head div.detail-ttl div.treatment-head {
  font-size: 38px;
  font-weight: bold;
  color: #254e77;
  line-height: 1.5;
}

/* 画像 */
section.treatment-main div.detail-head img {
  width: 320px;
  display: inline-block;
  margin-right: 55px;
}

section.treatment-main div.detail-head dl dt{
  font-size: 16px;
  margin-bottom: 10px;
}

section.treatment-main div.detail-head dl dd{
  font-size: 24px;
}

section.treatment-main div.detail-head dl dd ul li {
  display: inline-block;
  margin-right: 10px;
}

section.treatment-main a.btn-another {
  color: #3e7d5b;
  border-color: #3e7d5b;
}

section.treatment-main a.btn-another:after {
  border-top: 2px solid #3e7d5b;
  border-right: 2px solid #3e7d5b;
}

section.treatment-main a.btn-another:hover {
  background-color: #3e7d5b;
  color: #fff;
}

section.treatment-main a.btn-another:hover:after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

section.treatment-main div.interview > div:first-child {
  background-color: #ebf2f6;
  color: #2771ad;
}

section.treatment-main div.interview h2 {
  border-left: solid #2771ad 3px;
}

section.treatment-main div.interview h3 {
  color: #2771ad;
}

/*============================================================
　インタビュー記事：街の頼れる獣医達
  ============================================================*/
section.personal-main div.detail-img {
  position: relative;
}

section.personal-main div.detail-img div.personal-img {
  height: 500px;
  overflow: hidden;
}

section.personal-main div.detail-img div.personal-img img {
  width: 1050px;
}

section.personal-main div.detail-img div.personal-head {
  position: absolute;
  top: 50%;
  transform: translateY(-70%);
  left: 5%;
  font-size: 34px;
  font-weight: bold;
  line-height: 80px;
  letter-spacing: 5px;
  max-width: 460px;
  text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.6), 0px 0px 10px rgba(255, 255, 255, 0.6), 0px 0px 20px rgba(255, 255, 255, 0.6), 0px 0px 30px rgba(255, 255, 255, 0.6), 0px 0px 40px rgba(255, 255, 255, 0.6);
}

section.personal-main div.detail-img div.personal-head span {
  margin-left: -1rem;
}

/* タイトル一行表示 */
section.personal-main div.detail-img div.personal-head .no-break {
  width: 1000px;
}

section.personal-main div.detail-img div.personal-name {
  background-color: rgba(0, 0, 0, 0.45);
  color: #fff;
  position: absolute;
  right: 45px;
  bottom: 20px;
  letter-spacing: 1.5px;
}

section.personal-main div.detail-img div.personal-name p {
  background-color: #1d844d;
  display: inline-block;
  padding: 10px 15px;
  font-size: 12px;
  position: absolute;
  top: -35px;
  right: -10px;
}

section.personal-main div.detail-img div.personal-name p span {
  margin-left: 0.5em;
}

section.personal-main div.detail-img div.personal-name p span.tag {
  display: block;
  padding-top: 6px;
  text-align: right;
}

section.personal-main div.detail-img dl {
  padding: 30px 40px;
}

section.personal-main div.detail-img dl dt {
  font-size: 14px;
  margin-bottom: 15px;
}

section.personal-main div.detail-img dl dd {
  font-size: 24px;
  line-height: 1.3;
}

section.personal-main div.detail-img dl dd ul li {
  margin-right: 5px;
  display: inline;
}

section.personal-main div.detail-img dl dd ul li + li::before {
  content: "/";
  margin-right: 15px;  
}

section.personal-main a.btn-another {
  color: #002467;
  border-color: #002467;
}

section.personal-main a.btn-another:after {
  border-top: 2px solid #002467;
  border-right: 2px solid #002467;
}

section.personal-main a.btn-another:hover {
  background-color: #002467;
  color: #fff;
}

section.personal-main a.btn-another:hover:after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

section.personal-main div.interview > div:first-child {
  background-color: #e9f7ef;
  color: #3e7d5b;
}

section.personal-main div.interview h2 {
  border-left: solid #009847 3px;
}

section.personal-main div.interview h3 {
  color: #009847;
}

/*============================================================
　検索
  ============================================================*/
div.more-search {
  display: none;
}

div.s-box {
  background-color: #f3f2ee;
  padding: 20px;
  margin-bottom: 40px;
}

div.s-box ul {
  display: inline-block;
}

div.s-box ul li {
  display: inline-block;
  width: 198px;
  margin-right: 2px;
}

div.s-box input,
div.s-box select,
div.s-box button[class^="btn-"] {
  display: inline-block;
  vertical-align: top;
  height: 34px;
}

div.s-box input,
div.s-box select {
  width: 100%;
  padding-left: 10px;
}

div.s-box button[class^="btn-"] {
  width: 190px;
  background-color: #f3f2ee;
}

div.s-box button[class^="btn-"]:hover {
  background-color: #2c2c2c;
  color: #fff;
}

div.search-result {
  margin-bottom: 40px;
  font-weight: bold;
  font-size: 16px;
}

div.search-result ul {
  margin-bottom: 60px;
  text-align: center;
}

div.search-result ul li {
  display: inline-block;
  margin: 5px 15px 5px 0px;
}

div.search-result ul li span {
  color: #32b25f;
  word-break: break-all;
}

div.search-result ul li span.search-num {
  padding: 0 5px;
}

div.no-article {
  text-align: center;
}

/*============================================================
　タグ一覧ページ
  ============================================================*/
div.tag-list-box h3 {
  font-size: 16px;
  margin-bottom: 20px;
  padding-left: 10px;
  border-left: solid #2c2c2c 3px;
}

div.tag-list-box h4 {
  border-bottom: solid #333 2px;
  display: inline-block;
  padding-bottom: 5px;
  margin: 0 0 10px 13px;
}

div.tag-list-box ul {
  margin: 0 0 30px 13px;
}

div.tag-list-box ul li {
  display: inline-block;
  margin: 0 20px 10px 0;
  color: #969696;
}

div.tag-list-box ul li.tag-none {
  color: #2c2c2c;
}

div.tag-list-box h4 + ul {
  margin-top: 10px;
}

/*============================================================
　404エラーページ
  ============================================================*/
div#error404 img {
  float: left;
  width: 35%;
  height: auto;
}

div#error404 div {
  float: left;
  width: 55%;
  margin-left: 10%;
}

div#error404 h3 {
  font-size: 18px;
  line-height: 1.6;
}

div#error404 ol {
  margin: 40px 0 45px 25px;
  padding-left: 15px;
}

div#error404 ol li {
  list-style: outside decimal;
  margin: 5px 0 20px;
}

div#error404 ol li a {
  color: #32B25F;
  text-decoration: underline;
}

div#error404 ol li a:hover {
  text-decoration: none;
}

/*============================================================
　SNS・アクセスカウンター
============================================================*/
/*　SNS　*/

.share {
  position: relative;
}

.share ul {
  position: absolute;
  right: 0;
}

.share ul:after {
  content: "";
  display: block;
  clear: both;
}

.share li {
  float: left;
  margin: 0 0 0 10px;
}

.share li:first-of-type {
  margin: 0;
}

.share li a {
  display: inline-block;
  vertical-align: middle;
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  text-align: center;
  width: 30px;
  height: 30px;
  border-radius: 5px;
  line-height: 32px;
}

.share li a:hover {
  opacity: 0.8;
  color: #fff;
}

.share li a:visited {
  color: #fff;
}

.tweet a {
  background-color: #000;
}

.facebook a {
  background-color: #315096;
}

.googleplus a {
  background-color: #dd4b39;
}

.hatena a {
  background-color: #008fde;
}

.line a {
  background-color: #06c755;
}

.pocket a {
  background-color: #f03e51;
}

.rss a {
  background-color: #ff8c00;
}

.feedly a {
  background-color: #6cc655;
}

div.detail-img + div.share ul.detail-sns,
section.treatment-main div.share:first-child ul.detail-sns {
  width: 70%;
  float: right;
}

.sns-sp {
  display: none;
}

/*　アクセスカウンター　*/
div.views {
  font-size: 12px;
  padding: 40px 20px 0 10px;
  color: #32a1d0;
  letter-spacing: 0.1em;
}

div.views em {
  font-size: 20px;
  font-style: normal;
  color: #3692c1;
}

section.personal-main div.views {
  color: #47b36a;
}

section.personal-main div.views em {
  color: #3aa25c;
}

/*div.treatment {
	div.share {
		position: absolute;
	  top: 50px;
	  right: 0;
	}
	div.views {
		position: absolute;
	  right: 200px;
	  top: 50px;
	  margin-top: 5px;
	}
}*/
div.personal div.top-sns,
div.treatment div.top-sns {
	margin: 50px auto 40px;
}

div.personal div.top-sns div.share,
div.treatment div.top-sns div.share {
  display: inline-block;
}

section.topside div.share ul {
  position: static;
  padding: 0;
  list-style: none;
  text-align: center;
}

section.topside div.share ul li {
  margin: 0 5px;
  float: none;
  vertical-align: top;
  display: inline-block;
}

/*============================================================
　LP
  ============================================================*/
div#lp−contents {
  margin: 0 auto;
  padding-bottom: 75px;
  overflow: hidden;
}

div#lp−contents section.main {
  margin-top: 0;
}

div#lp−contents h2 {
  display: none;
}

div#lp−contents h3 {
  font-size: 18px;
  border-bottom: solid #21110d 5px;
  text-align: right;
  width: 30vw;
  display: inline-block;
  padding: 0 20px 5px 0;
  margin-bottom: 80px;
}

div#lp−contents div.btn-box {
  overflow: hidden;
  text-align: center;
}

div#lp−contents div.btn-box a {
  height: 80px;
  padding: 30px 0;
  margin: 0 10px;
  display: inline-block;
  background-color: transparent;
  font-weight: bold;
  font-size: 20px;
}

div#lp−contents div.btn-box a:hover {
  opacity: 1;
}

div#lp−contents div.btn-box a:after {
  right: 15px;
}

div#lp−contents div.btn-box a.btn-entry {
  border: solid #00b259 2px;
  color: #00b259;
  width: 466px;
}

div#lp−contents div.btn-box a.btn-entry:hover {
  background-color: #00b259;
  color: #fff;
}

div#lp−contents div.btn-box a.btn-entry:hover:after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

div#lp−contents div.btn-box a.btn-entry:after {
  border-top: 2px solid #00b259;
  border-right: 2px solid #00b259;
}

div#lp−contents div.btn-box a.btn-inquiry {
  border: solid #2771ad 2px;
  color: #2771ad;
  width: 268px;
}

div#lp−contents div.btn-box a.btn-inquiry:hover {
  background-color: #2771ad;
  color: #fff;
}

div#lp−contents div.btn-box a.btn-inquiry:hover:after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

div#lp−contents div.btn-box a.btn-inquiry:after {
  border-top: 2px solid #2771ad;
  border-right: 2px solid #2771ad;
}

div#lp−contents section.lp-top,
div#lp−contents section.lp-merrit,
div#lp−contents section.lp-media,
div#lp−contents section.lp-flow h3,
div#lp−contents section.lp-flow dl,
div#lp−contents section.lp−voice,
div#lp−contents section.lp−banner {
  font-family: "a-otf-ud-reimin-pr6n",sans-serif;
  letter-spacing: 5px;
  margin-top: 120px;
}

div#lp−contents div.lp-box {
  width: 1050px;
  margin: 0 auto;
}

div#lp−contents section.lp-top {
  margin: 0 0 80px;
  color: #fff;
  text-align: center;
  height: 0;
  position: relative;
  padding-top: 39%;
  background-image: url(./img/lp/lp_mainimg.jpg);
  background-repeat: no-repeat;
  background-size: contain;
}

div#lp−contents section.lp-top div.top-box {
  position: absolute;
  top: 60%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 1050px;
}

div#lp−contents section.lp-top dl {
  text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
}

div#lp−contents section.lp-top dt {
  font-size: 32px;
  display: block;
  margin-bottom: 45px;
}

div#lp−contents section.lp-top dt br {
  display: none;
}

div#lp−contents section.lp-top dd {
  font-size: 20px;
  line-height: 1.6;
  margin-bottom: 45px;
}

div#lp−contents section.lp-top a {
  border: solid #fff 2px !important;
  color: #fff !important;
}

div#lp−contents section.lp-top a:after {
  border-top: 2px solid #fff !important;
  border-right: 2px solid #fff !important;
}

div#lp−contents section.lp-merrit dl {
  margin-bottom: 80px;
  min-height: 70px;
  padding: 5px 0 0 100px;
}

div#lp−contents section.lp-merrit dl.merrit1 {
  background: url(./img/lp/lp_1.png) no-repeat 0 0;
  margin-left: 65px;
}

div#lp−contents section.lp-merrit dl.merrit2 {
  background: url(./img/lp/lp_2.png) no-repeat 0 0;
  margin-left: 105px;
}

div#lp−contents section.lp-merrit dl.merrit3 {
  background: url(./img/lp/lp_3.png) no-repeat 0 0;
  margin-left: 145px;
}

div#lp−contents section.lp-merrit dt {
  font-size: 24px;
  margin-bottom: 25px;
}

div#lp−contents section.lp-merrit dd {
  font-size: 16px;
}

div#lp−contents section.lp−voice div.voice-box {
  position: relative;
  min-height: 700px;
  background-image: url(./img/lp/voice_img.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  background-color: #e5eaf0;
}

div#lp−contents section.lp−voice div.voice-box h3 {
  margin: 80px 0 60px;
}

div#lp−contents section.lp−voice div.voice-body {
  width: 1050px;
  margin: 0 auto;
}

div#lp−contents section.lp−voice div.voice-body h3 {
  margin-bottom: 60px;
}

div#lp−contents section.lp−voice div.voice-body dl {
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", 'Verdana', "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  max-width: 500px;
}

div#lp−contents section.lp−voice div.voice-body dt {
  font-size: 24px;
  line-height: 1.6;
  margin-bottom: 30px;
}

div#lp−contents section.lp−voice div.voice-body dd {
  font-size: 16px;
  line-height: 2.2;
  letter-spacing: 2px;
}

div#lp−contents section.lp−voice div.voice-body dd p {
  margin-top: 20px;
}

div#lp−contents section.lp−voice div.btn-box {
  margin: 50px auto 120px;
}

div#lp−contents section.lp-media h4 {
  text-align: center;
  margin-bottom: 80px;
  font-weight: lighter;
  font-size: 36px;
}

div#lp−contents section.lp-media p {
  display: inline-block;
  font-size: 18px;
  border-bottom: solid #21110d 2px;
  position: absolute;
  right: 0;
  top: 10%;
  min-width: 240px;
  text-align: right;
  letter-spacing: 2px;
  padding: 0 10px 5px 0;
}

div#lp−contents section.lp-media div {
  width: 790px;
  margin: 0 auto;
  position: relative;
}

div#lp−contents section.lp-media div.media1 {
  background: url(./img/lp/media_1.jpg) no-repeat left top;
  margin-bottom: 60px;
  height: 386px;
}

div#lp−contents section.lp-media div.media2 {
  background: url(./img/lp/media_2.jpg) no-repeat left top;
  margin-bottom: 120px;
  height: 370px;
}

div#lp−contents section.lp-media div.media3 {
  background: url(./img/lp/media_3.jpg) no-repeat left top;
  margin-bottom: 80px;
  height: 192px;
}

div#lp−contents section.lp-media div.media3 p {
  width: 284px;
}

div#lp−contents section.lp−banner {
  background-color: #f2f9fc;
  margin: 100px auto 80px;
  padding: 100px 0;
}

div#lp−contents section.lp−banner div.lp-box {
  width: 1050px;
  min-height: 562px;
  margin: 0 auto 80px;
  background: url(./img/lp/banner_bg.png) no-repeat center bottom;
  position: relative;
}

div#lp−contents section.lp−banner div.lp-box p {
  position: absolute;
  top: 40px;
  right: 50px;
  line-height: 2.2;
  width: 18rem;
}

div#lp−contents section.lp-flow div.flow-point {
  width: 905px;
  margin: 0 auto 80px;
}

div#lp−contents section.lp-flow div.flow-point p {
  font-size: 12px;
  margin: 60px auto;
  line-height: 1.6;
  padding: 20px 40px;
  /* background-color: #f7f7f7; */
  color: #0A5293;
}

div#lp−contents section.lp-flow div.flow-point dl {
  width: 46%;
  min-height: 160px;
  display: inline-block;
  vertical-align: top;
  margin-top: 0;
}

div#lp−contents section.lp-flow div.flow-point dl.flow1 {
  background: url(./img/lp/flow_1.jpg) no-repeat 0 0;
  background-size: 160px 160px;
  margin-right: 60px;
}

div#lp−contents section.lp-flow div.flow-point dl.flow2 {
  background: url(./img/lp/flow_2.jpg) no-repeat 0 0;
  background-size: 160px 160px;
}

div#lp−contents section.lp-flow div.flow-point dt {
  font-size: 18px;
  margin: 8px 0 25px 190px;
}

div#lp−contents section.lp-flow div.flow-point dd {
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", 'Verdana', "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  margin-left: 190px;
  line-height: 1.6;
}

div#lp−contents ul.detail-sns {
  width: 210px;
  margin: 80px auto 0;
}

/*============================================================
　お問い合わせフォーム
  ============================================================*/
p.form-txt {
  text-align: center;
  margin-bottom: 65px;
  line-height: 2.2;
  font-size: 18px;
  font-family: "a-otf-ud-reimin-pr6n",sans-serif;
}

div.wpcf7 {
  width: 1050px;
  margin: 0 auto !important;
}

div.wpcf7 input[type="text"],
div.wpcf7 input[type="email"],
div.wpcf7 input[type="tel"],
div.wpcf7 textarea {
  background-color: #fff;
  width: 600px;
  height: 60px;
  border: 1px solid #d7dce1;
  border-radius: 0;
  padding: 1em;
  outline: none;
  /*border-radius: 4px;
		box-shadow: 1px 1px 3px rgba(0,0,0,.1) inset;*/
}

div.wpcf7 input[type="text"]:focus,
div.wpcf7 input[type="email"]:focus,
div.wpcf7 input[type="tel"]:focus,
div.wpcf7 textarea:focus {
  border: solid #f7ab00 1px;
  background-color: #fff9ef;
}

div.wpcf7 input::-webkit-input-placeholder {
  color: #ccc;
  font-weight: normal;
}

div.wpcf7 input:-ms-input-placeholder {
  color: #ccc;
  font-weight: normal;
}

div.wpcf7 input::-moz-placeholder {
  color: #ccc;
  font-weight: normal;
}

div.wpcf7 textarea {
  height: 100px;
  resize: none;
}

div.wpcf7 div.formError + input {
  background-color: #ffefef;
  border: solid #ffa1a1 1px;
}

div.wpcf7 span.wpcf7-not-valid-tip {
  color: #f79700;
  margin-top: 10px;
}

div.wpcf7 table {
  width: 800px;
  margin: 0 auto;
}

div.wpcf7 table th, div.wpcf7 table td {
  padding: 15px 0;
}

div.wpcf7 table th {
  width: 200px;
  text-align: left;
  vertical-align: middle;
  position: relative;
}

div.wpcf7 table th span.required {
  color: #f79700;
  font-weight: normal;
  border: solid #f79700 1px;
  padding: 0;
  width: 40px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  position: absolute;
  top: 35px;
  right: 30px;
}

div.wpcf7 table td span {
  position: relative;
}

div.wpcf7 div.btn-box {
  width: 100%;
  margin: 40px auto;
  text-align: center;
}

div.wpcf7 div.btn-box input {
  width: 60%;
  height: 80px;
  letter-spacing: 5px;
  transition: all .3s;
  cursor: pointer;
  font-size: 18px;
  font-weight: bold;
}

div.wpcf7 div.btn-box input:hover {
  transition: all .3s;
  opacity: 0.7;
}

div.wpcf7 div.btn-box input:after {
  transition: all .3s;
  position: absolute;
  top: 50%;
  content: '';
  border-top: 2px solid #2c2c2c;
  border-right: 2px solid #2c2c2c;
  transform: rotate(45deg);
  right: 10px;
  width: 5px;
  height: 5px;
  margin-top: -3px;
}

div.wpcf7 div.btn-box input.btn-entry {
  background-color: #00b259;
  color: #fff;
}

div.wpcf7 div.btn-box input.btn-entry:hover {
  color: #fff;
  background-color: #00b259;
}

div.wpcf7 div.wpcf7-validation-errors,
div.wpcf7 span.ajax-loader {
  display: none;
}

div.wpcf7 div.wpcf7-response-output {
  display: none !important;
}

div.wpcf7 div.formError {
  top: 280% !important;
  left: 0 !important;
  margin: 0 0 0 5px !important;
}

@-moz-document url-prefix() {
  div.wpcf7 div.formError {
    top: 250% !important;
    margin: 0 0 0 5px !important;
  }
}

@media all and (-ms-high-contrast: none) {
  div.wpcf7 *::-ms-backdrop, div.wpcf7 div.formError {
    top: 200% !important;
  }
}

div.wpcf7 _:-ms-lang(x), div.wpcf7 _::-webkit-meter-bar, div.wpcf7 div.formError {
  top: 200% !important;
}

div.wpcf7 div.formErrorContent {
  background-color: transparent;
  font-size: 12px;
  color: #ee0101;
  border: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  -o-border-radius: 0;
}

div.wpcf7 div.formErrorContent br {
  display: none;
}

div.wpcf7 div.formErrorArrow {
  display: none;
}

a.btn-gototop {
  width: 50%;
  margin: 0 auto;
  padding: 18px 0;
  font-weight: bold;
}

a.btn-gototop:after {
  width: 8px;
  height: 8px;
  margin-top: -5px;
  right: 20px;
}
