@charset "utf-8";
/*
* default
*/
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  list-style: none;
  outline: 0;
  background: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font: inherit;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  text-decoration: none;
  vertical-align: baseline;
}
html {
  font-size: 62.5%;
  overflow-x: hidden;
  min-height: 100vh;
}
body {
  margin: 0;
  position: relative;
  color: #666;
  letter-spacing: 0.5px;
  background-image: url('../images/back.jpg');
  word-wrap: break-word;
  overflow-wrap: break-word;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  z-index: 0;
  overflow: visible;
  line-height: 1;
}
@media screen and (max-width: 999px) {
  body {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 1000px) {
  body {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
/*
* 変数
*/
/* AlegreyaSansSC */
@font-face {
  font-family: 'Alegreya Sans SC';
  font-style: normal;
  font-weight: 400;
  src: url('alegreya_sans_sc/AlegreyaSansSC-Regular.ttf') format('woff2');
}
@font-face {
  font-family: 'Alegreya Sans SC';
  font-style: bold;
  font-weight: 700;
  src: url('alegreya_sans_sc/AlegreyaSansSC-Bold.ttf') format('woff2');
}
@font-face {
  font-family: 'icomoon';
  src: url('fonts/icomoon.eot?syinox');
  src: url('fonts/icomoon.eot?syinox#iefix') format('embedded-opentype'), url('fonts/icomoon.ttf?syinox') format('truetype'), url('fonts/icomoon.woff?syinox') format('woff'), url('fonts/icomoon.svg?syinox#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}
/*
* 基本
*/
img {
  vertical-align: top;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  border: 0;
  -ms-interpolation-mode: bicubic;
}
img::after {
  clear: both;
  height: 0;
  line-height: 0;
  display: block;
  content: "";
}
a {
  text-decoration: none;
  color: #208DC3;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
  margin-bottom: 20px;
}
table tr th,
table tr td {
  padding: 6px;
  border: 1px solid #C6C0A6;
}
table tr th {
  background-color: #e2dfd2;
  color: #fff;
}
.sideTitle {
  display: inline-block;
  width: 100%;
}
.sideTitle {
  font-family: "Alegreya Sans SC", "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 500;
}
h2,
h3,
h4,
.sideTitle {
  margin-bottom: 20px;
}
.archiveArea h1 {
  font-size: 130%;
  border-bottom: 1px solid #C6C0A6;
  padding-bottom: 10px;
  margin-bottom: 30px;
}
h2 {
  margin-top: 40px;
}
h2,
.sideTitle {
  font-size: 130%;
  border-bottom: 1px solid #C6C0A6;
  padding-bottom: 10px;
}
h3 {
  font-size: 120%;
  padding-left: 2em;
  position: relative;
}
h3::before {
  color: #C6C0A6;
  position: absolute;
  font-family: 'icomoon' !important;
  font-size: 120%;
  left: 0;
  top: -2px;
  content: "\e96b";
}
h4 {
  padding-left: 1.5em;
  position: relative;
}
h4::before {
  color: #C6C0A6;
  position: absolute;
  font-family: 'icomoon' !important;
  left: 0;
  content: "\ea10";
}
p {
  line-height: 1.5em;
  margin-bottom: 20px;
}
strong {
  font-weight: 600;
  background: linear-gradient(transparent 50%, #FFF280 0%);
}
/*
* 共通
*/
.no-bottom {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.no-top {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
.tags {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 30px;
}
.tags li {
  background-color: #C6C0A6;
  padding: 6px;
  margin: 0 6px 6px 0;
  transition: background-color 1s;
  border-radius: 1px;
}
.tags li:hover {
  background-color: #C9E8F1;
}
.tags li a {
  color: #fff;
}
ul.page-numbers {
  width: 50%;
  margin: 20px auto;
  display: flex;
  justify-content: center;
}
ul.page-numbers li a {
  background-color: #C6C0A6;
  border-radius: 1px;
  margin: 0 5px;
  padding: 10px 15px;
  color: #fff;
}
ul.page-numbers li .current {
  color: #C6C0A6;
  background-color: #fff;
  border: 1px solid #C6C0A6;
  border-radius: 1px;
  margin: 0 5px;
  padding: 10px 15px;
}
#wrap {
  display: flex;
  display: -webkit-flex;
  min-height: 100vh;
  flex-direction: column;
}
header {
  width: 100%;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* background: @accent-color;
	border-bottom: 1px solid @border-color;
	*/
  background-position: center center;
  background-size: cover;
}
header .siteLogo {
  max-width: 100%;
  text-align: center;
  font-family: "Alegreya Sans SC", "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  margin: 0 auto;
  width: 1200px;
}
header .siteLogo a {
  font-size: 150%;
  color: #fff;
  /*
			&:before {
				position:relative;
				font-family: 'icomoon' !important;
				font-size: 70%;
				margin-right: 10px;
				content: @cross;
			}
			*/
}
header .siteLogo a .description {
  font-size: 80%;
  margin-right: 20px;
  opacity: 0.7;
}
header .siteLogo img {
  width: 70%;
}
.sidebar,
footer {
  padding: 20px;
}
.singleArea,
.archiveArea {
  padding: 15px;
}
.subArea .archiveArea {
  padding: 25px;
}
.subArea .relationArea {
  padding: 0;
}
.subArea .relationArea .postList > li .time {
  font-size: 78%;
}
@media screen and (min-width: 768px) {
  /* デスクトップ用CSS */
  .subArea .archiveArea {
    padding: 0;
  }
  .subArea .archiveArea .postList {
    flex-direction: row;
    justify-content: space-between;
  }
  .subArea .archiveArea .postList > li {
    width: 24.5%;
  }
  .subArea .archiveArea .postList > li .thumbnail span {
    width: 212px;
    height: 150px;
  }
  .subArea .archiveArea .postList > li .title {
    margin-bottom: 1em;
  }
}
.sidebar {
  margin-top: 30px;
  width: 100%;
}
.searchForm {
  margin-bottom: 30px;
}
.searchForm .text {
  background-color: #fff;
  padding: 6px;
  border: 1px solid #C6C0A6;
  width: 238px;
}
.searchForm .submit {
  color: #fff;
  border: none;
  padding: 12px 10px;
  background-color: #C6C0A6;
  cursor: pointer;
}
.main {
  width: 100%;
}
.singleArea {
  background-color: #fff;
}
footer {
  margin-top: auto;
  text-align: center;
  background-color: #C6C0A6;
  color: #fff;
}
footer a {
  color: #fff;
}
.global {
  top: 100px;
  z-index: 10;
  width: 100%;
  display: flex;
  flex-flow: row;
  flex-direction: column;
  justify-content: space-around;
  background-color: #C6C0A6;
}
.global ul {
  display: flex;
  display: -webkit-flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  margin: 0 auto;
  width: 1200px;
  max-width: 100%;
  list-style-type: none;
}
.global ul li {
  width: 25%;
  text-align: center;
  transition: background-color 1s;
  border-right: 1px solid rgba(255, 255, 255, 0.5);
  font-size: 90%;
}
.global ul li a {
  display: block;
  border-radius: 4px;
  padding: 10px 4px;
  color: white;
}
.global ul li:nth-child(-n+4) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
.global ul li:nth-child(1),
.global ul li:nth-child(5) {
  border-left: 1px solid rgba(255, 255, 255, 0.5);
}
.global ul li:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.5);
}
.global ul li:hover {
  background-color: #e2dfd2;
}
@media screen and (min-width: 768px) {
  /* デスクトップ用CSS */
  .global ul li {
    width: 20%;
  }
}
.fixed {
  position: fixed;
  top: 0;
  padding: 0;
  width: 100%;
  z-index: 1000;
}
.container {
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  width: 100%;
  padding: 20px 14px 100px 14px;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  /* デスクトップ用CSS */
  header {
    height: 100px;
    flex-direction: row;
  }
  header .siteLogo img {
    height: 100px;
    width: auto;
  }
  .global ul {
    border-bottom: none;
  }
  .global ul li {
    font-size: 100%;
  }
  .global ul li:nth-child(5) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    border-left: none;
  }
  .global ul li:nth-child(1),
  .global ul li:nth-child(6) {
    border-left: 1px solid rgba(255, 255, 255, 0.5);
  }
  .container {
    flex-direction: row;
    padding: 20px 0 100px 0;
    margin: 0 auto;
    width: 1200px;
  }
  .sidebar {
    margin-top: 0;
    width: 336px;
  }
  .main {
    flex: 1;
  }
}
/*
* 記事一覧
*/
.archiveArea .postList {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
.archiveArea .postList > li {
  width: 100%;
  background-color: #fff;
  margin-bottom: 15px;
}
.archiveArea .postList > li .category {
  padding: 4px 6px;
  background-color: #C6C0A6;
  z-index: 1;
  display: inline-block;
  position: relative;
  color: #fff;
}
.archiveArea .postList > li .thumbnail {
  position: relative;
  top: -22px;
}
.archiveArea .postList > li .thumbnail span {
  display: inline-block;
  background-color: #f8f8f8;
  background-position: center center;
  background-repeat: no-repeat;
  margin: 5px;
  max-width: 100%;
  width: 414px;
  height: 200px;
  background-size: cover;
}
.archiveArea .postList > li .thumbnail a {
  display: flex;
}
.archiveArea .postList > li .thumbnail a span {
  margin: 0;
}
.archiveArea .postList > li .title {
  padding: 0 1em 0;
  min-height: 48px;
}
.archiveArea .postList > li .title a {
  font-size: 100%;
  font-weight: 600;
  color: #555;
}
.archiveArea .postList > li .description {
  font-size: 90%;
  padding: 0em 1em 1em;
}
.archiveArea .postList > li .time {
  font-size: 100%;
  margin-bottom: 1em;
  padding: 0 1em 0;
  position: relative;
  font-size: 90%;
  text-align: right;
}
.archiveArea .postList > li .time .createdAt:before {
  font-family: 'icomoon' !important;
  margin-right: 4px;
  font-size: 75%;
  content: "\e94e";
  color: #C6C0A6;
}
.archiveArea .postList > li .time .updatedAt {
  margin-right: 8px;
}
.archiveArea .postList > li .time .updatedAt:before {
  font-family: 'icomoon' !important;
  margin-right: 4px;
  font-size: 75%;
  content: "\ea2e";
  color: #C6C0A6;
}
.archiveArea .postList .tags {
  font-size: 80%;
}
@media screen and (min-width: 768px) {
  /* デスクトップ用CSS */
  .archiveArea .postList {
    flex-direction: row;
    justify-content: space-between;
  }
  .archiveArea .postList > li {
    width: 49%;
  }
  .archiveArea .postList > li .thumbnail {
    top: -24px;
  }
}
/*
* 記事詳細
*/
#breadcrumb {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
#breadcrumb li::after {
  content: '>';
  padding: 0 10px;
}
#breadcrumb li:first-child {
  padding: 0;
}
#breadcrumb li:last-child::after {
  content: '';
}
.singleArea .infoArea {
  margin-bottom: 20px;
  border-left: 1px solid #C6C0A6;
  padding: 4px 10px 0px;
}
.singleArea .infoArea .title {
  margin-top: 20px;
  font-size: 140%;
  font-weight: 600;
  color: #C6C0A6;
  line-height: 120%;
}
.singleArea .infoArea .date {
  text-align: right;
  margin-top: 10px;
}
.singleArea .infoArea .date span {
  position: relative;
  font-family: 'icomoon' !important;
  font-size: 80%;
  margin-right: 10px;
}
.singleArea .infoArea .date span.createdAt:before {
  margin-right: 4px;
  font-size: 70%;
  content: "\e94e";
  color: #C6C0A6;
}
.singleArea .infoArea .date span.updatedAt:before {
  margin-right: 4px;
  font-size: 70%;
  content: "\ea2e";
  color: #C6C0A6;
}
.singleArea .firstBaloon {
  position: relative;
  display: inline-block;
  text-align: center;
  margin: 15px 0 10px 0;
  padding: 2px 5px;
  max-width: 100%;
  color: #fff;
  font-size: 12px;
  background: #C6C0A6;
}
.singleArea .firstBaloon:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border: 5px solid transparent;
  border-top: 10px solid #C6C0A6;
}
.singleArea .firstList {
  margin-bottom: 30px;
}
.singleArea .firstList li {
  line-height: 1.5em;
  position: relative;
  padding-left: 2em;
  margin-bottom: 15px;
}
.singleArea .firstList li:before {
  color: #C6C0A6;
  font-family: icomoon;
  content: "\ea10";
  position: absolute;
  left: 0;
  margin-right: 20px;
}
.singleArea .contentArea img {
  display: inherit;
  text-align: center;
  margin: 10px auto;
}
.singleArea .contentArea .link_tag,
.singleArea .contentArea .inlink_tag {
  padding: 1em;
  border: solid 1px #C6C0A6;
  border-radius: 2px;
  margin-bottom: 1.5em;
}
.singleArea .contentArea .link_tag a,
.singleArea .contentArea .inlink_tag a {
  font-weight: 600;
  position: relative;
  display: inline-block;
  padding-left: 1.3em;
  line-height: 120%;
  left: 0;
}
.singleArea .contentArea .link_tag a:before,
.singleArea .contentArea .inlink_tag a:before {
  font-weight: 600;
  color: #C6C0A6;
  font-family: 'icomoon' !important;
  content: "\e968";
  margin-right: 0.4em;
  position: absolute;
  left: 0;
}
.singleArea .contentArea .link_tag img,
.singleArea .contentArea .inlink_tag img {
  display: none;
}
.singleArea .contentArea .inlink_tag a:before {
  content: "\ea10";
}
.singleArea .contentArea .point,
.singleArea .contentArea .campaign,
.singleArea .contentArea .agenda {
  position: relative;
  margin: 2em 0;
  padding: 0.9em 1.5em 0.7em 1.5em;
  border: solid 3px #C6C0A6;
  border-radius: 4px;
}
.singleArea .contentArea .point dt,
.singleArea .contentArea .campaign dt,
.singleArea .contentArea .agenda dt,
.singleArea .contentArea .point li,
.singleArea .contentArea .campaign li,
.singleArea .contentArea .agenda li {
  font-weight: 600;
}
.singleArea .contentArea .point dt:before,
.singleArea .contentArea .campaign dt:before,
.singleArea .contentArea .agenda dt:before,
.singleArea .contentArea .point li:before,
.singleArea .contentArea .campaign li:before,
.singleArea .contentArea .agenda li:before {
  font-size: 90%;
  font-weight: 600;
  color: #C6C0A6;
  font-family: 'icomoon' !important;
  content: "\ea10";
  margin-right: 6px;
}
.singleArea .contentArea .point ul li,
.singleArea .contentArea .campaign ul li,
.singleArea .contentArea .agenda ul li {
  line-height: 1.7em;
}
.singleArea .contentArea .point ol li,
.singleArea .contentArea .campaign ol li,
.singleArea .contentArea .agenda ol li {
  font-weight: 600;
  line-height: 1.7em;
}
.singleArea .contentArea .point ol li:before,
.singleArea .contentArea .campaign ol li:before,
.singleArea .contentArea .agenda ol li:before {
  font-size: 80%;
  margin-right: 10px;
}
.singleArea .contentArea .point ol li > ol,
.singleArea .contentArea .campaign ol li > ol,
.singleArea .contentArea .agenda ol li > ol {
  padding-left: 1em;
}
.singleArea .contentArea .point ol li > ol li:before,
.singleArea .contentArea .campaign ol li > ol li:before,
.singleArea .contentArea .agenda ol li > ol li:before {
  content: "\ea10";
}
.singleArea .contentArea .point dt,
.singleArea .contentArea .campaign dt,
.singleArea .contentArea .agenda dt {
  line-height: 1.7em;
}
.singleArea .contentArea .point dd,
.singleArea .contentArea .campaign dd,
.singleArea .contentArea .agenda dd {
  margin-bottom: 0.8em;
  padding: 0.2em 0;
}
.singleArea .contentArea .point dl:last-child > dd,
.singleArea .contentArea .campaign dl:last-child > dd,
.singleArea .contentArea .agenda dl:last-child > dd {
  margin-bottom: 0;
}
.singleArea .contentArea .point .box-title,
.singleArea .contentArea .campaign .box-title,
.singleArea .contentArea .agenda .box-title {
  position: absolute;
  display: inline-block;
  top: -13px;
  left: 10px;
  padding: 0 9px;
  line-height: 1;
  font-size: 19px;
  background: #FFF;
  color: #C6C0A6;
  font-weight: bold;
}
.singleArea .contentArea .listbox {
  font-weight: 600;
  padding: 0.8em;
  margin: 2em 0;
  background: #C9E8F1;
  border-left: solid 10px #C6C0A6;
}
.singleArea .contentArea .listbox li {
  line-height: 1.5em;
}
.singleArea .contentArea img.pr {
  margin: 0 !important;
}
/*
* 広告
*/
.adTop {
  text-align: center;
  margin-bottom: 30px;
}
.adItem {
  min-width: 300px;
  max-width: 100%;
  min-height: 250px;
  display: inline-block;
  overflow: hidden;
}
.adBottom {
  max-width: 100%;
  min-height: 280px;
  display: flex;
  justify-content: space-around;
}
.adsbygoogle {
  margin-left: 0;
  max-width: 100%;
}
@media screen and (min-width: 768px) {
  /* デスクトップ用CSS */
  .adItem {
    min-width: 336px;
    min-height: 280px;
  }
  .adLeft {
    min-width: 300px;
  }
  .adRight {
    min-width: 300px;
  }
}
.amazon_pr {
  padding: 0 0 2em 0;
}
.amazon_pr .amazon_header {
  display: flex;
  align-items: center;
}
.amazon_pr .amazon_header .img {
  text-align: center;
  width: 100px;
  margin-right: 20px;
}
.amazon_pr .amazon_header .text {
  flex: 2;
}
.amazon_pr .amazon_header .text .title,
.amazon_pr .amazon_header .text .brand {
  width: 100%;
}
.amazon_pr .amazon_header .text .title {
  margin-bottom: 0.3em;
}
.amazon_pr .amazon_fotter {
  line-height: 1.3em;
  font-size: 90%;
}
.amazon_pr .amazon_fotter .price span {
  color: #BF1E56;
}
.rakuten p {
  font-size: 100% !important;
}
.rakuten td {
  border: none;
}
.rakuten td img {
  max-width: none;
}
@media screen and (min-width: 768px) {
  /* デスクトップ用CSS */
  .singleArea .contentArea img {
    display: inline-block;
  }
}
#calArea {
  margin: 1em 0 2em;
}
#calArea #calculation {
  padding: 0.5em 1em;
  border-radius: 1px;
  border: none;
  background-color: #e2dfd2;
  color: #fff;
  margin-bottom: 1em;
}
#calArea #result {
  display: none;
}
#calArea #errors {
  padding: 1em;
  border: 1px solid #BF1E56;
  border-radius: 2px;
  color: #BF1E56;
}
.twitterbox {
  margin-bottom: 10px;
  background-color: #C6C0A6;
  padding: 10px;
  border-radius: 2px;
}
.twitterbox a {
  font-family: "Alegreya Sans SC", "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 95%;
  color: #fff;
}
.twitterbox a::before {
  color: #fff;
  position: relative;
  font-family: 'icomoon' !important;
  font-size: 100%;
  left: 4px;
  top: 2px;
  margin-right: 14px;
  content: "\ea96";
}
.rssbox {
  margin-bottom: 20px;
  background-color: #EDAD0B;
  padding: 10px;
  border-radius: 2px;
}
.rssbox a {
  font-family: "Alegreya Sans SC", "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 95%;
  color: #fff;
}
.rssbox a::before {
  color: #fff;
  position: relative;
  font-family: 'icomoon' !important;
  font-size: 100%;
  left: 4px;
  top: 2px;
  margin-right: 14px;
  content: "\ea9b";
}
