@charset "UTF-8";
/*----------------------------------------------------------------------------------------------------
 *
 * Theme Name: KEIAI OB ver2
 * Theme URI:
 * Author:
 * Author URI:
 * Description: KEIAIのOBサイトのテーマ
 * Version: 2
 * License: GNU General Public License v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain:
 *
 *--------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------
 *
 *
 * リセット
 *
 *
--------------------------------------------------------------------------------*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
html,
body {
  width: 100%;
  height: 100%;
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

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

   Clearfix

--------------------------------------------------*/
.cf {
  zoom: 1;
}
.cf:before,
.cf:after {
  content: "";
  display: table;
}
.cf:after {
  clear: both;
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * 基本設定
 *
 *
 *
 *
--------------------------------------------------------------------------------*/
html {
  overflow: auto;
}
@media screen and (max-width: 1000px) {
  body {
    width: 1000px;
  }
}
@media screen and (max-width: 768px) {
  body {
    width: 100%;
    background: none;
  }
}
body {
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif;
  font-size: 100%;
  line-height: 1.75;
  font-weight: normal;
  background: #fff;
  position: relative;
}
a:link,
a:visited {
  color: #000;
  text-decoration: none;
  transition: 0.3s ease;
}
a:hover,
a:active {
  color: #a9884a;
  text-decoration: none;
  transition: 0.3s ease;
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
  backface-visibility: hidden;
}
a:link img,
a:visited img {
  opacity: 1;
  transition: 0.3s ease;
}
a:hover img,
a:active img {
  opacity: 0.6;
  transition: 0.3s ease;
}
video::-webkit-media-controls-enclosure {
  overflow: hidden;
}
video::-webkit-media-controls-panel {
  width: calc(100% + 30px);
}

/* ------------------------------小見出し属性------------------------------　*/
h1,
h2,
h3,
h4,
h5 {
  margin: 0;
  padding: 0;
  line-height: 1.7;
  font-weight: bold;
}
h1 {
  font-size: 30px;
}
h2 {
  font-size: 26px;
  text-align: center;
}
h3 {
  font-size: 20px;
}
h4 {
  font-size: 18px;
}
h5 {
  font-size: 16px;
}

@media screen and (max-width: 768px) {
  h1 {
    font-size: 20px;
  }
  h2 {
    font-size: 19px;
  }
  h3 {
    font-size: 18px;
  }
  h4 {
    font-size: 18px;
  }
  h5 {
    font-size: 16px;
  }
}
p {
  font-size: 16px;
  margin: 0;
  padding: 0;
  line-height: 2;
  display: block;
  color: #000;
}
ul {
  margin: 0;
  padding: 0;
}
li {
  margin: 0;
  padding: 0;
  font-size: 14px;
}
i {
  padding-right: 6px;
}
img {
  max-width: 100%;
  height: auto;
  display: block;
}
@media screen and (max-width: 768px) {
  p {
    font-size: 12px;
  }
  li {
    font-size: 12px;
  }
}
hr {
  border-top: 1px solid #dbdbd9;
  border-bottom: 1px solid #ffffff;
  border-right: none;
  border-left: none;
  margin: 30px 0 40px 0;
}
img.center,
.aligncenter {
  margin: 0 auto;
  display: block;
}
img.left {
  float: left;
  margin: 0 30px 30px 0;
}
img.right {
  float: right;
  margin: 0 0 30px 30px;
}
img.photo00 {
  background: #ffffff;
  padding: 5px;
  box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.05);
}
img.photo-left {
  transform: rotate(-4deg);
  -moz-transform: rotate(-4deg);
  -webkit-transform: rotate(-4deg);
  background: #ffffff;
  padding: 5px;
  box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.05);
}
img.photo-right {
  transform: rotate(4deg);
  -moz-transform: rotate(4deg);
  -webkit-transform: rotate(4deg);
  background: #ffffff;
  padding: 5px;
  box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.05);
}
small {
  font-size: 0.7em;
}
.bold {
  font-weight: bold;
}
.underline {
  text-decoration: underline !important;
}
.red {
  color: #cd4a38;
  font-weight: bold;
}
.blue {
  color: #00acf6;
  font-weight: bold;
}
.red_underline {
  background: linear-gradient(transparent 60%, #ff9999 60%);
}
.yellow {
  color: #000000;
  font-weight: bold;
  background: linear-gradient(transparent 60%, #ffff00 60%);
}
.marker {
  background: linear-gradient(transparent 60%, #f0d916 60%);
}
.center {
  text-align: center;
}
.align_left {
  text-align: left !important;
}
.align_right {
  text-align: right !important;
}
.big {
  font-size: 24px;
}
.sp00 {
  margin-top: 0 !important;
}
.sp10 {
  margin-top: 10px !important;
}
.sp20 {
  margin-top: 20px !important;
}
.sp30 {
  margin-top: 30px !important;
}
.sp40 {
  margin-top: 40px !important;
}
.sp50 {
  margin-top: 50px !important;
}
.sp60 {
  margin-top: 60px !important;
}
.sp70 {
  margin-top: 70px !important;
}
.sp100 {
  margin-top: 100px !important;
}
.align_left {
  text-align: left;
}
.align_right {
  text-align: right;
}
.align_center {
  text-align: center;
}
.ffffff {
  background: #ffffff !important;
}
.f7f7f7 {
  background: #f7f7f7 !important;
}
@media screen and (max-width: 768px) {
  img.left,
  img.right {
    float: none;
    margin: 0 auto 20px auto;
    display: block;
  }
  .big {
    font-size: 16px;
  }
}
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}
@media screen and (max-width: 768px) {
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * ヘッダー
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

header#header {
  width: 100%;
  height: auto;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  padding: 0;
  position: absolute;
  top: 0;
  z-index: 9999;
}
header#header p {
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  header#header {
    width: 100%;
    height: auto;
    position: fixed;
  }
  header#header #inner {
    width: 100%;
    height: auto;
  }
}

header#header ul.two_row {
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; /*左右に配置*/
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; /*上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
header#header ul.two_row li:nth-child(1) {
}
header#header ul.two_row li:nth-child(2) {
}

@media screen and (max-width: 768px) {
  header#header ul.two_row {
    height: 50px;
  }
  header#header ul.two_row li:nth-child(1) {
  }
}

header#header p.inquiry a {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 12px;
  background: #ff3333;
  color: #fff;
  padding: 0;
  display: block;
  width: 130px;
  height: 50px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex; /*インライン要素*/
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; /*上下中央*/
}

@media screen and (max-width: 768px) {
  header#header p.inquiry a {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #ff3333;
    color: #fff;
    padding: 10px 20px;
    border-radius: 100px;
    font-size: 10px;
    line-height: 1;
    width: auto;
    height: auto;
  }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * パンくずリスト
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

nav#pan {
  text-align: left;
  margin: 10px 0 0 0;
  padding: 0 0 2px 0;
}
nav#pan ol {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}
nav#pan ol li {
  display: inline;
  list-style-type: none;
  font-size: 12px;
  color: #fff;
  background: #ff0000;
  margin: 0 5px;
  padding: 10px 20px;
  border-radius: 5px;
  position: relative;
}
nav#pan ol li:after {
  position: absolute;
  content: "";
  top: 9px;
  right: -12px;
  width: 0px;
  border-color: #ff0000;
  border-style: solid;
  border-width: 6px;
  border-right-color: transparent;
  border-top-color: transparent;
  border-bottom-color: transparent;
}
nav#pan ol li:last-child {
  background: #fff;
  color: #000;
}
nav#pan ol li:last-child:after {
  border-width: 0;
}
nav#pan ol li a {
  color: #fff;
}
@media screen and (max-width: 768px) {
  nav#pan {
    margin: 0;
  }
  nav#pan ol {
    width: 100%;
  }
  nav#pan ol li {
    font-size: 10px;
    padding: 6px 10px;
  }
  nav#pan ol li:after {
    top: 7px;
    right: -8px;
    width: 0px;
    border-color: #ff0000;
    border-style: solid;
    border-width: 4px;
    border-right-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
  }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * FV
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

header#fv {
  width: 100%;
  height: auto;
  padding-top: 50px;
}
header#fv #inner {
  width: 1000px;
  height: auto;
  margin: 0 auto;
  padding: 0;
  position: relative;
}
header#fv #h1 {
  margin: 0;
  padding: 0;
}
header#fv p {
  margin: 0;
  padding: 0;
}
header#fv a:hover img {
  opacity: 1;
}
@media screen and (max-width: 768px) {
  header#fv {
    background: none;
    width: 100%;
    height: auto;
    background: none;
    padding-top: 50px;
  }
  header#fv #inner {
    width: 100%;
    height: auto;
  }
}

.slider {
  margin: 0 0 50px;
}
.slider img {
  max-width: 100%;
  height: 600px;
  margin: 0 auto;
  object-fit: cover;
  object-position: 50% 0;
}
.slider .slick-next {
  right: 20px;
  z-index: 99;
}
.slider .slick-prev {
  left: 15px;
  z-index: 100;
}

@media screen and (max-width: 768px) {
  .slider img {
    height: auto;
  }
}

/* ------------------------------固定ページ------------------------------　*/
header#mv {
  width: 100%;
  height: 500px;
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/common/header_bg.jpg) no-repeat 50% 50%;
  background-size: auto, cover;
  padding-top: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; /*上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
/* header#mv #inner { margin:0 auto; padding:0; position:relative; } */
header#mv #inner {
  padding: 0;
  position: relative;
}
header#mv h1 {
  margin: 0;
  padding: 0;
  color: #fff;
  text-align: center;
  font-size: 40px;
}
@media screen and (max-width: 768px) {
  header#mv {
    width: 100%;
    height: 320px;
  }
  header#mv #inner {
    width: 100%;
    margin: 0;
    padding: 20px 20px;
  }
  header#mv h1 {
    margin: 0;
    padding: 0;
    font-size: 20px;
  }
}

header#mv p {
  font-size: 130px;
  color: #fff;
  line-height: 1;
  font-family: "senobi_bold";
  text-align: center;
}
header#mv p.small {
  font-size: 100px;
}
@media screen and (max-width: 768px) {
  header#mv p {
    font-size: 40px;
  }
  header#mv p.small {
    font-size: 40px;
  }
}

/* ------------------------------投稿ページ------------------------------　*/
header#mv_single {
  width: 100%;
  height: 300px;
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/common/header_bg.jpg) no-repeat 50% 50%;
  background-size: auto, cover;
  padding-top: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; /*上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
/* header#mv_single #inner { margin:0 auto; padding:0; position:relative; } */
header#mv_single #inner {
  padding: 0;
  position: relative;
}
header#mv_single h1 {
  margin: 0;
  padding: 0;
  color: #fff;
  text-align: center;
  font-size: 30px;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
}
header#mv_single a.button_single {
  display: block;
  width: 250px;
  border: 1px solid #ffffff;
  font-weight: bold;
  margin: 20px auto;
  padding: 10px;
  text-align: center;
  color: #fff;
  font-weight: normal;
  font-size: 12px;
}

@media screen and (max-width: 768px) {
  header#mv_single {
    width: 100%;
    height: 320px;
  }
  header#mv_single #inner {
    width: 100%;
    margin: 0;
    padding: 20px 20px;
  }
  header#mv_single h1 {
    margin: 0;
    padding: 0;
    font-size: 20px;
  }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * コンテンツ
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/* ------------------------------共通------------------------------　*/
section {
  width: 100%;
}
section .inner {
  width: 1000px;
  margin: 0 auto;
  padding: 60px 0;
}
section h2 {
  margin-bottom: 30px;
}

@media screen and (max-width: 1000px) {
  section .inner {
    width: 1000px;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  section .inner {
    width: 90%;
    padding: 30px 0;
  }
}
@font-face {
  font-family: "tsukushi";
  src: url("font/tsukushi.woff") format("woff");
}
@font-face {
  font-family: "tsukushi_bold";
  src: url("font/TsukushiAMaruGothic.woff") format("woff");
}
@font-face {
  font-family: "din-alternate-bold";
  src: url("font/din-alternate-bold.ttf");
}
@font-face {
  font-family: "senobi_bold";
  src: url("font/Senobi-Gothic-Bold.ttf");
}
.video {
  position: relative;
  width: 100%;
  height: 0;
  margin: 0 auto;
  padding-top: 55%;
}
.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.frame {
  width: 650px;
  height: 390px;
  background: url(img/waku.png) no-repeat 50% 0;
  background-size: contain;
  padding: 22px 20px 0 20px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .frame {
    width: 100%;
    height: auto;
    background-size: contain;
    padding: 3.5% 4% 5% 4%;
  }
}

/* ------------------------------トップページ------------------------------　*/
#top .inner {
  padding: 40px 0;
}
#top p.english {
  font-size: 50px !important;
  text-align: center;
  color: #333 !important;
  margin: 0;
  font-weight: bold;
  position: relative;
}
#top p.english:before {
  content: "";
  position: absolute;
  bottom: -0px;
  display: inline-block;
  width: 60px;
  height: 5px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: black;
  border-radius: 2px;
  background: #de3532;
}
#top h2 {
  color: #de3532;
  font-size: 16px;
  margin-top: 20px;
}

a.button {
  border: 2px solid #000;
  font-weight: bold;
  padding: 20px;
  text-align: center;
}
a.button:hover {
  background: #000;
  color: #fff;
}
@media screen and (max-width: 768px) {
  p.english {
    font-size: 40px !important;
    text-align: center;
    color: #333 !important;
    margin: 0;
    font-weight: bold;
  }
}

/*--------------------------------------------------------------------------------
 *
 * opening
 *
--------------------------------------------------------------------------------*/

img.opening_top {
  position: absolute;
  top: -70px;
  margin: auto;
  left: 50%;
  right: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  width: 1600px;
  height: 270px;
  object-fit: cover;
}
@media screen and (max-width: 768px) {
  img.opening_top {
    top: -100px;
    width: 100%;
    height: auto;
  }
}

.opening {
  position: relative;
}
.opening p {
  margin: 0;
  padding: 0;
}
.opening ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row; /*左から配置*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
} /*折り返す*/
.opening li {
  position: relative;
  width: 23.5%;
  position: relative;
  background: #de3532;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  margin-top: 2%;
}
.opening li:nth-child(4n + 1) {
  margin-right: 2%;
}
.opening li:nth-child(4n + 2) {
  margin-right: 2%;
}
.opening li:nth-child(4n + 3) {
  margin-right: 2%;
}
.opening li:nth-child(4n + 4) {
  margin-right: 0;
}
.opening li img {
  width: 100%;
  height: 170px;
  object-fit: cover;
  object-position: 50% 0;
}
.opening p.title {
  text-align: center;
  margin: 0;
  padding: 10px;
  font-size: 12px;
  color: #fff;
}
.opening a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  color: #fff;
}
.opening p.category {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  padding: 5px 20px;
  font-size: 12px;
  border-radius: 100px;
}

@media screen and (max-width: 768px) {
  .opening li {
    width: 47.5%;
    margin-right: 0%;
    margin-bottom: 5%;
  }
  .opening li:nth-child(4n + 1) {
    margin-right: 5%;
  }
  .opening li:nth-child(4n + 2) {
    margin-right: 0;
  }
  .opening li:nth-child(4n + 3) {
    margin-right: 5%;
  }
  .opening li:nth-child(4n + 4) {
    margin-right: 0;
  }
}

@media screen and (max-width: 420px) {
  .opening li {
    width: 100%;
    margin-right: 0%;
    margin-bottom: 5%;
  }
  .opening li:nth-child(4n + 1) {
    margin-right: 0;
  }
  .opening li:nth-child(4n + 2) {
    margin-right: 0;
  }
  .opening li:nth-child(4n + 3) {
    margin-right: 0;
  }
  .opening li:nth-child(4n + 4) {
    margin-right: 0;
  }
}

/*--------------------------------------------------------------------------------
 *
 * news
 *
--------------------------------------------------------------------------------*/
#news {
  background: url(img/index/opening_bg.png) no-repeat 50% 40%;
  border-top: 3px solid #de3532;
}
@media screen and (max-width: 768px) {
  #news {
    padding: 0 0 30px 0;
  }
}
span.new {
  background: #de3532;
  color: #fff;
  padding: 5px 10px;
  font-weight: normal;
}

ul#notice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /*-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;中央に配置*/
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; /*左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center; 上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
ul#notice > li:nth-child(1) {
  width: 26%;
  position: relative;
}
ul#notice > li:nth-child(2) {
  width: 70%;
  position: relative;
}

ul#notice a.link_area {
  display: block;
  width: 100%;
  border: 1px solid #000;
  color: #404040;
  text-align: center;
  padding: 10px 10px;
  letter-spacing: 2px;
  font-size: 12px;
}
ul#notice a.link_area:before {
  content: ">";
  margin-right: 10px;
}

@media screen and (max-width: 768px) {
  ul#notice > li:nth-child(1) {
    width: 100%;
  }
  ul#notice > li:nth-child(2) {
    width: 100%;
    border: none;
  }
  ul#notice > li:nth-child(2):before {
    border: none;
  }
}

dl.news_line {
  width: 100%;
  margin: 0;
}
dl.news_line dt,
dl.news_line dd {
  height: 40px;
  padding: 20px 0 40px 0;
  border-bottom: 1px dotted #000;
  letter-spacing: 0.2em;
}
dl.news_line dt {
  clear: left;
  float: left;
  width: 25%;
  font-size: 12px;
  color: #de3532;
  font-weight: bold;
}
dl.news_line dt > a {
  background: #de3532;
  color: #fff;
  padding: 4px 10px;
  border-radius: 3px;
  margin-left: 10px;
  pointer-events: none;
}
dl.news_line dd {
  margin-left: 25%;
  font-size: 12px;
}
dl.news_line dd:after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f054";
  float: right;
}
dl.news_line dd > a {
  color: #1c1c1c;
}
dl.news_line dt:first-child,
dl.news_line dt:first-child + dd {
  border-top: 0;
}

@media screen and (max-width: 768px) {
  dl.news_line dt,
  dl.news_line dd {
    height: auto;
    padding: 0;
  }
  dl.news_line dt {
    clear: both;
    float: none;
    width: 100%;
    font-size: 10px;
    padding: 20px 0 10px 0;
    border-bottom: 0;
  }
  dl.news_line dd {
    margin-left: 0%;
    border-top: none;
    padding-bottom: 20px;
    font-size: 12px;
  }
}

/*--------------------------------------------------------------------------------
 *
 * info
 *
--------------------------------------------------------------------------------*/
.info {
  background: #de3532;
}
.info p {
  margin: 0;
}
.info ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row; /*左から配置*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
} /*折り返す*/
.info li {
  width: 23.5%;
  margin-right: 2%;
}
.info li img {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  margin: 0 auto;
}
.info li:nth-child(4n + 4) {
  margin-right: 0;
}

@media screen and (max-width: 768px) {
  .info li {
    width: 100%;
    margin-right: 0%;
    margin-bottom: 5%;
  }
}

/*--------------------------------------------------------------------------------
 *
 * ３列メニュー
 *
--------------------------------------------------------------------------------*/

ul.box_menu {
  padding-top: 60px;
  margin-top: 2px;
  background: url(img/box_menu_bg.png) no-repeat 50% 0, url(img/instagram_bg.png) repeat 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
ul.box_menu li {
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
ul.box_menu li:nth-child(2) {
  margin: 0 20px;
}
ul.box_menu li a {
  margin: 0;
  padding: 0;
}

@media screen and (max-width: 768px) {
  ul.box_menu li {
    margin: 10px 0;
  }
  ul.box_menu li:nth-child(2) {
    margin: 10px 0 10px 20px;
  }
}

@media screen and (max-width: 660px) {
  ul.box_menu li:nth-child(2) {
    margin: 10px 0;
  }
}

/*--------------------------------------------------------------------------------
 *
 * NEWS
 *
--------------------------------------------------------------------------------*/
/* ------------------------------新着情報（トップページ）------------------------------　*/
ul.post {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
ul.post li {
  width: 320px;
  flex-basis: 320px;
  margin: 0;
  padding: 0 0 20px 0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
ul.post li:nth-child(3n + 2) {
  margin: 0 20px;
}
ul.post li p {
  font-size: 12px;
  margin: 0;
  padding: 0 20px;
}
ul.post img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  margin: 0 auto 15px auto;
  padding: 0;
  font-family: "object-fit:cover; object-position:50% 0;"; /*ie対応*/
}
ul.post li h3 {
  font-size: 16px;
  font-weight: bold;
  padding: 0 20px;
  margin: 0;
}

@media screen and (max-width: 768px) {
  ul.post li {
    width: 100%;
    max-width: 320px;
    margin: 10px 0;
    padding: 0 0 20px 0;
  }
  ul.post li:nth-child(3n + 2) {
    margin: 10px 0px 10px 20px;
  }
}
@media screen and (max-width: 660px) {
  ul.post li:nth-child(3n + 2) {
    margin: 10px 0;
  }
}

/*---ガテゴリーを画像の上に---*/
.relative {
  position: relative;
}
.relative ul.post-categories {
  margin: 0;
  padding: 0;
  list-style: none;
  position: absolute;
  bottom: 10px;
  left: 20px;
}
.relative ul.post-categories li {
  position: relative;
  display: inline-block;
  width: auto;
  height: 30px;
  line-height: 30px;
  margin: 0;
  padding: 0 1em;
  background-color: #321603;
  border-radius: 30px;
  color: #fff;
  text-decoration: none;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  list-style: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
.relative ul.post-categories li a {
  display: block;
  max-width: 300px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 10px;
  color: #fff;
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * 問い合わせフォーム
 *
 *
 *
 *
--------------------------------------------------------------------------------*/
.inquiry section {
  padding-top: 100px !important;
}
.inquiry h1 {
  text-align: center;
}
.inquiry p {
  text-align: center;
  margin: 20px 0;
  font-size: 14px;
}

@media screen and (max-width: 768px) {
  .inquiry section {
    padding-top: 80px !important;
  }
}

#page dl.form {
  width: 70%;
}
#page dl.form dt {
  color: #000;
}
dl.form {
  width: 49%;
  margin: 0 auto;
}
dl.form dt,
dl.form dd {
  padding: 10px 0;
}
dl.form dt {
  clear: left;
  float: left;
  width: 33%;
  font-size: 14px;
  text-align: right;
  color: #fff;
  padding-right: 2%;
}
dl.form dt:first-child {
  border-top: 0;
}
dl.form dd {
  margin-left: 33%;
}

@media screen and (max-width: 768px) {
  dl.form {
    width: 100% !important;
  }
  dl.form dt,
  dl.form dd {
    padding: 0;
  }
  dl.form dt {
    clear: both;
    float: none;
    width: 100%;
    font-size: 12px;
    text-align: left;
  }
  dl.form dd {
    margin-top: 5px;
    margin-left: 0%;
    border-top: none;
    padding-bottom: 20px;
  }
}

/* ------------------------------プレースホルダーの色・サイズ指定------------------------------　*/
input::-webkit-input-placeholder {
  color: #ccc;
  font-size: 14px;
}
input:-moz-placeholder {
  color: #ccc;
  font-size: 14px;
}
textarea::-webkit-input-placeholder {
  color: #ccc;
  font-size: 14px;
}
textarea:-moz-placeholder {
  color: #ccc;
  font-size: 14px;
}

/* ------------------------------コンタクトフォーム７------------------------------　*/
input,
textarea,
select {
  width: 100%;
  border: 1px solid #ccc;
  padding: 14px;
  font-size: 16px;
  border-radius: 2px;
}
textarea {
  height: 215px;
}
select {
  height: 60px;
}

/* ------------------------------エラー個所をわかりやすく表示------------------------------　*/
select {
  background: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 3px;
  color: #0c2245;
  font-size: 14px;
  height: 40px;
  line-height: 30px;
  text-align: left;
  text-indent: 5px;
  vertical-align: middle;
  width: 100%;
}
.hissu {
  background: #ff3333;
  color: #ffffff;
  margin: 0 0 0 5px;
  padding: 3px 7px;
  font-weight: bold;
  border-radius: 3px;
  font-size: 10px;
}
.nini {
  background: #777777;
  color: #ffffff;
  margin: 0 0 0 5px;
  padding: 3px 7px;
  font-weight: bold;
  border-radius: 3px;
  font-size: 10px;
}

/* ------------------------------送信ボタン------------------------------　*/
input[type="submit"] {
  -webkit-appearance: none;
  margin: 0 auto;
  background: none;
  display: block;
  font-size: 14px !important;
  width: 100%;
  height: auto;
  margin: 0 auto;
  color: #fff;
  background: linear-gradient(-135deg, #ff3333, #ff3333);
  border: none !important;
}
input[type="submit"]:hover {
  background: linear-gradient(135deg, #ff3333, #ff3333);
  color: #fff;
  transition: 0.3s ease;
}
/* ------------------------------チェックボックスのデザイン------------------------------　*/
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  margin-right: 0 !important;
}
label {
  font-size: 14px;
  color: #fff;
}
.column {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; /*左右に配置*/
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; /*上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#page label {
  color: #000;
}
.vertical-item {
  width: 50%;
}

@media screen and (max-width: 768px) {
  label {
    font-size: 12px;
  }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * フッター
 *
 *
 *
 *
--------------------------------------------------------------------------------*/
footer {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 20px 0 20px 0;
  background: #000;
  z-index: 999;
}
#footer {
  max-width: 1000px;
  margin: 0 auto;
}
footer p {
  font-size: 10px;
  color: #fff;
  text-align: center;
}
footer p a {
  color: #fff !important;
}
footer img.logo {
  margin: 0 0 20px 0;
}
footer ul {
  display: table;
  width: 100%;
}
footer ul li {
  display: table-cell;
  width: 50%;
  float: left;
}
footer li a {
  font-size: 10px;
  color: #fff !important;
}
address {
  font-size: 10px;
  text-align: center;
  padding: 0;
  color: #fff;
}

@media screen and (max-width: 768px) {
  footer {
    padding: 30px 0 30px 0;
  }
  #footer {
    max-width: 320px;
    margin: 0 auto;
  }
  footer img {
    margin: 0 auto;
  }
  footer p {
    font-size: 10px;
    text-align: center;
    margin: 0;
  }
  footer img.logo {
    width: 150px;
    margin: 0 auto 20px auto;
  }
  address {
    font-size: 10px;
    text-align: center;
  }
  footer ul {
    margin: 0 auto;
  }
  footer ul li {
    text-align: left;
  }
  footer li a {
    font-size: 10px;
  }
  address {
    font-size: 10px;
  }
}

footer table {
  color: #734719;
  margin-bottom: 10px;
}
footer table tr {
  border-bottom: 1px solid #734719;
}
footer table th {
  width: 20%;
}
footer table td {
  width: 11.4285%;
  text-align: center;
}
footer table th,
footer table td {
  padding: 10px 0;
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *  記事ページ
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------
 *
 * ブログ一覧ページ(トップページ)
 *
--------------------------------------------------------------------------------*/
#blog_top_container {
  width: 1000px;
  margin: 0 auto;
  padding: 60px 0 60px 0;
}
#blog_top_container article section {
  width: 66.2%;
  float: left;
}

@media screen and (max-width: 768px) {
  #blog_top_container {
    width: 90%;
  }
  #blog_top_container article section {
    width: 100%;
    padding-top: 0px;
    float: none;
  }
  #blog_top_container article h2 {
    width: 100%;
    max-width: 320px;
    margin: 0 auto 10px auto;
    padding: 10px;
    font-size: 12px;
  }
}

aside#blog {
  width: 31%;
  float: right;
}
aside#blog .inner {
  background: #fff url(img/common/aside_bg.jpg) no-repeat 50% 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  padding: 60px 40px 40px 40px;
}
aside#blog img {
  border-radius: 60px;
  margin: 0 auto;
  display: block;
}
aside#blog h3 {
  font-size: 20px;
  margin: 0;
  padding: 20px 0;
  text-align: center;
}
aside#blog p {
  font-size: 12px;
  margin: 0;
}
aside#blog p.name {
  font-size: 20px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  aside#blog {
    width: 100%;
    max-width: 320px;
    float: none;
    margin: 4% auto 0 auto;
  }
}

/* ------------------------------新着情報（トップページ）------------------------------　*/
ul.post {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
ul.post li {
  width: 31%;
  margin-bottom: 4%;
  padding: 0 0 20px 0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
ul.post li:nth-child(3n + 2) {
  margin: 0 3.5% 4% 3.5%;
}
ul.post li p {
  font-size: 12px;
  margin: 0;
  padding: 0 20px;
  color: #7b7b7b;
}
ul.post img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: 50% 0;
  margin: 0 auto 15px auto;
  padding: 0;
  font-family: "object-fit:cover; object-position:50% 0;"; /*ie対応*/
}
ul.post li h3 {
  font-size: 20px;
  font-weight: bold;
  padding: 10px 20px;
  margin: 0;
}
ul.post li h3 a {
  color: #7b7b7b;
}

@media screen and (max-width: 768px) {
  ul.post li {
    width: 100%;
    max-width: 320px;
    margin: 10px 0;
    padding: 0 0 20px 0;
  }
  ul.post li:nth-child(3n + 2) {
    margin: 10px 0px 10px 20px;
  }
}
@media screen and (max-width: 660px) {
  ul.post li:nth-child(3n + 2) {
    margin: 10px 0;
  }
}

/*---ガテゴリーを画像の上に---*/
.relative {
  position: relative;
}
.relative ul.post-categories {
  margin: 0;
  padding: 0;
  list-style: none;
  position: absolute;
  bottom: 10px;
  left: 20px;
}
.relative ul.post-categories li {
  position: relative;
  display: inline-block;
  width: auto;
  height: 30px;
  line-height: 30px;
  margin: 0;
  padding: 0 1em;
  background-color: #333;
  border-radius: 30px;
  color: #fff;
  text-decoration: none;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  list-style: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
.relative ul.post-categories li a {
  display: block;
  max-width: 300px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 10px;
  color: #fff;
}

/* ------------------------------新着情報（トップページ）------------------------------　*/
ul.post02 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
ul.post02 li {
  width: 46.7%;
  max-width: 320px;
  margin-bottom: 6%;
  padding: 0 0 20px 0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
ul.post02 li:nth-child(2n + 2) {
  margin: 0 0 6% 5.5%;
}
ul.post02 li p {
  font-size: 12px;
  margin: 0;
  padding: 0 20px;
  color: #7b7b7b;
}
ul.post02 img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  margin: 0 auto 15px auto;
  padding: 0;
  font-family: "object-fit:cover; object-position:50% 0;"; /*ie対応*/
}
ul.post02 li h3 {
  font-size: 20px;
  font-weight: bold;
  padding: 10px 20px;
  margin: 0;
}
ul.post02 li h3 a {
  color: #7b7b7b;
}

@media screen and (max-width: 768px) {
  ul.post02 {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; /*中央に配置*/
  }
  ul.post02 li {
    width: 100%;
    max-width: 320px;
    margin: 10px 0;
    padding: 0 0 20px 0;
  }
  ul.post02 li:nth-child(3n + 2) {
    margin: 10px 0px 10px 20px;
  }
}
@media screen and (max-width: 660px) {
  ul.post02 li:nth-child(3n + 2) {
    margin: 10px 0;
  }
}

/* ------------------------------ページャー------------------------------　*/
#pagenation {
  text-align: center;
  margin-top: 30px;
}
#pagenation #pagenation-list {
  display: inline-block;
}
#pagenation:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
#pagenation #pagenation-list li {
  float: left;
  background: none;
  list-style: none;
  padding: 0;
  margin: 0 5px 5px 0;
}
#pagenation #pagenation-list li:last-child {
  margin-left: 0;
}
#pagenation #pagenation-list a,
#pagenation #pagenation-list span {
  background: none;
  display: block;
  margin: 0;
  padding: 4px 9px;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}
#pagenation #pagenation-list .current {
  background: #dedede;
  color: #696969;
  border: 1px solid #e3e3e3;
}
#pagenation #pagenation-list .omit {
  padding: 4px 2px;
  color: #777777;
}
#pagenation #pagenation-list li a {
  color: #333333;
  border: 1px solid #6b6b6b;
  text-decoration: none;
}
#pagenation #pagenation-list a:hover {
  background: #f0f0f0;
  color: #000000;
  border: 1px solid #121212;
  text-decoration: none;
}

/*--------------------------------------------------------------------------------
 *
 * 記事ページ
 *
--------------------------------------------------------------------------------*/
p.single_ymd {
  font-size: 12px;
  color: #d33532;
  text-align: center;
  margin: 0;
  font-weight: bold;
}
p.single_ymd a {
  color: #4773ba;
}
p.single_category {
  font-size: 12px;
  color: #7b7b7b;
  text-align: center;
  margin: 0 0 50px 0;
}

#blog_single_container {
  width: 1000px;
  margin: 0 auto;
  padding: 30px 0 60px 0;
}
@media screen and (max-width: 1000px) {
  #blog_single_container {
    width: 100%;
    padding: 50px 0 30px 0;
  }
}

#blog_single_container section {
  width: 66.2%;
  float: left;
  background: #fff;
  padding: 40px 40px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 768px) {
  #blog_single_container section {
    width: 100%;
    float: none;
    padding: 40px 20px;
  }
}

#blog_single_container h1 {
  font-size: 26px;
  font-weight: bold;
  padding: 10px 0;
  margin: 0;
  color: #7b7b7b;
  text-align: center;
}
#blog_single_container h2 {
  font-size: 26px;
  background: #f7f7f7;
  margin-top: 40px;
  padding: 30px;
  color: #333;
  border-left: 9px solid #333;
  line-height: 40px;
}
#blog_single_container h3 {
  font-size: 20px;
  letter-spacing: 1.6px;
  margin-top: 40px;
  padding: 0px 15px 0px;
  border-left: 6px solid #333;
}
#blog_single_container h4 {
  font-size: 16px;
  letter-spacing: 1.6px;
  margin-top: 40px;
}
#blog_single_container p.ymd {
  font-size: 12px;
  color: #7b7b7b;
  text-align: center;
  margin: 0;
}
#blog_single_container p.ymd a {
  color: #4773ba;
}
#blog_single_container img.attachment-thumb768 {
  width: 100%;
  margin: 40px auto;
}
#blog_single_container img.attachment-thumb1200 {
  width: 100%;
  margin: 40px auto;
}

@media screen and (max-width: 768px) {
  #blog_single_container h1 {
    font-size: 18px;
  }
  #blog_single_container h2 {
    font-size: 18px;
    padding: 20px 20px;
  }
  #blog_single_container h3 {
    font-size: 18px;
  }
}

p.point {
  font-weight: bold;
}
p.point:before {
  font-family: "Font Awesome 5 Free";
  content: "\f00c";
  font-weight: 900;
  margin-right: 6px;
  color: #dd3532;
}
@media screen and (max-width: 768px) {
  p.point {
  }
}

.content ul {
  background-color: #f7f7f7;
  border: dashed 1px #333;
  padding: 20px 20px;
  margin: 2em 0;
}
.content ul li {
  margin-top: 10px;
}
.content ul li:first-child {
  margin-top: 0;
}
.content ul li:before {
  content: "●";
  margin-right: 10px;
}

.content ol {
  background-color: #f7f7f7;
  border: dashed 1px #333;
  padding: 20px 20px 20px 30px;
  margin: 2em 0;
  list-style-type: decimal;
}
.content ol li {
  margin-top: 10px;
}
.content ol li:first-child {
  margin-top: 0;
}

/* ------------------------------関連記事一覧------------------------------　*/
p.kanren {
  font-size: 14px;
  margin: 40px 0 0 0;
  padding: 0;
  font-weight: bold;
}
ul.related {
  margin: 0;
}
ul.related li {
  border-bottom: 1px dotted #cccccc;
  padding: 20px 0;
}
ul.related img {
  display: block;
  width: 100px;
  height: 100px;
  float: left;
  margin: 0 20px 0 0;
  padding: 0;
}
ul.related a {
  font-size: 10px;
  font-weight: normal;
}
ul.related p {
  margin: 0;
  padding: 0;
  font-size: 10px;
}
ul.related p.title a {
  font-size: 14px;
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *  固定ページ
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *--------------------------------------------------------------------------------*/

article#page {
  background: #f7f7f7;
}
article#page section {
  width: 1000px;
  margin: 0 auto;
  padding: 60px 0 60px 0;
}
article#page section .inner {
  width: 100%;
  background: #fff;
  padding: 100px 100px 100px 100px;
  margin: 0px auto;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  position: relative;
}
article#page section .inner h2:first-child {
  margin-top: 0 !important;
}
article#page section .inner h2 {
  margin-top: 50px;
}
@media screen and (max-width: 768px) {
  article#page section {
    width: 90%;
    padding: 30px 0;
  }
  article#page section .inner {
    padding: 50px 20px;
  }
}

article#page h2 {
  margin-top: 20px;
}
article#page ul {
  margin-top: 20px;
}
article#page h2 {
  background: #f7f7f7;
  margin-top: 40px;
  padding: 20px;
  border-left: 6px solid #e60012;
  line-height: 40px;
}
article#page h3 {
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  article#page p {
    font-size: 14px;
  }
}

article#page .content a {
  color: #0000ff;
  text-decoration: underline;
}
article#page .content p {
  margin-top: 20px;
}
article#page .content strong {
  font-weight: bold;
}
article#page .content em {
  font-style: italic;
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * 下層ページ
 *
 *
 *
 *
--------------------------------------------------------------------------------*/
/* ------------------------------各種ページのヘッダー画像 ------------------------------　*/
.floor {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/flooring/header_bg.jpg) no-repeat 50% 50% !important;
  background-size: auto, cover !important;
}
.window {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/window/header_bg.jpg) no-repeat 50% 50% !important;
  background-size: auto, cover !important;
}
.door {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/door/header_bg.jpg) no-repeat 50% 50% !important;
  background-size: auto, cover !important;
}
.kitchen {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/kitchen/header_bg.jpg) no-repeat 50% 50% !important;
  background-size: auto, cover !important;
}
.washstand {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/washstand/header_bg.jpg) no-repeat 50% 50% !important;
  background-size: auto, cover !important;
}
.toilet {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/toilet/header_bg.jpg) no-repeat 50% 20% !important;
  background-size: auto, cover !important;
}
.roof {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/roof/header_bg.jpg) no-repeat 50% 30% !important;
  background-size: auto, cover !important;
}
.personalize {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/personalize/header_bg.jpg) no-repeat 50% 50% !important;
  background-size: auto, cover !important;
}

h2 {
  color: #000;
  font-size: 30px;
  letter-spacing: 5px;
}
h2 img {
  margin: 0 auto;
}
h3 {
  text-align: center;
}
@media screen and (max-width: 768px) {
  h2 {
    font-size: 20px;
    letter-spacing: 2px;
  }
}
img {
  margin: 0 auto;
}
h3 + img {
  margin-top: 10px;
}
img + p {
  margin-top: 10px;
}
ul + p {
  margin-top: 20px;
}
p.description {
  font-size: 14px !important;
  font-weight: normal !important;
}
p.description02 {
  font-size: 10px !important;
  font-weight: normal !important;
}
p.rei {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  font-family: "senobi_bold";
  background: #000;
  color: #fff;
  padding-top: 5px;
}
@media screen and (max-width: 768px) {
  p.rei {
    width: 40px;
    height: 40px;
  }
  p.description02 {
    font-size: 10px !important;
  }
}

.point_box {
  width: 53%;
  margin: 30px auto;
}
.point_box p {
  text-align: left !important;
}
.point_box i {
  color: #c83532;
}
@media screen and (max-width: 768px) {
  .point_box {
    width: 100%;
    margin: 20px auto;
  }
}

/* ------------------------------３つのポイント ------------------------------　*/
#point03 {
  height: 0;
  position: relative;
}
#point03 .inner {
  padding: 0;
}
#point03 ul {
  margin-top: -80px;
  position: absolute;
  left: 0;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#point03 ul li {
  width: 160px;
  height: 160px;
  background: #fff;
  border-radius: 80px;
  text-align: center;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
#point03 ul li:nth-child(2) {
  margin: 0 10px;
}
#point03 ul li div {
  width: 150px;
  height: 150px;
  border: 1px solid #db3532;
  border-radius: 75px;
  margin: 5px;
  padding-top: 30px;
}
#point03 i {
  padding: 0;
  color: #db3532;
  font-size: 20px;
}
#point03 p {
  color: #db3532;
  font-weight: bold;
  font-size: 16px;
  line-height: 1.7;
}

@media screen and (max-width: 768px) {
  #point03 ul {
    margin-top: -40px;
  }
  #point03 ul li {
    width: 100px;
    height: 100px;
  }
  #point03 ul li div {
    width: 90px;
    height: 90px;
    padding-top: 15px;
  }
  #point03 i {
    font-size: 14px;
  }
  #point03 p {
    color: #db3532;
    font-weight: bold;
    font-size: 10px;
    line-height: 1.7;
  }
}

/* ------------------------------こんなお悩みありませんか？ ------------------------------　*/
#worry {
  background: #f7f7f7 url(img/common/before.png) no-repeat 50% 100px;
}
#worry .inner {
  padding-top: 130px;
}
#worry ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#worry ul li {
  background: #fff;
  width: 32%;
  border: 2px solid #000;
  padding: 20px;
}
#worry ul li:nth-child(3n + 2) {
  margin: 0 2%;
}
#worry ul li img {
  margin: 0 auto;
}
#worry ul li p {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  margin-top: 20px;
}
#worry ul li p + p {
  font-size: 12px;
  margin-top: 0px;
}
#worry ul.col04 li {
  width: 23.5%;
}
#worry ul.col04 li:nth-child(3n + 2) {
  margin: 0;
}
#worry ul.col04 li:nth-child(4n + 2) {
  margin: 0 2%;
}
#worry ul.col04 li:nth-child(4n + 3) {
  margin: 0 2% 0 0;
}
#worry ul.col04 li p {
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  #worry {
    background-size: contain;
  }
  #worry .inner {
    padding-top: 90px;
  }
  #worry ul li {
    width: 100%;
  }
  #worry ul li:nth-child(3n + 2) {
    margin: 5% 0;
  }
  #worry ul li p {
    font-size: 16px;
  }
  #worry ul.col04 li {
    width: 100%;
  }
  #worry ul.col04 li:nth-child(4n + 2) {
    margin: 5% 0;
  }
  #worry ul.col04 li:nth-child(4n + 3) {
    margin: 0 0 5% 0;
  }
}

/* ------------------------------そのお悩みリフォームで解決できます------------------------------　*/
#after {
  background: #f0efe9 url(img/common/after.png) no-repeat 50% 60px;
}
#after ul.box {
  display: block;
  width: 83%;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /*-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;/*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#after ul.box > li {
  background: #fff;
  width: 405px;
  border: 2px solid #000;
  margin-top: 2%;
  padding: 20px;
}
#after ul.box > li:nth-child(2n + 2) {
  margin: 2% 0 0 2%;
}
#after ul.box > li:nth-child(1) {
  margin: 0 0 0 0;
}
#after ul.box > li:nth-child(2) {
  margin: 0 0 0 2%;
}
#after ul.box > li h3 {
  margin-top: 10px;
}
#after ul.box > li p {
  text-align: center;
  font-size: 12px;
  font-weight: bold;
}
#after ul.box_center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
}
#after ul.number {
  margin-bottom: 20px;
  width: 100%;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex; /*インライン要素*/
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; /*上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#after ul.number > li:nth-child(odd) {
  width: 90px;
  height: 90px;
  background: #db3532;
  color: #fff;
  border-radius: 45px;
  text-align: center;
  font-weight: bold;
  padding-top: 16px;
}
#after ul.number > li:nth-child(odd) span {
  font-family: "senobi_bold";
  font-size: 30px;
  line-height: 1;
}
#after ul.number > li:nth-child(even) {
  width: 250px;
  margin-left: 15px;
}
#after ul.number > li:nth-child(even) h3 {
  text-align: left;
  margin-top: 0;
}
#after ul.number > li:nth-child(even) p {
  text-align: left;
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  #after {
    background-size: contain;
  }
  #after h2 {
    margin-bottom: 0;
  }
  #after ul.box {
    width: 100%;
  }
  #after ul.box > li {
    width: 100%;
    padding: 20px;
  }
  #after ul.box > li:nth-child(2n + 2) {
    margin: 5% 0;
  }
  #after ul.number > li:nth-child(odd) {
    width: 100%;
    height: auto;
    padding: 5px 0;
  }
  #after ul.number > li:nth-child(odd) br {
    display: none;
  }
  #after ul.number > li:nth-child(odd) span {
    font-size: 16px;
  }
  #after ul.number > li:nth-child(even) {
    width: 100%;
    margin: 10px 0 0 0;
  }
  #after ul.number > li:nth-child(even) h3 {
    text-align: center;
  }
  #after ul.number > li:nth-child(even) p {
    text-align: center;
  }
}

/* ------------------------------かんたん施工で住みやすさがぐんとアップ！------------------------------　*/
#easy_up {
  background: #f7f7f7;
}
#easy_up p {
  text-align: center;
}
#easy_up p.h2_icon img {
  display: block;
  margin: 0 auto 20px auto;
}
#easy_up ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#easy_up ul li {
  background: #fff;
  width: 40.5%;
  border: 2px solid #000;
  margin-top: 2%;
  padding: 20px;
}
#easy_up ul li:nth-child(2n + 1) {
  margin: 2% 2% 0 0;
}
#easy_up ul li:nth-child(1) {
  margin: 0 2% 0 0;
}
#easy_up ul li:nth-child(2) {
  margin: 0;
}
#easy_up ul li h3 {
  margin-top: 10px;
}
#easy_up ul li h3 + img {
  margin-top: 20px;
}
#easy_up ul li p {
  text-align: center;
  font-size: 12px;
  font-weight: bold;
}
#easy_up ul li p + img {
  margin-top: 10px;
}
#easy_up ul li p.small {
  font-weight: normal;
}
@media screen and (max-width: 768px) {
  #easy_up ul li {
    width: 100%;
    padding: 20px;
  }
  #easy_up ul li:nth-child(2n + 1) {
    margin: 5% 0;
  }
}

/* ------------------------------表示価格しかいただきま宣言！------------------------------　*/
#komikomi {
  padding-bottom: 40px;
  position: relative;
  z-index: 0;
}
#komikomi img {
  margin: 0 auto;
}
#komikomi p + img {
  margin: 20px auto 0 auto;
}
#komikomi h2 span {
  position: relative;
}
#komikomi h2 span:before {
  position: absolute;
  top: -20px;
  left: -50px;
  content: url(img/common/komikomi_h2_before.png);
}
#komikomi h2 span:after {
  position: absolute;
  top: -20px;
  right: -40px;
  content: url(img/common/komikomi_h2_after.png);
}
#komikomi h2 + p {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}
#komikomi p .small {
  font-size: 14px;
}
#komikomi p + ul {
  margin-top: 30px;
}
#komikomi ul + h3 {
  margin-top: 30px;
  font-size: 30px;
}
#komikomi ul {
  margin-top: 2%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#komikomi ul li {
  background: #fff;
  width: 40.5%;
  border: 2px solid #000;
  padding: 20px;
  position: relative;
}
#komikomi ul li:first-child {
  margin-top: 0%;
}
#komikomi ul li:nth-child(2n + 1) {
  margin: 0 2% 0 0;
}
#komikomi ul li h3 {
  font-size: 14px;
  margin-top: 20px;
}
#komikomi ul li p {
  text-align: center;
  font-weight: bold;
}
#komikomi ul li p .marker {
  font-size: 20px;
}
#komikomi ul.col01 li {
  width: 53%;
  margin-top: 2%;
}
#komikomi ul.col01 li:first-child {
  margin-top: 0;
}
#komikomi ul.col01 li:nth-child(2n + 1) {
  margin: 0;
}
#komikomi ul.col01_83 li {
  width: 83%;
}
#komikomi ul.col01_83 li:nth-child(2n + 1) {
  margin: 0;
}
#komikomi ul.col02 li {
  background: #fff;
  width: 40.5%;
  border: 2px solid #000;
  margin-top: 2%;
  padding: 20px;
}
#komikomi ul.col02 li:nth-child(2n + 1) {
  margin: 2% 2% 0 0;
}
#komikomi ul.col02 li:nth-child(1) {
  margin: 0 2% 0 0;
}
#komikomi ul.col02 li:nth-child(2) {
  margin: 0;
}
#komikomi ul.col03 li {
  width: 32%;
}
#komikomi ul.col03 li:nth-child(2n + 1) {
  margin: 0;
}
#komikomi ul.col03 li:nth-child(3n + 2) {
  margin: 0 2%;
}
#komikomi ul.window_col03 {
  width: 100%;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex; /*インライン要素*/
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#komikomi ul.window_col03 li {
  width: 33.33%;
  border: none;
  margin: 0;
  padding: 0;
}
#komikomi ul.window_col03 li img {
  margin: 0 auto;
}
#komikomi ul.window_col03 li p span {
  font-size: 12px;
}

@media screen and (max-width: 768px) {
  #komikomi h2 span:before {
    top: 0px;
    left: -70px;
  }
  #komikomi h2 span:after {
    top: 0px;
    right: -40px;
  }
  #komikomi p {
    font-size: 14px !important;
  }
  #komikomi ul li {
    width: 100%;
  }
  #komikomi ul li:nth-child(2n + 1) {
    margin: 0 0 4% 0;
  }
  #komikomi ul + h3 {
    font-size: 20px;
  }
  #komikomi ul.col01 li {
    width: 100%;
  }
  #komikomi ul.col01_83 {
    margin-top: 4%;
  }
  #komikomi ul.col01_83 li {
    width: 100%;
  }
  #komikomi ul.col02 li {
    width: 100%;
    padding: 20px;
  }
  #komikomi ul.col02 li:nth-child(2n + 1) {
    margin: 5% 0;
  }
  #komikomi ul.col03 li {
    width: 100%;
  }
  #komikomi ul.col03 li:nth-child(3n + 2) {
    margin: 5% 0;
  }
}

/* ------------------------------安心のオールインワン価格です------------------------------　*/
#all_in_one {
  background: #f7f7f7;
}
#all_in_one p.all_in_one_icon img {
  margin: -100px auto 20px auto;
}
#all_in_one p.point {
  text-align: center;
  font-size: 20px;
}
#all_in_one p.point + p {
  margin-top: 30px;
}
#all_in_one p {
  text-align: center;
}
#all_in_one ul {
  margin: 30px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; /*中央に配置*/
  /*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
  /*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; /*折り返す*/
}
#all_in_one ul li {
  background: #dd3532;
  width: 15%;
  padding: 20px;
  margin: 1%;
}
#all_in_one ul li:nth-child(6n + 1) {
  margin: 1% 1% 1% 0%;
}
#all_in_one ul li:nth-child(6n + 6) {
  margin: 1% 0% 1% 1%;
}
#all_in_one ul li img {
  margin: 0 auto;
}
#all_in_one ul li p {
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  line-height: 1.5;
  margin-top: 10px;
}
#all_in_one p.small {
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  #all_in_one p.all_in_one_icon img {
    margin: 0px auto 20px auto;
  }
  #all_in_one p.point {
    font-size: 16px;
  }
  #all_in_one ul li {
    width: 48%;
    padding: 20px 10px;
    margin: 2% 0;
  }
  #all_in_one ul li:nth-child(6n + 1) {
    margin: 2% 0;
  }
  #all_in_one ul li:nth-child(6n + 6) {
    margin: 2% 0;
  }
  #all_in_one ul li:nth-child(odd) {
    margin: 2% 4% 2% 0% !important;
  }
}

/* ------------------------------お問い合わせ------------------------------　*/
#cta {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/common/header_bg.jpg) no-repeat 50% 50%;
  background-size: auto, cover;
}
#cta h2 {
  color: #fff;
}
#cta p {
  color: #fff;
  text-align: center;
}
.u-free {
  display: inline;
  width: 14%;
  vertical-align: text-top;
  margin-right: 16px;
}
@media screen and (max-width: 768px) {
  .u-free {
    width: 11%;
    vertical-align: baseline;
    margin-right: 6px;
  }
}

/* ------------------------------電話------------------------------　*/
.width70 {
  width: 70%;
  margin: 0 auto;
}
.width70 .tel_box {
  width: 375px;
  border: 2px solid #ccc;
  padding: 20px 0;
  margin: 20px 0 0 0;
  float: right;
}
.width70 .tel_box p {
  margin: 0;
}
.width70 .tel_box p.tel_title {
  font-size: 16px;
  font-weight: bold;
}
.width70 .tel_box p.tel_number {
  font-size: 30px;
  font-weight: bold;
}
#cta .tel_box p.tel_number a {
  color: white !important;
}
/* .width70 .tel_box p.tel_number:before { content:"☎︎"; padding-right:5px; } */
@media screen and (max-width: 768px) {
  .width70 {
    width: 100%;
  }
  .width70 .tel_box {
    width: 100%;
    margin: 10px 0 0 0;
    float: none;
  }
  /* ..width70 tel_box p.tel_number { font-size:22px!important; } */
}
/* ------------------------------電話------------------------------　*/
.width49 {
  width: 49%;
  margin: 0 auto;
}
.width49 .tel_box {
  width: 328px;
  border: 2px solid #fff;
  padding: 20px 0;
  margin: 20px 0 0 0;
  float: right;
}
.width49 .tel_box p {
  margin: 0;
}
.width49 .tel_box p.tel_title {
  font-size: 16px;
  font-weight: bold;
}
.width49 .tel_box p.tel_number {
  font-size: 30px;
  font-weight: bold;
}
/* .width49 .tel_box p.tel_number:before { content:"☎︎"; padding-right:5px; } */
@media screen and (max-width: 768px) {
  .width49 {
    width: 100%;
  }
  .width49 .tel_box {
    width: 100%;
    margin: 10px 0 0 0;
    float: none;
  }
  /* .width49 .tel_box p.tel_number { font-size:22px!important; } */
}

/* ------------------------------個人情報について------------------------------　*/
.width_pp_70 {
  width: 70%;
  margin: 0 auto;
}
.pp_box {
  width: 375px;
  padding: 20px 0;
  margin: 30px 0 0 0;
  float: right;
}
.pp_box p {
  margin: 0;
}

.js-form-pp {
  margin: -10px 0 !important;
  text-decoration-line: underline;
}

.js-form-pp a:link,
a:visited {
  color: blue;
  text-decoration: none;
  transition: 0.3s ease;
}

@media screen and (max-width: 768px) {
  .width_pp_70 {
    width: 100%;
  }
  .pp_box {
    width: 100%;
    margin: 30px 0 0 0;
    float: none;
  }
}

/* ------------------------------自分だけのエクステリア------------------------------　*/
#bnr {
  padding: 120px 0 60px;
  background-color: #f7f7f7;
}
#bnr .p-bnr__wrap {
  display: flex;
  justify-content: space-around;
}
#bnr .p-bnr__wrap li {
  max-width: 450px;
}

.p-header {
  margin-bottom: 80px;
  color: #dd3532;
  font-size: 38px;
}
.p-header::after {
  content: "";
  display: block;
  margin: auto;
  width: 297px;
  height: 7px;
  background-color: #707070;
}
.p-header__secondary {
  color: #000;
  font-size: 32px;
}
.p-header__secondary::after {
  content: "";
  display: block;
  margin: auto;
  width: 436px;
  height: 3px;
  background-color: #707070;
}

.p-title__border {
  display: inline-block;
  padding-left: 27px;
  border-left: 11px solid #e0e0e0;
  font-size: 31px;
  font-weight: bold;
  vertical-align: middle;
}
.p-title__border span {
  position: relative;
  font-size: 38px;
  z-index: 1;
}
.p-title__border span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 10px;
  width: 100%;
  height: 12px;
  background-color: #ffe4e3;
  z-index: -1;
}
.p-bubble__image {
  display: inline-block;
  width: 33%;
  margin-left: 1%;
  vertical-align: middle;
}

.p-hanare__logo__wrap {
  text-align: center;
}
.p-hanare__logo {
  margin: 120px auto 43px;
}
.p-hanare__logo__wrap .p-red__bg {
  display: inline-block;
  margin: 0 auto 25px;
  padding: 0 20px;
  background-color: #dd3532;
  color: #fff;
  font-size: 34px;
}
.p-hanare__logo__wrap .p-read {
  margin-bottom: 60px;
  color: #919191;
  font-size: 23px;
  font-weight: bold;
}

.p-hanare__image__wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 88px;
}
.p-hanare__image:nth-child(1) {
  max-width: 557px;
  margin: 8px 0;
}
.p-hanare__image:nth-child(2) {
  max-width: 429px;
  margin: 8px 0;
}
.p-hanare__image:nth-child(3) {
  max-width: 482px;
  margin: 8px 0;
}
.p-hanare__image:nth-child(4) {
  max-width: 502px;
  margin: 8px 0;
}

.p-hanare__read {
  color: #585858;
  font-size: 22px;
}
.p-proposal {
  background-color: #f7f7f7;
}
.p-proposal__body {
  display: flex;
  justify-content: space-between;
}
.p-proposal__list {
  display: flex;
  flex-direction: column;
  width: 32%;
  padding-bottom: 16px;
  border: 2px solid #000;
}
.p-proposal__list .-title {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 130px;
  padding: 20px;
  background-color: #000;
  color: #fff;
  font-size: 24px;
}
.p-proposal__list .-text {
  padding: 20px;
  color: #4e4e4e;
  font-size: 17px;
}
.p-proposal__list .-img {
  margin-top: auto;
}
.p-proposal__com {
  text-align: right;
}

.p-hanare__type .-title {
  text-align: left;
  border-bottom: 1px solid #707070;
  font-size: 38px;
}
.p-hanare__type .-title .-small {
  font-size: 21px;
}
.p-hanare__type .-price {
  position: relative;
  display: inline-block;
  margin-bottom: 50px;
  font-size: 29px;
  font-weight: bold;
  z-index: 1;
}
.p-hanare__type .-price .-tax {
  font-size: 18px;
}
.p-hanare__type .-price::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 28px;
  background-color: #f0d930;
  z-index: -1;
}
.p-hanare__type .p-box {
  width: 100%;
  max-width: 745px;
  margin: auto;
  padding: 34px 30px;
  border: 1px solid #707070;
  color: #4e4e4e;
}
.p-hanare__type .p-box__title {
  font-size: 13px;
}
.p-hanare__type .p-box__list li {
  font-size: 13px;
}
.p-hanare__type .p-box__com {
  margin-top: 0;
  color: #4e4e4e;
  font-size: 13px;
}
.p-hanare__type .p-box__com + .p-box__title {
  margin-top: 25px;
}

@media screen and (max-width: 768px) {
  #bnr .p-bnr__wrap {
    flex-wrap: wrap;
  }
  #bnr .p-bnr__wrap li {
    width: 100%;
    max-width: none;
  }
  #bnr .p-bnr__wrap li + li {
    margin-top: 1rem;
  }

  .p-header {
    margin-bottom: 60px;
    color: #dd3532;
    font-size: 26px;
  }
  .p-header::after {
    width: 200px;
    height: 4px;
  }
  .p-header__secondary {
    font-size: 18px;
  }
  .p-header__secondary::after {
    width: 180px;
    height: 2px;
  }

  .p-title__border {
    padding-left: 16px;
    border-left: 6px solid #e0e0e0;
    font-size: 20px;
  }
  .p-title__border span {
    font-size: 24px;
  }
  .p-title__border span::after {
    bottom: 6px;
    height: 10px;
  }
  .p-bubble__image {
    width: auto;
    max-width: 391px;
    margin-left: 0;
  }

  .p-hanare__logo {
    margin: 80px auto 43px;
  }
  .p-hanare__logo__wrap .p-red__bg {
    margin-bottom: 16px;
    padding: 0 10px;
    font-size: 20px;
  }
  .p-hanare__logo__wrap .p-read {
    margin-bottom: 40px;
    font-size: 16px;
  }

  .p-hanare__image__wrap {
    justify-content: center;
    margin-bottom: 88px;
  }
  .p-hanare__image:nth-child(1) {
    order: 1;
    width: 100%;
  }
  .p-hanare__image:nth-child(2) {
    order: 0;
    width: 100%;
  }
  .p-hanare__image:nth-child(3) {
    order: 2;
    width: 100%;
  }
  .p-hanare__image:nth-child(4) {
    order: 3;
    width: 100%;
  }

  .p-hanare__read {
    font-size: 16px;
  }
  .p-proposal__body {
    flex-wrap: wrap;
  }
  .p-proposal__list {
    width: 100%;
  }
  .p-proposal__list + .p-proposal__list {
    margin-top: 1rem;
  }
  .p-proposal__list .-title {
    width: 100%;
    height: 80px;
    padding: 20px;
    font-size: 20px;
  }
  .p-proposal__list .-text {
    padding: 20px;
    font-size: 14px;
  }

  .p-hanare__type .-title {
    font-size: 24px;
  }
  .p-hanare__type .-title .-small {
    display: block;
    font-size: 18px;
  }
  .p-hanare__type .-price {
    position: relative;
    display: inline-block;
    margin-bottom: 50px;
    font-size: 29px;
    font-weight: bold;
    z-index: 1;
  }
  .p-hanare__type .-price .-tax {
    font-size: 18px;
  }
  .p-hanare__type .-price::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 28px;
    background-color: #f0d930;
    z-index: -1;
  }
  .p-hanare__type .p-box {
    width: 100%;
    max-width: 745px;
    margin: auto;
    padding: 34px 30px;
    border: 1px solid #707070;
    color: #4e4e4e;
  }
  .p-hanare__type .p-box__title {
    font-size: 13px;
  }
  .p-hanare__type .p-box__list li {
    font-size: 13px;
  }
  .p-hanare__type .p-box__com {
    margin-top: 0;
    color: #4e4e4e;
    font-size: 13px;
  }
  .p-hanare__type .p-box__com + .p-box__title {
    margin-top: 25px;
  }
}
/* ------------------------------ hanare 禅 ------------------------------　*/
.zen {
  background: url(img/common/black_filter03.png) repeat 0 0, url(img/zen/header_bg.jpg) no-repeat 50% 50% !important;
  background-size: auto, cover !important;
}

.p-zenDetails h2 {
  text-indent: 5px;
}

.p-zenDetails h2 span {
  position: relative;
}

.p-zenDetails h2 > span::after {
  position: absolute;
  bottom: -10px;
  right: calc(50% - 230px);
  content: url(img/common/komikomi_h2_after.png);
}

.p-zenDetails h2 > span::before {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 350px);
  content: url(img/common/komikomi_h2_before.png);
}

.p-zenDetails h2 .-small {
  font-size: 20px;
}

.p-zenDetails__read {
  text-align: center;
}

.p-zenDetails__box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 64px;
}

.p-zenDetails__card {
  width: 32%;
  padding: 24px;
  border: 1px solid #000;
}

.p-zenDetails__card h3 {
  margin: 16px 0;
  font-size: 14px;
}

.p-zenDetails__card p {
  font-size: 14px;
}

.p-zenDetails__att {
  text-align: center;
  font-size: 14px;
}

.p-zenLimit {
  margin-top: 40px;
  background-color: #f7f7f7;
}

.p-zenLimit__flag {
  margin: -100px auto 20px;
}

.p-zenLimit__title {
  font-size: 24px;
}

.p-zenLimit__title .-small {
  font-size: 16px;
}

.p-zenLimit__title .-large {
  font-size: 30px;
}

.p-zenLimit__body {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

.p-zenLimit__body img {
  align-self: flex-start;
  width: 50%;
  margin: 0;
}

.p-zenLimit__body dl {
  margin-left: 40px;
}

.p-zenLimit__body dl dt {
  display: inline-block;
  margin-bottom: 16px;
  padding: 16px 24px;
  background-color: #dd3532;
  color: #fff;
  font-weight: bold;
  line-height: 1;
}

.p-zenLimit__body dl dd {
  font-size: 16px;
}

.p-zenLimit__body dl dd + dt {
  margin-top: 24px;
}

.p-zenLimit__image {
  display: flex;
  justify-content: space-between;
}

.p-zenLimit__image li + li {
  margin-left: 2%;
}

.p-zen__borderTitle {
  position: relative;
  margin-bottom: 56px;
  text-indent: 5px;
}

.p-zen__borderTitle::before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  width: 60px;
  height: 4px;
  margin: auto;
  background-color: #bfbfbf;
}

.p-zenSpecification {
  margin-top: 60px;
}

.p-zenSpecification__body {
  display: flex;
}

.p-zenSpecification__card {
  padding: 24px;
  border: 1px solid #000;
  text-align: left;
}

.p-zenSpecification__card:nth-child(1) {
  width: 340px;
}

.p-zenSpecification__card:nth-child(2) {
  width: 630px;
  margin-left: 32px;
}

.p-zenSpecification__card h3 {
  text-align: left;
  font-size: 16px;
}

.p-zenSpecification__card p .-small {
  font-size: 14px;
}

.p-zen__type dt {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid #000;
  font-size: 38px;
  font-weight: bold;
  line-height: 1;
}

.p-zen__type dd {
  position: relative;
  display: inline-block;
  font-size: 29px;
  font-weight: bold;
}

.p-zen__type dd::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 28px;
  background-color: #eeda2d;
  z-index: -1;
}

.p-zen__type dd .-small {
  font-size: 18px;
}

.p-zenPeriod {
  margin-bottom: 40px;
}

@media screen and (max-width: 768px) {
  .p-zenDetails h2 > span::after {
    right: calc(50% - 160px);
  }

  .p-zenDetails h2 > span::before {
    position: absolute;
    bottom: -10px;
    left: calc(50% - 135px);
  }

  .p-zenDetails h2 .-small {
    font-size: 14px;
  }

  .p-zenDetails__read {
    font-size: 14px;
  }

  .p-zenDetails__box {
    margin-top: 40px;
  }

  .p-zenDetails__card {
    width: 100%;
  }

  .p-zenDetails__card + .p-zenDetails__card {
    margin-top: 24px;
  }

  .p-zenDetails__att {
    font-size: 12px;
  }

  .p-zenLimit {
    margin-top: 40px;
    background-color: #f7f7f7;
  }

  .p-zenLimit__flag {
    margin: 0 auto 20px;
  }

  .p-zenLimit__title {
    font-size: 16px;
  }

  .p-zenLimit__title .-small {
    font-size: 14px;
  }

  .p-zenLimit__title .-large {
    font-size: 20px;
  }

  .p-zenLimit__body {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 40px;
  }

  .p-zenLimit__body img {
    width: 100%;
  }

  .p-zenLimit__body dl {
    margin-left: 0;
    margin-top: 30px;
  }

  .p-zenLimit__body dl dt {
    margin-bottom: 16px;
    padding: 12px 16px;
    font-size: 14px;
  }

  .p-zenLimit__body dl dd {
    font-size: 14px;
  }

  .p-zenLimit__body dl dd + dt {
    margin-top: 24px;
  }

  .p-zen__borderTitle {
    position: relative;
    margin-bottom: 40px;
    text-indent: 2px;
  }

  .p-zen__borderTitle::before {
    width: 40px;
  }

  .p-zenSpecification {
    margin-top: 30px;
  }

  .p-zenSpecification__body {
    flex-wrap: wrap;
  }

  .p-zenSpecification__card {
    padding: 24px;
  }

  .p-zenSpecification__card:nth-child(1) {
    width: 100%;
  }

  .p-zenSpecification__card:nth-child(2) {
    width: 100%;
    margin-left: 0;
    margin-top: 24px;
  }

  .p-zenSpecification__card h3 {
    font-size: 14px;
  }

  .p-zenSpecification__card p {
    font-size: 14px;
  }

  .p-zenSpecification__card p .-small {
    font-size: 12px;
  }

  .p-zen__type dt {
    margin-bottom: 16px;
    padding-bottom: 16px;
    font-size: 24px;
  }

  .p-zen__type dd {
    font-size: 26px;
  }

  .p-zen__type dd::after {
    height: 20px;
  }

  .p-zen__type dd .-small {
    font-size: 16px;
  }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * その他（jQuery、文字装飾なと）
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/* ------------------------------カルーセルスライダーカスタマイズ ------------------------------　*/
.slick-next {
  right: 50px !important;
}
.slick-prev {
  left: 30px !important;
}
.slick-prev:before,
.slick-next:before {
  opacity: 1 !important;
}
.slick-prev:before {
  content: url(img/index/arrow_right.png) !important;
}
.slick-next:before {
  content: url(img/index/arrow_left.png) !important;
}

@media screen and (max-width: 768px) {
  .slick-next {
    right: 20px !important;
  }
  .slick-prev {
    left: 10px !important;
  }
  .slick-prev:before,
  .slick-next:before {
    font-size: 30px !important;
  }
}

/* ------------------------------お問い合わせボタン------------------------------　*/
#page_top {
  width: 100px;
  height: 130px;
  position: fixed;
  right: 0px;
  top: 60px;
  z-index: 9999;
}
@media screen and (max-width: 768px) {
  #page_top {
    display: none !important;
  }
}

/* ------------------------------グローバルナビ上部固定------------------------------　*/
.fixed {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10000;
}
@media screen and (max-width: 768px) {
  .fixed {
    position: static;
  }
}