@charset "UTF-8";
/*レスポンシブ02 ホワイト*/
/*---------- general ----------*/
/*@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');*/
body {
  color: var(--color_text);
  font-weight: normal;
  font-family: YuMincho, "Yu Mincho", serif;
  font-size: 16px;
}

#mainContents {
  padding-bottom: 0;
}

.sans-serif {
  font-family: "Noto Sans JP", sans-serif;
}

/*--- colors template ---*/
:root {
  --color_primary: #559cc1;
  --color_sub: #efefef;
  --color_bg: #fff;
  --color_text: #666;
  --color_main_text: #666;
  --color_accent: #666;
}

/*--- TEL link ---*/
a.tel {
  text-decoration: none;
  font-weight: bold;
  font-size: 200%;
  color: var(--color_text);
}

/*--- link button ---*/
a.btn {
  background: var(--color_primary);
  border: 1px solid var(--color_primary);
  width: fit-content;
  min-width: 300px;
  max-width: 480px;
  color: var(--color_bg);
  text-align: center;
  padding: 1.25em 2.5em;
  margin: 1em auto;
  border-bottom: none;
  border-radius: 0;
  position: relative;
}
a.btn:hover {
  background: var(--color_bg);
  border: 1px solid var(--color_primary);
  color: var(--color_primary);
}
a.btn:after {
  content: "\f054";
  position: absolute;
  right: 1em;
  margin: 0;
}

/*--- main visual ---*/
.mainImage img, .mainImage #slider li img {
  width: 100%;
}

/*--- 配置画像 ---*/
.article .article_center .image {
  margin-bottom: 2%;
}
.article .article_right .image {
  margin-left: 2%;
  margin-bottom: 2%;
}
.article .article_left .image {
  margin-right: 2%;
  margin-bottom: 2%;
}
.article.max .article_left .image , 
.article.max .article_right .image {
  max-width: 50%;
}

/*---------- head ----------*/
/*ヘッダロゴ テキストの場合*/
/*#title {
background: var(--color_primary);
}
#title h1 a, #title a:hover {
color: var(--color_main_text);
}
#title #title_outer {
height: 64px;
}*/

/*ヘッダロゴ　画像の場合*/
#title {
  background: var(--color_bg);
  padding: 10px 0;
  h1 {
    background: url(/materials/179314839753401.png) left center no-repeat;
    background-size: contain;
    height: 64px;
    width: 400px;
    a {
      overflow: hidden;
      text-indent: 110%;
      white-space: nowrap;
      display: block;
      height: inherit;
    }
  }
  #title_outer {
    height: auto;
    justify-content: left;
  }
}
#wrap_body #topMenu {
  order: 2;
  background: var(--color_bg);
}

#topMenu_outer .topMenu li a {
  height: auto;
  color: var(--color_main_text);
  border-bottom: none;
}
#topMenu_outer .topMenu li a:after {
  content: none;
}
#topMenu_outer .topMenu li a:hover {
  color: var(--color_primary);
  background: none;
  border-bottom: none;
}

/*---------- main ----------*/
/*--- topics ---*/
#mainTopics, #listTopics {
  background: none;
}
#mainTopics p.more a, #mainTopics .listview a, #listTopics p.more a, #listTopics .listview a {
  background: none;
  color: var(--color_primary);
}
#mainTopics p.more a:hover, #mainTopics .listview a:hover, #listTopics p.more a:hover, #listTopics .listview a:hover {
  background: none;
  color: var(--color_accent);
}
#mainTopics ul.topics li p.date, #listTopics ul.topics li p.date {
  background: none;
  color: var(--color_text);
  font-size: 0.85em;
  padding: 0 0 6px;
}
#mainTopics ul.topics li p.description, #listTopics ul.topics li p.description {
  font-size: 0.85em;
}
#mainTopics ul.topics li p.date, #listTopics ul.topics li p.date,
#mainTopics ul.topics li p.description, #listTopics ul.topics li p.description {
  font-size: max(14px);  
}
#mainTopics ul.topics li h3 a, #listTopics ul.topics li h3 a {
  color: var(--color_primary);
}
#mainTopics ul.topics li h3 a:hover, #listTopics ul.topics li h3 a:hover {
  background: none;
  color: var(--color_accent);
}

/*--- 見出し ---*/
/*h2*/
#mainArticles h2, #listTopics h2, #mainTopics h2 {
  color: var(--color_text);
  background: none;
  font-size: 2.5em;
  font-weight: bold;
  margin-bottom: 1em;
}
#mainArticles .article h2 {
  font-size: 2.75em;
  font-weight: bold;
  color: var(--color_bg);
  background: none;
  padding: 1em 0;
}
#mainArticles div[id^="blog"] h2 {
  color: var(--color_text);
  font-size: 2em;
}

/*h3*/
.article h3, .gallery h3, .freeHtml h3 {
  font-size: 2.5em;
  font-weight: bold;
  color: var(--color_text);
}
#mainTopics h2:after, #mainArticles .article h2:after, .article h3:after, .gallery h3:after, .freeHtml h3:after {
  content: none;
}

/*h4*/
.article h4 {
  font-size: 1.6em;
  color: var(--color_text);
  border: none;
  padding: 0;
  margin: 0 0 1em;
  font-weight: bold;
  background: none;
  line-height: 1.8;
  letter-spacing: 2px;
}

.article h4:before {
  content: none;
}

/*h5*/
.article h5 {
  border: none;
  padding-left: 0;
}

/*--- article ---*/
.article {
  /***--- background color ---***/
}
.article p, .gallery p {
  margin-bottom: 1.25em;
}
#mainContents .article.full {
  padding-bottom: 40px;
  margin-bottom: 0;
}
.article.zero_margin, .gallery.zero_margin {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.article.bg, .gallery.bg {
  background: var(--color_sub);
}
.article.max.bgColor {
  background: var(--color_sub);
  padding: 0;
}
.article.max.bgColor .article_body {
  display: flex;
  align-items: center;
}
.article.max.bgColor .article_body.article_left .image, .article.max.bgColor .article_body.article_right .image {
  max-width: 50vw;
  margin: 0;
}
.article.max.bgColor .article_body.article_right {
  flex-direction: row-reverse;
}
.article.max.bgColor .bgColorTxt {
  padding: 0 2vw;
}
.article.max.bgColor .bgColorTxt h3 {
  margin: 0;
  padding-top: 0;
  max-width: 50vw;
}
.article {
  /***--- background image ---***/
}
.article.bgImg01 {
  background: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)), url(/materials/179315468074101.png) no-repeat center;
  background-size: cover;
  padding-bottom: 64px;
}
.article.bgImg02 {
background: linear-gradient(rgba(255, 255, 255, 0.33), rgba(255, 255, 255, 0)), url(/materials/179316847440201.png) no-repeat center;
    background-size: auto, auto;
  background-size: cover;
  padding-bottom: 64px;
  text-shadow: 1px 1px 2px #484848;
}
.article.bgImg03 {
  background: linear-gradient(rgba(255, 255, 255, 0.33), rgba(255, 255, 255, 0)), url(/materials/179316847440202.png) no-repeat center;
  background-size: cover;
  padding-bottom: 64px;
  text-shadow: 1px 1px 2px #484848;
}
.article.bgImg03 h3, .article.bgImg03 p {
  color: var(--color_main_text);
}
.article.bgImg04 {
  background: linear-gradient(rgba(92, 109, 128, 0.4), rgba(92, 109, 128, 0.4)), url(/materials/xxxxxxxx.png) no-repeat center;
  background-size: cover;
  padding-bottom: 64px;
}
.article.bgImg04 h3, .article.bgImg04 p {
  color: var(--color_main_text);
}
@media only screen and (width > 600px) {
  .article { /*ここからPCサイズ用>>>>>>*/
    /***--- big image ---***/
  }
  .article.max.bigImg .article_body {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  .article.max.bigImg .article_body.article_left:after {
    content: "";
    display: inline-block;
    background-color: var(--color_sub);
    width: 80%;
    height: 80%;
    border-radius: 0px 10px 10px 0px;
    position: absolute;
    left: -2vw;
    bottom: -2vw;
    z-index: -1;
  }
  .article.max.bigImg .article_body.article_right {
    flex-direction: row-reverse;
  }
  .article.max.bigImg .article_body.article_right:after {
    content: "";
    display: inline-block;
    background-color: var(--color_sub);
    width: 80%;
    height: 80%;
    border-radius: 10px 0px 0px 10px;
    position: absolute;
    right: -2vw;
    bottom: -2vw;
    z-index: -1;
  }
  .article.max.bigImg .article_body .image {
    max-width: 60%;
  }
  .article.max.bigImg .article_body .bigTitle {
    width: 40%;
  }
  .article.max.bigImg .article_body .bigTitle h3 {
    font-size: 6vw;
    text-align: left;
    padding: 0;
    margin: 0 0 45px;
    line-height: 1;
  }
}

.article {
  /***--- dialogue ---***/
}
.article.dialogue {
  background: var(--color_sub);
  padding: 40px 40px 0;
  border-top: solid 6px var(--color_primary);
}
.article.dialogue .article_body {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.article.dialogue .image {
  width: 196px;
  height: 196px;
  border-radius: 50%;
  margin-right: 32px;
}
.article.dialogue .image img {
  -o-object-fit: cover;
  object-fit: cover;
  height: 100%;
}
.article.dialogue .dialogueSet {
  display: block;
  width: calc(100% - 228px);
  position: relative;
}
.article.dialogue .dialogueSet:before {
  position: absolute;
  display: block;
  content: "";
  left: -12px;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 25px;
  height: 25px;
  z-index: 1;
  transform: rotateZ(-45deg);
  background-color: var(--color_bg);
}
.article.dialogue .dialogueSet h5 {
  padding: 1em;
  background: var(--color_accent);
  margin: 0;
  width: -moz-fit-content;
  width: fit-content;
  z-index: 2;
  position: relative;
}
.article.dialogue .dialogueSet p {
  background: var(--color_bg);
  padding: 4em 2em 2em;
  width: 100%;
  position: relative;
  top: -32px;
  z-index: 1;
}

/*>>>>>>PCサイズここまで*/
/*--- gallery ---*/
@media only screen and (width > 600px) { /*ここからPCサイズ用>>>>>>*/
  .gallery.fitGallery .gallery_grid li.galleryGrid .image img {
    height: 376px;
    -o-object-fit: cover;
    object-fit: cover;
  }
} /*>>>>>>PCサイズここまで*/

/*--- gallery ---*/
.gallery_grid li.galleryGrid .galleryGrid_outer {
  padding: 0 10px 20px;
}
.gallery ul.galleryGrids .comment {
  font-size: 1em;
  font-weight: normal;
}
.gallery ul.galleryGrids .comment strong {
  font-size: 1.15em;
  font-weight: bold;
  text-align: center;
  display: block;
}
.gallery.commentLeft ul.galleryGrids .comment {
  text-align: left;
}

/*--- table ---*/
.article table.normalTbl, ol.pp, ul.ps, ul.notes {
  font-size: 1em;
}
.article table.normalTbl th {
  vertical-align: top;
  background: var(--color_sub);
}
.article table.normalTbl td, .article table.normalTbl th {
  border-bottom: 1px solid #ccc;
}
/*Ver2*/
.article table.normalTbl.v2 th {
  text-align: center;
}
.article table.normalTbl.v2 th, .article table.normalTbl.v2 td {
  border-top: 1px dashed #ccc;
  border-bottom: none;
}

/*Form*/
#mainArticles table.contactTable tr th, #mainBlogCommentForm table.contactTable tr th {
  background: #fff;
  color: var(--color_text);
}

/*--- list ---*/
.article ol, .article ul {
  overflow: hidden;
  margin: 0 0 1em;
}
.article ol li, .article ul li {
  line-height: 1.6;
}
ul.kome {
  list-style-type: none;
  padding-left: 1em;
}
ul.kome li::before {
  content: "＊";
  margin-left: -1em;
}
ul.dot {
  list-style-type: none;
  padding-left: 1em;
}
ul.dot li::before {
  content: "・";
  margin-left: -1em;
}
ul.circle {
  list-style-type: none;
  padding-left: 1em;
}
ul.circle li::before {
  content: "○";
  margin-left: -1em;
  font-size: 0.85em;
}
ul.square {
  list-style-type: none;
  padding-left: 1em;
}
ul.square li::before {
  content: "■";
  margin-left: -1em;
  font-size: 0.85em;
}

/*---------- side ----------*/
#sideContents {
  background: var(--color_sub);
  padding: 5px 0;
}
.sideContents {
  padding: 0;
}
.sideContents #sideServices h2, .sideContents #sideBlogCategories h2, .sideContents #sideBlogDates h2, .sideContents #sideMobile h2 {
  font-size: 1em;
}
.sideContents ul, .sideContents dl {
  font-size: 0.88em;
}
.sideContents .sideMobile p {
  font-size: 0.88em;
 }

/*---------- foot ----------*/
#footer {
  background: var(--color_sub);
}

div#footer_outer {
  width: 100%;
}

@media only screen and (width > 600px) { /*ここからPCサイズ用>>>>>>*/
  #footer_body {
    padding: 32px 0 88px;
    flex-direction: column;
    padding: 0;
  }
  #footer_body .topMenu, #footer_body .services {
    flex-direction: row;
    width: 100%;
    height: 72px;
    max-width: 1024px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
  }
  #footer_body .topMenu li a, #footer_body .services li a {
    color: var(--color_main_text);
    background: none;
    font-weight: normal;
  }
  #footer_body .topMenu li a:hover, #footer_body .services li a:hover {
    color: var(--color_primary);
    font-weight: bold;
    background: none;
  }
  #footer_body .topMenu li a:before, #footer_body .services li a:before {
    content: none;
  }
  #footer_body .copyright {
    position: unset;
    height: 32px;
    padding: 0;
    line-height: 32px;
    background: var(--color_primary);
  }
} /*>>>>>>PCサイズここまで*/
/*---------- Contact ----------*/
/*--- 電話番号 ---*/
p.contactTel {
  font-size: 2em;
  font-weight: bold;
  margin-bottom: 0;
}

/*--- お問い合わせフォーム ---*/
#mainArticles form, #mainBlogCommentForm form {
  padding: 0;
}
#mainArticles table.contactTable, #mainBlogCommentForm table.contactTable {
  border-top: solid 1px #ccc;
  border-left: solid 1px #ccc;
}
#mainArticles table.contactTable tr th, #mainArticles table.contactTable tr td, #mainBlogCommentForm table.contactTable tr th, #mainBlogCommentForm table.contactTable tr td {
  border-bottom: solid 1px #ccc;
  border-right: solid 1px #ccc;
  background: #fff;
}
#mainArticles table.contactTable input.button, #mainBlogCommentForm table.contactTable input.button {
  background: var(--color_primary);
  border-radius: 0;
}
#mainArticles table.contactTable .validator-form .validator-message-invalid, #mainArticles table.contactTable p.contact-note, #mainBlogCommentForm table.contactTable .validator-form .validator-message-invalid, #mainBlogCommentForm table.contactTable p.contact-note {
  font-size: max(14px);
}

/*--- Google reCaptcha ---*/
.recaptcha_policy {
  padding: 0;
  margin: 0;
  text-align: center;
  font-size: 11px !important;
  color: #444 !important;
}

.recaptcha_policy a {
  font-size: 11px !important;
  color: #111 !important;
}

.grecaptcha-badge {
  visibility: hidden;
}

/*<<<<<<スマホサイズ用>>>>>>*/
@media only screen and (width <= 600px) {
  body {
    font-size: 14px;
  }
  #toggle, .active #toggle {
    background-color: var(--color_primary);
  }
  #title {
    padding: 0;
  }
  #title #title_outer {
    height: 56px;
  }
  #title h1 {
    font-size: 1.25em;
    width: 250px;
    padding: 0;
    height: 56px;
    margin-left: 4px;
  }
  /*--- 見出し ---*/
  #mainArticles .article h2 {
    font-size: 2em;
    padding: 0.5em 0;
    line-height: 1.5;
    margin-top: 0;
  }
  /*h3*/
  .article h3, .gallery h3, .freeHtml h3 {
    font-size: 2em;
    line-height: 1.5;
  }
  /*--- topics ---*/
  #mainTopics h2 {
    line-height: 1.25;
    padding: 0;
  }
  #mainTopics .listview {
    margin-top: 0;
  }
  ul.topics li {
    padding: 8px;
    min-height: unset;
  }
  ul.topics li p.date {
    font-size: 0.85em;
  }
  /*---------- article ----------*/
  .article {
    /***--- background color ---***/
  }
  .article.max.bgColor .article_body {
    flex-direction: column;
    padding: 2em 4vw;
  }
  .article.max.bgColor .article_body.article_left .image, .article.max.bgColor .article_body.article_right .image {
    max-width: 100%;
    margin-bottom: 1em;
  }
  .article.max.bgColor .article_body .bgColorTxt h3 {
    max-width: unset;
  }
  .article {
    /***--- background image ---***/
  }
  .article.bgImg01, .article.bgImg02, .article.bgImg03, .article.bgImg04 {
    padding-bottom: 24px;
  }
  .article {
    /***--- big image ---***/
  }
  .article.max.bigImg {
    background: var(--color_sub);
  }
  .article.max.bigImg .bigTitle h3 {
    text-align: left;
    padding: 0;
  }
  .article {
    /***--- dialogue ---***/
  }
  .article.dialogue {
    padding: 2em 4vw 0;
  }
  .article.dialogue .article_body {
    align-items: flex-start;
  }
  .article.dialogue .image {
    width: 80px;
    height: 80px;
    margin-top: 56px;
  }
  .article.dialogue .dialogueSet {
    width: calc(100% - 112px);
  }
  .article.dialogue .dialogueSet:before {
    top: 88px;
    bottom: auto;
  }
  .article.dialogue .dialogueSet h5 {
    width: 88%;
  }
  .article.dialogue .dialogueSet p {
    padding: 4em 4vw 4vw;
    margin-bottom: 0;
  }
  /*---------- table ----------*/
  .article table.normalTbl td {
    border: none;
  }
  /*---------- gallery ----------*/
  .gallery .gallery_grid2 li.galleryGrid, .gallery .gallery_grid3 li.galleryGrid, .gallery .gallery_grid4 li.galleryGrid, .gallery .gallery_grid5 li.galleryGrid {
    width: 100%;
  }
  /*---------- foot ----------*/
  #footer_body {
    padding: 0;
  }
  #footer_body .topMenu li a, #footer_body .services li a {
    color: var(--color_text);
    background: var(--color_sub);
    font-weight: normal;
  }
  #footer_body .topMenu li a:before, #footer_body .services li a:before {
    color: var(--color_text);
  }
  #footer_body .topMenu li a:hover, #footer_body .services li a:hover {
    background: var(--color_primary);
  }
  #footer_body .copyright {
    background: var(--color_primary);
    padding: 1em 4vw;
  }
  #footer {
    font-size: 1em;
  }
}
/*---------- 独自の装飾 ----------*/
/***--- footer contact ---***/
.sideContact {
  background: var(--color_primary);
  padding: 30px 60px;
  display: flex;
  margin-bottom: 80px;
}
.sideContact .sideTxt {
  width: 50%;
}
.sideContact .sideTxt h3 {
  padding: 0;
  margin: 0 0 32px;
  text-align: left;
  line-height: 1;
  color: var(--color_main_text);
}
.sideContact .sideTxt p {
  color: var(--color_main_text);
}
.sideContact a.btn {
  margin-right: 0;
  color: var(--color_main_text);
  border-color: var(--color_main_text);
}

@media only screen and (width <= 600px) {
  .sideContact {
    flex-direction: column;
    padding: 2em 1em;
  }
  .sideContact .sideTxt {
    width: unset;
  }
  .sideContact a.btn {
    margin: auto;
  }
}/*# sourceMappingURL=basic.css.map */