@charset "utf-8";

body,
body.blog.home .entry-title,
body.archive .entry-title,
body.search .entry-title {
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "Roboto", "Roboto Condensed", "Lucida Grande", "segoe UI", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/* サービスCTA調整 */ 
div.service-info > dl {
	padding: 0.5rem 1.2rem 0;
	background: #f3f3f3!important;
	border: solid 1px #ddd;
}

div.service-info h4 {
	color: #32aca6!important;
}

div.service-info p {
	color: #333!important;
}

div.service-info-in {
	padding: 24px 0 16px!important;
}

div.service-info div.cnfrm-dtl a {
	background: #41b5af!important;
}

div.service-info .service-info-in:nth-child(even) a {
	background: #ffb142!important;
}

div.srv-des {
	background: #41b5af!important;
}

div.srv-des .cnfrm a {
	background: #ffb142!important;
}

/* 投稿・カスタム投稿のスタイル変更 */

/* 見出し(headingタグ),pタグ */

body.single .entry-content h2,
body.single .entry-content h3,
body.single .entry-content h4 {
	margin-top: 40px;
	margin-bottom: 24px;
}

body.single .entry-content h2 {
	font-size: 24px;
  padding: 1rem!important;
  color: #494949;
  background: #c1e6e4;
  border-left: solid 5px #32aca6;
}

body.single .entry-content h3 {
	font-size: 22px;
  padding: 0.8rem;
  border-left: solid 5px #32aca6;
  border-bottom: none!important;
}

body.single .entry-content h4 {
	font-size: 20px;	
}

body.single .entry-content p {
	margin-bottom: 24px;
	padding: 0;
}

/* リンクタグ */
body.single .entry-content a, .single .entry-content a {
  color: #0798ff;
}

/* 引用タグ */
/* キャプション */

body.single .entry-content blockquote > p:last-child,
body.single .entry-content p.wp-caption-text {
	margin-bottom: 0;
}

/* プチ見出し(headingタグではない見出し) */

body.single .entry-content .info,
body.single .entry-content .play {
	display: block;
	margin-top: 40px;
	margin-bottom: 20px;
	font-size: 20px;
  font-weight: bold;
  color: #32aca6;
}

body.single .entry-content .info i,
body.single .entry-content .play i {
	margin-right: 0.5rem;
	font-style: normal!important;
}

/* 太文字(黒,オレンジ) */

body.single .entry-content span.bold {
	font-weight: bold;
}

body.single .entry-content span.bold.orange {
	color: #f89c1a;
}

/* マーカー(黄・赤・緑・青・オレンジ) */
span.marker-yellow {
	background: linear-gradient(transparent 60%,#ffff7f 60%);
	font-weight: bold; 
}

span.marker-red {
	background: linear-gradient(transparent 60%,#ff8484 60%);
	font-weight: bold; 
}

span.marker-green {
	background: linear-gradient(transparent 60%,#12a08e 60%);
	font-weight: bold; 
}

span.marker-blue {
	background: linear-gradient(transparent 60%,#84c1ff 60%);
	font-weight: bold; 
}

span.marker-orange {
	background: linear-gradient(transparent 60%,#f89c1a 60%);
	font-weight: bold; 
}

/* リストタグの調整 */

body.single .entry-content ul {
	background-color: rgba(50, 172, 166, 0.12);
	padding: 1.5rem 1.7rem 1.5rem 2.5rem;
	margin: 16px 0 32px;
	border-radius: 3px;
	line-height: 1.8;
}

body.single .entry-content ul > li {
	margin-bottom: 0.5rem;
}

body.single .entry-content ol {
	counter-reset: number;
	list-style: none;
	margin: 16px 0 32px;
	padding: 1.5rem 1.7rem;
	background-color: rgba(50, 172, 166, 0.12);
	border-radius: 3px;
}

body.single .entry-content ol li {
	position: relative;
	list-style: none;
	line-height: 1.8;
	padding-left: 20px;
	margin-bottom: 0.5rem;
}

body.single .entry-content ol > li:last-child,
body.single .entry-content ul > li:last-child {
	margin-bottom: 0;
}

body.single .entry-content ol > li:before {
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*以下数字のデザイン変える*/
  display:inline-block;
  background: #32aca6;
  color: white;
  font-weight:bold;
  font-size: 12px;
  border-radius: 50%;
  left: -10px;
  width: 18px;
  height: 18px;
  line-height: 20px;
  text-align: center;
  /*以下 上下中央寄せのため*/
  top: 48%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* 背景色付きボックス */

body.single .entry-content .bg-green-box {
	background-color: rgba(50, 172, 166, 0.15);
	padding: 1rem 1.5rem;
	margin-bottom: 24px;
	border-radius: 3px;
	line-height: 1.8;
}

body.single .entry-content .bg-gray-box {
	background-color: #f3f3f3;
	padding: 1rem 1.5rem;
	margin-bottom: 24px;
	border-radius: 3px;
	line-height: 1.8;
}

/* SEO編集部のコメント欄の調整 */
body.single .entry-content .ecom_top,
body.single .entry-content .ecom {
	padding: 24px 34px 24px;
}

body.single .entry-content .ecom_top > p,
body.single .entry-content .ecom p {
	margin-bottom: 16px;
}

body.single .entry-content .ecom_top > p:last-child,
body.single .entry-content .ecom > p:last-child {
	margin-bottom: 0;	
}


/* 翻訳元記事の紹介 */
body.single .entry-content .source {
	margin: 1.5rem 0 2.5rem;
	padding: 1.5rem 0;
	line-height: 1.8;
	border-top: 3px double #e2e2e2;
	border-bottom: 3px double #e2e2e2;
}

/* Table of Contents(目次)の調整 */ 
body.single .entry-content #toc_container {
  border: solid 1px whitesmoke;
  padding: 1.2rem 1rem 1.2rem 2.3rem;
  margin: 0 auto;
  position: relative;
  background: #f9f9f9;
  width: 90%!important;
}

body.single .entry-content #toc_container li {
	line-height: 1.7;
  list-style-type: none!important;
}

body.single .entry-content #toc_container li:before {
	font-family: "FontAwesome";
  content: "\f0da";
  position: absolute;
 	line-height: 1.4;
  left : 1em;
  color: gray;
}

body.single .entry-content #toc_container li > ul >li:before {
	content: none;
}

/* ブログカード */
.blog-card{
	border:1px solid #ddd;
	word-wrap:break-word;
	max-width:90%;
	border-radius:2px;
	margin: 0 auto 30px;
}
 
.blog-card a {
	color: #333;
	background: #fff;
	display: flex;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
 
.blog-card a:hover{
	background: rgba(18,160,132,0.2);
}
 
.blog-card-thumbnail{
	float:left;
	padding:10px;
}
 
.blog-card-thumbnail img {
	display: block;
	padding: 0;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
 
.blog-card-content{
	padding-top: 1%;
	line-height:120%;
}
.blog-card-title{
	padding:10px 10px 10px 0;
	font-size:85%;
}
 
.blog-card-title::before {
	content: '関連記事';
	font-size: 0.7em;
	font-weight: bold;
	color: #fff;
	background: #333;
	width: 5em;
	display: inline-block;
	padding: 0.2em;
	position: relative;
	top: -2px;
	text-align: center;
	margin-right: 0.5em;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}
 
.blog-card-date{
	color:#333;
	font-size:75%;
	margin-right:10px;
}

/* SEO対策基礎ガイド用（後日、上のCSSと統合する） */

.content0320 img {
	margin-bottom: 1rem!important;
}

.content0320 h2.sample {
	margin: 60px 0 24px 0!important;
  padding: 1rem!important;
  color: #494949;
  background: #c1e6e4;
  border-left: solid 5px #32aca6;
}

.content0320 h3.sample {
  margin: 40px 0 16px 0!important;
	padding: 0.8rem;
	border-left: solid 5px #32aca6;
	border-bottom: none!important;
}	

.content0320 ul.sample,
.content0320 ol.sample {
	margin:1rem 0!important;
	padding: 1.5rem 1.25rem;
	background-color: rgba(50, 172, 166, 0.15);
  border-radius: 3px;
}

.content0320 ul.sample > li,
.content0320 ol.sample > li {
	list-style-position: inside!important;
}

.content0320 ol {
	counter-reset:number;
	list-style: none!important;
}

.content0320 ol > li {
	list-style: none!important;
}

.content0320 ol > li:before {
	counter-increment: number;
  content: counter(number);
  width: 1rem;
  height: 1rem;
  display: inline-block;
  border-radius: 100%;
  position: relative;
  top: -2px;
  left: -6px;
  font-size: 0.7rem;
  text-align: center;
  background: #32aca6;
  color: #fff;
}

.content0320 .bg-green {
	background-color: rgba(50, 172, 166, 0.15);
  padding: 1.5rem 1rem;
  margin: 1rem 0;
  border-radius: 3px;
  line-height: 1.8;
}

.content0320 span.bold {
	font-weight: bold;
}

.content0320 .info {
	font-size: 24px;
	font-weight: bold;
	color: #32aca6;
}

.content0320 .info i {
	margin-right: 0.4rem;
	font-style: normal!important;
}

/* CTA間に合わせ用 */

.content0320 table.cta {
	background-color: rgb(237, 247, 246);
}

.content0320 table.cta td {
	padding: 1.5rem;
	vertical-align: middle;
	line-height: 1.6;
}

.content0320 th.cta-head {
	padding: 1.3rem;
	background-color: rgb(18, 160, 142);
	color: #fff;
	text-align: center;
	font-size: 18px!important;
	font-weight: bold;
}

.content0320 span.cta-plan-head {
	font-size: 18px!important;
	margin-bottom: 0.5rem;
	font-weight: bold;
}

.content0320 .cta-plan-head i {
	font-style: normal!important;
	margin-right: 0.25rem;
}

.content0320 .cta-plan-detail {
	text-align: center;
}

.content0320 a.cta-link {
	padding: 0.5em 1em;
  margin: 2em 0;
  font-weight: bold;
  color: #fff!important;
  text-decoration: none!important;
  background: #f89c1a;
  border-radius: 3px;/*角の丸み*/
  text-align: center;
}

.content0320 a.cta-link-contact {
	display: block;
	padding: 0.5em 1em;
  margin: 1em auto 0;
  font-weight: bold;
  color: #fff!important;
  background: #f89c1a;
  text-decoration: none!important;
  text-align: center;
  border-radius: 3px;/*角の丸み*/
	width: 80%;
}

/**
* for recuit page
*/
.p-recruit .entry-content h1 {
	color: #333 !important;
}
.p-recruit .entry-content h2 {
	margin: 60px 0 10px;
	padding-bottom: 8px;
	border-bottom: 1px dotted #e2e2e2;
	font-weight: 700;
	font-size: 162%;
	line-height: 1.5;
}
.p-recruit .entry-content h3 {
	margin: 30px 0 10px;
}
.p-recruit .entry-content li {
	line-height: 2em;
}
.p-recruit .entry-content div span {
	border: #12a08e 1px solid;
}
.p-recruit .entry-content .icon_on {
	display: inline-block;
	padding: 0 0.8em;
	height: 30px;
	background: #12a08e;
	color: #fff;
	font-weight: bold;
	line-height: 31px;
	margin: 2px 0;
	border: 1px solid #12a08e;
}
.p-recruit .entry-content .icon {
	display: inline-block;
	padding: 0 0.8em;
	height: 30px;
	color: #12a08e;
	font-weight: bold;
	line-height: 31px;
	margin: 2px 0;
	border: 1px solid #12a08e;
}
.p-recruit .entry-content .apply {
	text-align: center;
	margin: 30px 0;
}
.p-recruit .entry-content .apply_btn:hover {
	background: #333;
	color: #fff !important;
}
.p-recruit .entry-content a.apply_btn {
	display: inline-block;
	width: 100%;
	max-width: 500px;
	font-size: 124%;
	font-weight: bold;
	color: #333 !important;
	border: 2px solid #333;
	padding: 14px 0;
	text-decoration: none;
}
.p-recruit .entry-content span.small {
	font-size: 80%;
	border: none !important;
}
.p-recruit .entry-content  .Recruitment {
	line-height: 200%;
}
.p-recruit .entry-content .r_info {
	margin: 10px;
	padding: 20px;
	font-size: 90%;
	border: #ddd solid 1px;
	line-height: 200%;
}
.p-recruit .entry-content .r_info h4 {
	font-weight: bold;
	border-left: #333 solid 15px;
	margin: 20px 0 10px 0;
	padding: 0 0 0 10px;
}

.form-control:focus {
	color: inherit;
  background-color: #fff;
  border-color: #61aae8;
  outline: 0;
  box-shadow: 0 0 0 1px #61aae8;
}

.form-control-select {
  height: calc(2.575rem + 2px);
  padding: .5rem .8rem;
  font-size: .875rem;
  line-height: 1.8;
  color: #292929;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #e4e4e4;
  border-radius: 3px;
}

.form-control-select:focus {
	color: inherit;
  background-color: #fff;
  border-color: #61aae8;
  outline: 0;
  box-shadow: 0 0 0 1px #61aae8;
}

/* メールマガジン */
.magazine-entry {
	text-align: center;
}

.magazine-entry input[type="text"] {
	width: 450px;
	height: calc(2.575rem + 2px);
	margin-bottom: 1.5rem;
  padding: .5rem .8rem;
  font-size: .875rem;
  line-height: 1.8;
  color: #292929;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border-radius: 3px;
}

.magazine-entry input[type="submit"] {
	max-width: 250px;
  width: 100%;
  font-weight: 700;
  border: none;
  color: #fff;
  font-size: 1.2rem;
}

/*============================================================================
 * Media Queries
=============================================================================*/
/* Phones (767px under) - Media Queries =====================================*/
@media only screen and (max-width: 767px) {
	/* サービスCTA調整 */
	div.service-info > dl {
		padding: 1rem 0;
	}
	div.service-info dl div.service-info-in {
		padding: 1.25rem 0.5rem!important;
	}
	p.goteian {
		padding: 12px 6px!important;
	}
	/* Table of Contents(目次)の調整 */
	/* スマホ表示時の幅を小さくする */
	body.single .entry-content #toc_container {
		width: 85%!important;
	}
	body.single .entry-content #toc_container li:before {
		line-height: 1.5;
	}
	/* ブログカードの幅 */
	.blog-card {
		max-width: 100%;
	}
	/*メルマガ登録フォームの幅*/
	.magazine-entry input[type="text"] {
		width: 90%;
	}
}

/* Tablets only (768px - 978px) - Media Queries ==================================*/
@media only screen and (min-width: 768px) and (max-width: 978px) {

}

/* Desktop only(979px over) - Media Queries ======================================*/
@media only screen and (min-width: 979px) {

}

/* Desktop large only (1200px over) - Media Queries ==============================*/
@media only screen and (min-width: 1200px) {

}