/* override */
html body.page-body-bg-white {
  background-color: #ffffff;
}
html body section#main-container {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 720px) {
  html body >article >section#main {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  html body >article >section#main >p {
    top: auto;
  }
  html body section#main-container {
    flex-direction: column;
    width: 100%;
  }
}
/* blog_common */
.flex {
  display: flex;
}
.flex_between {
  display: flex;
  justify-content: space-between;
}
.flex_center {
  display: flex;
  justify-content: center;
}
.flex_wrap {
  flex-wrap: wrap;
}
.align-items_center {
  align-items: center;
}
.wrapper {
  width: 960px;
  margin: 0 auto;
}
.tag li{
  border: 1px solid #00a59a;
  padding: 4px;
  margin-right: 4px;
  margin-bottom: 4px;
  display: inline-block;
  font-size: 12px;
  line-height: 1;
}
.tag li a {
  font-weight: 600;
  color: #00a59a;
  text-decoration: none;
}
.tag li:hover {
  background-color: #00a59a;
}
.tag li:hover a {
  color: #ffffff;
}
.arrow-right {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-top: 3px solid #5bc1ba;
  border-right: 3px solid #5bc1ba;
  transform: rotate(45deg);
}
.post_image {
  display: flex;
  justify-content: center;
  align-items: center;
}
.post_image img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

/* for_blog_top */
#blog_top {
  margin-top: 40px;
}
#blog_top .top-main {
  width: 632px;
  margin-right: 24px;
}
#blog_top .recommend {
  margin-bottom: 80px;
}
#blog_top .recommend .ttl {
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
  color: #566d77;
  margin-bottom: 16px;
}
#blog_top .recommend .recommended-article {
  width: calc(50% - 24px);
  max-width: 304px;
}
#blog_top .recommend .post_image {
  width: 100%;
  height: 171px;
  margin-bottom: 8px;
}
#blog_top .recommend .ymd {
  color: #607d8b;
  margin-bottom: 4px;
}
#blog_top .recommend .post_ttl {
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 16px;
}
#blog_top .recommend .post_ttl a {
  font-weight: 600;
  color: #00a59a;
  text-decoration: underline;
}
#blog_top .recommend .post_ttl a:hover {
  color: #5bc1ba;
}
#blog_top .post_area_inclusive .new_post_area {
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px solid #cfd8dc;
}
#blog_top .post_area_inclusive .new_post_area .ttl {
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
  color: #566d77;
  margin-bottom: 16px;
}
#blog_top .post_area_inclusive .new_post_area .post_image {
  width: 632px;
  height: 356px;
  margin-bottom: 8px;
}
#blog_top .post_area_inclusive .new_post_area .ymd {
  color: #607d8b;
  margin-bottom: 4px;
}
#blog_top .post_area_inclusive .new_post_area .post_ttl {
  font-size: 24px;
  line-height: 1.5;
  margin-bottom: 24px;
}
#blog_top .post_area_inclusive .new_post_area .post_ttl a {
  font-weight: 600;
  color: #00a59a;
  text-decoration: underline;
}
#blog_top .post_area_inclusive .new_post_area .post_ttl a:hover {
  color: #5bc1ba;
}
#blog_top .post_area_inclusive .post_area .post {
  margin-bottom: 40px;
}
#blog_top .post_area_inclusive .post_area .post_image {
  width: 304px;
  height: 171px;
  margin-right: 16px;
}
#blog_top .post_area_inclusive .post_area .post_info {
  width: 312px;
}
#blog_top .post_area_inclusive .post_area .ymd {
  color: #607d8b;
  margin-bottom: 4px;
}
#blog_top .post_area_inclusive .post_area .post_ttl {
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 16px;
}
#blog_top .post_area_inclusive .post_area .post_ttl a {
  font-weight: 600;
  color: #00a59a;
  text-decoration: underline;
}
#blog_top .post_area_inclusive .post_area .post_ttl a:hover {
  color: #5bc1ba;
}
#blog_top .content.no-article p {
  font-size: 24px;
  text-align: center;
  color: #566d77;
  margin-bottom: 40px;
}

#blog_sidebar .bnr_text {
  padding: 16px;
  background-color: #00a59a;
}
#blog_sidebar .bnr_text .channel_name {
  text-align: center;
  color: #fff;
  font-weight: 600;
  margin-bottom: 16px;
}
#blog_sidebar .bnr_text .channel_ttl {
  width: 256px;
  margin: 0 auto 8px;
}
#blog_sidebar .bnr_text .channel_ttl img {
  width: 100%;
  height: 100%;
}
#blog_sidebar .bnr_text .channnel_des {
  line-height: 1.25;
  font-weight: 600;
  font-size: 24px;
  text-align: center;
  color: #fff;
}
#blog_sidebar .movie_box {
  width: 100%;
  height: 171px;
  margin-bottom: 40px;
}
#blog_sidebar .movie_box iframe {
  width: 100%;
  height: 100%;
}
#blog_sidebar .bnr_img {
  width: 100%;
  margin-bottom: 40px;
}
#blog_sidebar .bnr_img img {
  width: 100%;
  display: block;
}
#main-wrapper #blog_sidebar .bnr_img a {
  display: block;
  margin-top: 40px;
  transition: all .2s;
}
#main-wrapper #blog_sidebar .bnr_img a:first-child{
  margin-top: 0;
}
#main-wrapper #blog_sidebar .bnr_img a:hover {
  opacity: 0.8;
} 
#blog_sidebar .bnr_mailmagazine {
  margin-bottom: 40px;
}
#blog_sidebar .bnr_mailmagazine .ttl {
  background-color: #00a59a;
  padding: 8px 16px 8px;
}
#blog_sidebar .bnr_mailmagazine .free {
  font-size: 24px;
  font-weight: 600;
  display: block;
  background-color: #ff5252;
  border: 3px solid #fff;
  color: #fff;
  margin-right: 12px;
  border-radius: 50%;
  line-height: 1;
  padding: 18px 5px;
}
#blog_sidebar .bnr_mailmagazine .bottombox {
  border: 2px solid #00a59a;
  border-top: none;
  padding: 8px 16px 24px;
}
#blog_sidebar .bnr_mailmagazine .bottombox p{
  color: #607d8b;
}
#blog_sidebar .bnr_mailmagazine .mm {
  font-size: 24px;
  font-weight: 600;
  line-height: 1.25;
  color: #fff;
}
/* 記事検索ブロックは検索結果ページでは上部にも表示するので
   #main-containerからたどる */
#main-container .search {
  width: 100%;
  max-width: 632px;
  margin-bottom: 40px;
}
#main-container .search .ttl {
  font-size: 24px;
  font-weight: 600;
  color: #566d77;
  line-height: 1.5;
  margin-bottom: 10px;
}
#main-container .search_box {
  position: relative;
  max-width: 304px;
}
#main-container .search input[type="search"] {
  width: 100%;
  max-width: 304px;
  height: 40px;
  padding: 8px 40px 8px 8px;
  border: 1px solid #607d8b;
  border-radius: 4px;
  color: #566d77;
}
#main-container .search label.error {
  font-size: 16px;
  line-height: 1;
  color: #ff5252;
  padding-top: 4px;
  white-space: nowrap;
}
#main-container .search_box .blog-search-button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 24px;
  height: 24px;
  padding: 0;
  font-family: "FontAwesome Regular";
  font-size: 24px;
  line-height: 1;
  color: #90a4ae;
  background-color: transparent;
  border: none;
  cursor: pointer;
}
#main-container .search_box .blog-search-button:hover {
  color: #566d77;
}
#blog_sidebar .category_area .ttl {
  font-size: 24px;
  font-weight: 600;
  color: #566d77;
  line-height: 1;
  margin-bottom: 16px;
}
#blog_sidebar .category_area .category {
  line-height: 1;
  margin-bottom: 16px;
}
#blog_sidebar .category_area .category a {
  font-weight: 600;
  text-decoration: none;
  color: #00a59a;
}
#blog_sidebar .category_area .category a:hover {
  text-decoration: underline;
  color: #5bc1ba;
}
#blog_top .twitter_area {
  margin-bottom: 40px;
}
#blog_top .page_nation {
  text-align: center;
  line-height: 1;
  margin-bottom: 80px;
}
#blog_top .page_nation span {
  margin-right: 16px;
  display: inline-block;
}
#blog_top .page_nation span:last-child {
  margin-right: 0;
  margin-bottom: 6px;
}
#blog_top .page_nation span a {
  font-family: "Oswald";
  font-size: 32px;
  color: #dbf0ef;
  text-decoration: none;
}
#blog_top .page_nation span.current a {
  color: #00a59a;
}
#blog_top .page_nation span a:hover {
  text-decoration: underline;
  color: #5bc1ba;
}

#blog_top .page_nation {
  text-align: center;
}
#blog_top .page_nation >span,
#blog_top .page_nation >a {
  font-size: 32px;
  vertical-align: middle;
  margin: auto 8px;
}
#blog_top .page_nation >span.page-numbers,
#blog_top .page_nation >a.page-numbers {
  font-family: "Oswald";
}
#blog_top .page_nation >span.prev,
#blog_top .page_nation >a.prev,
#blog_top .page_nation >span.next,
#blog_top .page_nation >a.next {
  font-family: "FontAwesome Regular";
  color: #00a59a;
}
#blog_top .page_nation >span.prev,
#blog_top .page_nation >a.prev {
  margin-left: 0;
}
#blog_top .page_nation >span.next,
#blog_top .page_nation >a.next {
  margin-right: 0;
}
#blog_top .page_nation >a {
  color: #dbf0ef;
}
#blog_top .page_nation >a:hover,
#blog_top .page_nation >a:active {
  color: #5bc1ba;
}
#blog_top .page_nation >span.dots {
  color: #cfd8dc;
}
#blog_top .page_nation >span.current {
  color: #00a59a;
}
#blog_top .page_nation .blogtop-link {
  margin-top: 24px;
}
#blog_top .page_nation .blogtop-link a {
  font-size: 24px;
  font-weight: 600;
  text-decoration: underline;
  line-height: 1;
  color: #00a59a;
}
#blog_top .page_nation .blogtop-link a:hover,
#blog_top .page_nation .blogtop-link a:active {
  color: #5bc1ba;
}
@media screen and (max-width: 720px) {
  .hidden_tab {
    display: none;
  }
  #main .first_title .small_tab {
    font-size: 14px;
  }
  #blog_top {
    width: 256px;
    margin: 40px auto auto;
  }
	#blog_top main.main {
		width: auto;
		margin-right: 0;
  }
  #blog_top .top-main {
    width: 100%
  }
	#blog_top .first_title {
		top: 105px;
		line-height: 1.25;
	}
	#blog_top .first_title span {
		font-size: 14px;
	}
	#blog_top .post_area_inclusive .new_post_area .post_image {
		width: auto;
		height: 144px;
  }
  #blog_top .recommend {
    margin-bottom: 20px;
  }
  #blog_top .recommend .post_image {
    height: 144px;
  }
  #blog_top .recommend .flex_between {
    flex-direction: column;
  }
  #blog_top .recommend .recommended-article {
		width: 100%;
    margin-bottom: 20px;
	}
  #blog_top .recommend .post_ttl {
    margin-bottom: 8px;
  }
	#blog_top .post_area_inclusive .new_post_area .post_ttl {
    font-size: 16px;
		margin-bottom: 8px;
	}
	#blog_top .post_area_inclusive .new_post_area .post_ttl a {
		font-size: 16px;
	}
	#blog_top .post_area_inclusive .post_area .post_image {
    width: 100%;
    height: 144px;
		margin-right: 0;
		margin-bottom: 8px;
  }
  #blog_top .post_area_inclusive .post_area .post_ttl {
    margin-bottom: 8px;
  }
	#blog_top .post_area_inclusive .post_area .post_info {
    width: auto;
    max-width: 100%;
	}
	#blog_top .post_area_inclusive .post_area .post {
		margin-bottom: 24px;
  }
	#blog_top .post_area_inclusive .post_area .post .flex_center {
		flex-direction: column;
	}
	#blog_top .movie_box {
		width: 100%;
	}
	#blog_top .page_nation {
		margin-bottom: 40px;
	}
	#blog_top .bnr_img {
		width: auto;
	}
	#blog_top .bnr_text .channel_ttl {
		width: 100%;
	}
	.sidebar {
		width: auto;
  }
  #main-container .search .ttl {
    text-align: left;
  }
}
@media screen and (max-width: 640px) {
		#blog_top .bnr_text .channel_name {
			font-size: 14px;
		}
		#blog_top .bnr_text .channnel_des {
			font-size: 20px;
		}
		#blog_top .bnr_mailmagazine .mm {
			font-size: 18px;
		}
		#blog_top .bnr_mailmagazine .free {
			font-size: 20px;
			padding: 18px 8px;
		}
		#blog_top .page_nation span a {
			font-size: 23px;
		}
		#blog_top .page_nation span:last-child {
			margin-bottom: 2px;
		}
	}

/* For Chrome */
/* 検索キャンセルボタンをずらす */
input[type="search" i]::-webkit-search-cancel-button {
  position: relative;
  left: 6px;
}