@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 {
  margin-bottom: 463px;
}

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

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

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

.topmain {
  max-width: 700px;
  width: 69%;
  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 !important;
  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: 100px;
  border-bottom: solid #dedede 1px;
}

header .inner {
  width: 90vw;
  margin: 0 auto;
  height: 100px;
  position: relative;
}

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

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

header a {
  color: #666666;
}

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

/* 検索結果 */
header h1.search-h1 {
  font-size: 12px;
}

header h1 ul {
  display: inline-block;
  max-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;
}

@media (max-width: 965px) {
  header h1 {
    display: none;
    color: #666666;
    font-weight: normal;
    font-size: 11px;
  }
  /* SPメニュー表示 */
  #btn-menu,
  #menu {
    display: block !important;
  }
}

/* SPメニュー */
#menu {
  position:fixed;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.9);
  transition: all 0.5s;
  color: #fff;
  padding: 110px 0 0;
  opacity: 0;
  pointer-events: none;
  overflow-y: scroll;
}

.active #menu {
  opacity: 1;
  pointer-events: auto;
}

#menu li {
  border-top: solid 1px #666666;
  height: 60px;
  position: relative;
}

#menu li a {
  color: #fff;
  display: block;
  line-height: 60px;
  padding: 0 40px;
}

#menu li a:hover {
  text-decoration: none;
}

#menu li a:after {
  position: absolute;
  top: 50%;
  content: '';
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  right: 40px;
  width: 5px;
  height: 5px;
  margin-top: -3px;
}

#menu ul li dl {
  padding: 0 40px 10px;
}

#menu ul li dl dt {
  margin: 25px 0 20px;
}

#menu ul li dl dd {
  margin-bottom: 20px;
}

#menu ul li dl dd ul li {
  border-top: none;
  height: 45px;
  margin-bottom: 15px;
}

#menu ul li dl input, #menu ul li dl select {
  width: 100%;
  height: 40px;
  padding-left: 10px;
}

#menu ul li dl select:active {
  background-color: #fff;
}

#menu ul li dl button {
  margin-top: 20px;
  padding: 18px 0;
  color: #fff;
  border: 1px solid #fff;
  background-color: transparent;
}

#menu ul li dl button:after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

/* ハンバーガー */
#btn-menu {
  position: absolute;
  z-index: 99999;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  width: 25px;
  height: 25px;
}

#btn-menu span, #btn-menu span:before, #btn-menu span:after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  display: block;
  width: 25px;
  height: 1px;
  font-size: 0;
  background: #2c2c2c;
  transition: all .3s;
}

#btn-menu span:before {
  transform: translateY(-8px);
  top: 0px;
}

#btn-menu span {
  top: 50%;
  transform: translateY(-50%);
}

#btn-menu span:after {
  transform: translateY(8px);
  top: 0px;
}

/* ×に変化 */  
.active #btn-menu span {
  background: none;
}

.active #btn-menu span:before {
  transform: rotate(45deg);
  background: #fff;
}

.active #btn-menu span:after {
  transform: rotate(-45deg);
  background: #fff;
}


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

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

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: 11px;
}

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

div.footer-menu dl dd p {
  line-height: 2;
  max-width: 270px;
}

div.footer-menu dl dd p br {
  display: none;
}

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 {
  max-width: 1050px;
  margin: 0 auto;
  padding: 35px 15px;
  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: 15px;
  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-bottom: 35px;
  padding: 0 15px;
  border-bottom: solid #dedede 1px;
}
#top-slider .wpsisac-slick-slider-wrp {
  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: 360px;
}
#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: -30px !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 {
  margin: 0 0 10px;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}

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

.main .btn-more,
.topmain .btn-more,
.personal-main .btn-more,
.treatment-main .btn-more {
  padding: 18px 0;
  max-width: 650px;
  width: 96%;
  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::after {
  content: "";
  display: block;
  width: 320px;
}

.topmain ul.list li {
  margin: 0 10px 60px;
}

.main ul.list {
  flex-flow: row wrap;
  justify-content: center;
}

.main ul.list::after {
  content: "";
  display: block;
  width: 350px;
}

.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 {
  max-width: 300px;
  height: 170px;
  border-radius: 5px;
}

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

ul.list li div.new {
  border-radius: 100px;
  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;
}

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

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 !important;
}

/* 新着ボックス */
.sidebox ul.doctor-list li{
  border-bottom: none !important;
  padding: 0 !important;
}


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

.topside .btn-more,
.topside .btn-search {
  padding: 14px 0;
  margin-top: 20px  !important;
  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: 0.5em;
}

/* セレクトボタン共通(トップ・検索結果一覧) */
#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 {
  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 .new-list ul.list {
  display: block;
}

.topside .sidebox .new-list ul.list li {
  display: block;
}

.topside .sidebox ul li a {
  border-bottom: solid 1px #cccccc;
  padding: 20px 0px;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.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;
  border: none;
}

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

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

.topside .sidebox div.tag-cloud {
  padding-top: 15px;
}

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

/* 新着インタビュー（記事中） */

div.new-list ul.list {
  display: table;
  border-collapse: separate;
  border-spacing: 30px 0;
}

div.new-list ul.list li {
  display: table-cell;
}

div.new-list ul.list li img {
  width: 100%;
  height: auto;
}

div.new-list ul.list li a:hover {
  text-decoration: none;
}

div.new-list a.btn-more {
  margin-top: 50px;
}

/* バナー */
.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;
}

@media (max-width: 943px) {
  .topmain {
    width: auto;
    max-width: none;
    float: none;
  }
  .topmain ul.list {
    justify-content: center;
  }
  .topmain ul.list::after {
    width: 340px;
  }
  .topmain ul.list li {
    margin: 0 20px 60px;
  }
  .topside {
    width: auto;
    max-width: none;
    float: none;
    margin: 0;
  }
  .topside .search-box {
    padding: 45px 30px 30px;
    margin: 0 auto 40px;
    width: 100vw;
  }
  .topside .search-box ul {
    display: inline-block;
    width: 79%;
  }
  .topside .search-box ul li {
    display: inline-block;
    width: 19%;
    vertical-align: top;
    margin-right: 2px;
  }
  .topside .search-box ul li:first-of-type {
    width: 39%;
  }
  .topside .search-box .btn-search {
    max-width: 190px;
    width: 20%;
    background-color: #f3f2ee;
    display: inline-block;
    vertical-align: middle;
    height: 34px;
    padding: 0;
    margin: 0;
  }
  .topside .sidebox {
    width: 80vw;
    margin: 0 auto 40px;
  }
  .topside .sidebox ul li dl dt span{
    display: inline-block;
  }
  .topside .sidebox div.thumbnails {
    display: inline-block;
    vertical-align: middle;
    float: none;
  }
  .topside .banner {
    width: 300px;
    margin: 40px auto 0;
  }
}
@media (min-width: 944px) {
  .topside .search-box input, .topside .search-box select {
    font-size: 14px;
  }
}

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

section.treatment-main,
section.personal-main {
  width: 100%;
  margin: 0 auto;
}

section.treatment-main div.interview,
section.personal-main div.interview {
  width: 90vw;
  margin: 20px auto 60px;
  overflow: hidden;
  clear: both;
  /*.alignleft {
			float: right;
			margin-right: 6px;
		}
		.alignright {
			float: right;
			margin-right: 60px;
		}
		.aligncenter {
			margin-left: 150px;
		}
		.alignnone {
			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.4;
}

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: 100%;
  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: block;
  margin: 15px auto 0;
}

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  {
  font-size: 14px;
  margin-top: 20px;
}

section.treatment-main .interview .price h2 + p,
section.personal-main .interview .price h2 + p {
  margin-top: 0px !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: 0 auto 60px;
  width: 90vw;
  min-height: 330px;
  position: relative;
}

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

div.message div ul {
  font-size: 16px;
}

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

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

div.message img {
  display: inline-block;
  width: 190px;
  height: 190px;
  border-radius: 200px;
  position: absolute;
  top: 50%;
  transform: translateY(-35%);
  right: 50px;
}

/*　別のインタビューを見るボタン　*/
a.btn-another {
  display: block;
  position: relative;
  width: 87.5%;
  margin: 60px auto 0;
  border: solid 1px;
  border-radius: 0;
  padding: 20px 40px 20px 15px;
  letter-spacing: 2px;
  font-weight: bold;
}

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

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

.other-interview ul.list {
  max-width: 800px;
  width: 90vw;
  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;
  max-width: 100%;
  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: 10px;
}

.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.doctor-list {
  display: inline-block;
}

.other-interview ul.list li ul.doctor-list li {
  display: inline-block;
  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;
  border: solid 1px #ccc;
  padding: 40px;
  margin: 60px auto 30px;
  position: relative;
  width: 90vw;
}

.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 p {
  padding-left: 250px;
  min-height: 150px;
  margin-bottom: 30px;
  padding-top: 5px;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.4;
}

.hospital-box div.hospital-info p a {
  position: relative;
  display: block;
  width: 150px;
  height: 28px;
  line-height: 26px;
  margin-top: 15px;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  border: 1px solid #ccc;
  border-radius: 3px;
  background: linear-gradient(180deg, #fff, #e5e5e5);
}

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

.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: 70%;
  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: wrap;
  justify-content: space-between;
  margin-top: 20px;
}

.hospital-box div.caloo-btn div {
  width: 32%;
  height: 40px;
  margin-top: 20px;
}

.hospital-box div.caloo-btn div:only-child {width:100%;}

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

.hospital-box div.caloo-btn div:last-child:nth-child(5) {margin-right: 34%;}

.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 [class$='-btn'] a:hover {
  text-decoration: none;
  opacity: 1;
}

.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 .line-btn a {
  border: 1px solid #06c755;
  color: #06c755;
}


/*　この記事に関するキーワード　*/
div.tag-box {
  width: 90vw;
  margin: 30px auto 70px;
}

div.tag-box p {
  float: left;
  margin-bottom: 5px;
}

div.tag-box ul.tag-list {
  margin: 0;
  padding: 0;
  max-width: 530px;
}

div.tag-box ul.tag-list li {
  display: inline-block !important;
  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 {
  width: 90vw;
  margin: 40px auto 10px;
  position: relative;
  letter-spacing: 1px;
}

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

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

section.treatment-main div.detail-head div.detail-ttl {
  max-width: 600px;
  width: 55vw;
  position: absolute;
  right: 0;
}

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

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

/* 画像 */
section.treatment-main div.detail-head img {
  max-width: 290px;
  width: 30vw;
  display: inline-block;
  margin-right: 45px;
}

/* 病院名・先生名 */
section.treatment-main div.detail-head dl {
  position: absolute;
  bottom: 0;
  display: inline-block;
  line-height: 1.3;
  width: 55vw;
  max-width: 600px;
  right: 0;
}

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

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

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;
}

@media (max-width: 950px) {
  section.treatment-main div.detail-head div.detail-ttl div.treatment-head {
    font-size: 24px;
  }
  section.treatment-main div.detail-head p.tag {
    margin: 20px 0 15px;
  }
  section.treatment-main div.detail-head dl dt {
    font-size: 13px;
    margin-bottom: 5px;
  }
  section.treatment-main div.detail-head dl dd {
    font-size: 18px;
}
}

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

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

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

section.personal-main div.detail-img div.personal-head {
  position: absolute;
  top: 50%;
  transform: translateY(-70%);
  left: 5%;
  font-size: 28px;
  font-weight: bold;
  line-height: 60px;
  letter-spacing: 4px;
  max-width: 365px;
  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: 90vw;
}

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

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

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

section.personal-main div.detail-img div.personal-name span.tag {
  margin-left: 5px;
  padding-top: 4px;
  display: block;
}

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: 22px;
  line-height: 1.3;
}

section.personal-main div.detail-img dl dd ul li {
  margin-right: 10px;
  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: 0 auto 40px;
  width: 100%;
}

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

div.s-box ul li {
  display: inline-block;
  width: 19%;
  margin-right: 2px;
  vertical-align: top;
}

div.s-box ul li:first-of-type {
  width: 39%;
}

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: 0.5em;
}

div.s-box button[class^="btn-"] {
  max-width: 190px;
  width: 20%;
  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 {
  width: 90vw;
  margin: 0 auto;
}

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: #9d9d9d;
}

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　*/

.topside .share ul {
  position: static;
  text-align: center;
}

.share {
  position: relative;
}

.share ul {
  position: absolute;
  right: 40px;
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}

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

.share li {
  display: inline-block;
  vertical-align: top;
  margin: 0 5px;
}

.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;
}

li.line:hover {
  opacity: 0.8;
}

/*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 {
  width: 90vw;
  margin: 0 auto;
  font-size: 12px;
  padding: 12px 10px 0;
  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.top-sns,
div.personal div.top-sns {
  width: 90vw;
  margin: 30px auto 0;
}

div.treatment div.top-sns div.share,
div.personal div.top-sns div.share {
  display: inline-block;
  vertical-align: top;
  margin-left: 10px;
  width: auto;
}

div.treatment {
  max-width: 100% !important;
}

div.treatment div.views {
  /*position: absolute;
	  right: 200px;
	  top: 50px;
	  margin-top: 5px;*/
}

/*============================================================
　Tags
  ============================================================*/
.main ul.list li ul.tag-list,
.topmain ul.tag-list,
div.new-list ul.list ul.tag-list {
  margin: 0 10px;
}

.main ul.list li ul.tag-list li,
.topmain ul.tag-list li,
div.new-list ul.list ul.tag-list li {
  display: inline-block;
  vertical-align: top;
  margin: 0 1em .5em 0em;
}

/*============================================================
　LP
  ============================================================*/
div#lp−contents {
  margin: 0 auto;
  padding-bottom: 75px;
  overflow: hidden;
  /*section.lp−banner {
		background-color: #f2f9fc;
		margin: 100px auto 80px;
		padding: 100px 0;
		min-width: $body-size;

		div.lp-box {
			max-width: 900px;
			min-height: 562px;
			margin: 0 auto 80px;
			background: url(./img/lp/banner_bg.png) no-repeat center bottom;
			position: relative;

			p {
				position: absolute;
				top: 40px;
				right: 50px;
				line-height: $line-height-xxl;
				width: 18rem;
			}
			.sp-img {
				display: block;
			}
		}
	}*/
}

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: 35vw;
  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;
  max-width: 466px;
  width: 70%;
}

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;
  max-width: 268px;
  width: 29%;
  letter-spacing: 2px;
}

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 {
  max-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;
}

@media (max-width: 890px) {
  div#lp−contents section.lp-top {
    color: #fff;
    margin-bottom: 200px;
    text-align: center;
    position: relative;
    width: 100%;
    height: 0;
    padding-top: calc(640 / 640 * 100%);
    /* calc(画像高さ ÷ 画像横幅 × 100%) */
    background-image: url(./img/lp/lp_mainimg_sp.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  div#lp−contents section.lp-top div.top-box {
    position: static;
    top: auto;
    left: auto;
    -webkit-transform: none;
    transform: none;
    width: auto;
  }
  div#lp−contents section.lp-top dl {
    text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
    width: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Safari用 */
    transform: translate(-50%, -50%);
  }
  div#lp−contents section.lp-top dt, div#lp−contents section.lp-top dd {
    margin: 20px 0;
  }
  div#lp−contents section.lp-top dt {
    font-size: 2.2rem;
  }
  div#lp−contents section.lp-top dd {
    line-height: 1.6;
  }
  div#lp−contents section.lp-top dd br {
    display: none;
  }
  div#lp−contents section.lp-top div.btn-box {
    margin: 30px auto;
  }
  div#lp−contents section.lp-top a.btn-entry {
    border: solid #00b259 2px !important;
    color: #00b259 !important;
    max-width: 466px;
    width: 70%;
  }
  div#lp−contents section.lp-top a.btn-entry:hover {
    background-color: #00b259 !important;
    color: #fff !important;
  }
  div#lp−contents section.lp-top a.btn-entry:hover:after {
    border-top: 2px solid #fff !important;
    border-right: 2px solid #fff !important;
  }
  div#lp−contents section.lp-top a.btn-entry:after {
    border-top: 2px solid #00b259 !important;
    border-right: 2px solid #00b259 !important;
  }
  div#lp−contents section.lp-top a.btn-inquiry {
    border: solid #2771ad 2px !important;
    color: #2771ad !important;
    max-width: 268px;
    width: 29%;
    letter-spacing: 2px;
  }
  div#lp−contents section.lp-top a.btn-inquiry:hover {
    background-color: #2771ad !important;
    color: #fff !important;
  }
  div#lp−contents section.lp-top a.btn-inquiry:hover:after {
    border-top: 2px solid #fff !important;
    border-right: 2px solid #fff !important;
  }
  div#lp−contents section.lp-top a.btn-inquiry:after {
    border-top: 2px solid #2771ad !important;
    border-right: 2px solid #2771ad !important;
  }
}

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

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;
  line-height: 1.6;
}

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;
  margin-left: 10px;
}

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 {
  max-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: 30vw;
}

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

div#lp−contents section.lp−banner div.lp-box p {
  line-height: 2.2;
  width: 80%;
  margin: 0 auto;
}

div#lp−contents section.lp−banner div.lp-box div.sp-img {
  display: block;
  margin: 40px auto;
}

div#lp−contents section.lp−banner div.lp-box div.sp-img img {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
}

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

div#lp−contents section.lp-flow div.flow-point img {
  width: 98%;
  margin: 0 auto;
}

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: 120px;
  display: inline-block;
  vertical-align: top;
  margin: 0 10px;
}

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

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

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

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: 140px;
  line-height: 1.6;
}

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

div#lp−contents .sp-img {
  display: none;
}

ul.bnr-box {
  max-width: 1050px;
  margin: 60px auto;
  text-align: center;
}

ul.bnr-box li {
  width: 50vw;
  display: block;
  margin: 0 auto 20px;
  max-width: 500px;
}

ul.bnr-box li a img {
  width: 100%;
  transition: all .3s;
}

ul.bnr-box li a img:hover {
  opacity: 0.7;
  transition: all .3s;
}

/*============================================================
　お問い合わせフォーム
  ============================================================*/
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 {
  max-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: 500px;
  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 {
  max-width: 700px;
  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;
}