@charset "UTF-8";
/* CSS Document */


/* contents01 */

.contents01 .box-inner {
	padding: 90px 0px 200px;
}

.contents01 .box-inner > div:not(:last-child) {
	margin-bottom: 60px;
}

.contents01 ol {
	padding-left: 30px;
}

.contents01 ol li, .contents01 .layout-blog03 ul li, .contents01 .layout-blog04 ul li {
	font-size: 15px;
line-height: 1.6;
letter-spacing: 0.05em;
font-weight: 500;
}

.contents01 ol li {
	list-style-type: decimal-leading-zero;
}

.contents01 .layout-blog03 ul li, .contents01 .layout-blog04 ul li {
	position: relative;
	padding-left: 30px;
}

.contents01 .layout-blog03 ul li::before, .contents01 .layout-blog04 ul li::before {
	content: "";
	position: absolute;
left: 10px;
top: 10px;
	width: 5px;
	height: 5px;
	background-color: #2D2D2D;
	display: block;
	border-radius: 50%;
}

.contents01 ol li::marker {
	font-family: "Zen Old Mincho", serif;
}

.contents01 ol li:not(:last-child), .contents01 .layout-blog03 ul li:not(:last-child), .contents01 .layout-blog04 ul li:not(:last-child) {
	margin-bottom: 20px;
}

.contents01 h2, .contents01 h1 {
	font-family: "Zen Old Mincho", serif;
	font-size: 40px;
line-height: 1.4;
	letter-spacing: 0.05em;
	font-weight: 500;
	padding: 30px 10px;
	margin-bottom: 40px;
	border-bottom-style : solid;
border-color : #707070;
border-width : 1px;
}

.layout-blog04 h2 {
	padding-top: 0px;
}

.contents01 h3 {
	font-family: "Zen Old Mincho", serif;
	font-size: 24px;
line-height: 1.2;
letter-spacing: 0.05em;
font-weight: 500;
	padding: 10px 20px;
	margin-bottom: 20px;
	color: #FFF;
	background-color: #2D2D2D;
}

.contents01 .layout-blog03 h3 {
	background-color: #FFF;
	border-style : solid;
border-color : #2D2D2D;
border-width : 1px;
	color: #2D2D2D;
}

.contents01 .layout-blog03 .lay01:nth-child(2) h3 {
	color: #FFF;
	background-color: #2D2D2D;
}

.contents01 h4 {
	font-size: 21px;
line-height: 1.4;
letter-spacing: 0.05em;
font-weight: 600;
	margin-bottom: 30px;
}

.layout-blog03 h4 {
	font-size: 24px;
}



/* layout-blog01 */

.layout-blog01 {
	position: relative;
}

.layout-blog01 .box-day {
	display: flex;
  justify-content: flex-end;
flex-wrap: wrap;
	align-items: center;
}

.layout-blog01 .box-day .box-logo {
	flex: 1;
}

.layout-blog01 .box-day .box-logo img {
	width: auto;
}

.layout-blog01 .box-category ul {
	display: flex;
  justify-content: flex-start;
flex-wrap: wrap;
	gap:10px 30px;
}

.layout-blog01 .box-category ul.category02 {
	gap:10px;
}

.layout-blog01 .box-category ul:not(:last-child) {
	margin-bottom: 15px;
}

.layout-blog01 .box-category ul li a {
	display: inline-block;
line-height: 1.2;
font-weight: 400;
}

.layout-blog01 .box-category ul.category01 li a::before {
	content: "#";
}

.layout-blog01 .box-category ul.category02 li a {
	font-size: 14px;
	padding: 3px 10px;
	background-color: #2D2D2D;
	color: #FFF;
}

.layout-blog01 .box-category ul li a:hover {
	opacity: 1;
}

.layout-blog01 .text-day p {
	font-size: 14px;
line-height: 1.2;
font-weight: 400;
	letter-spacing: 0.05em;
}

.layout-blog01 .box-text {
	padding-top: 40px;
}

.layout-blog01 .box-text p {
	font-size: 19px;
}


/* layout-blog02 */

.layout-blog02 {
	text-align: center;
}

.layout-blog02 img, .layout-blog04 img {
	width: auto;
	max-width: 1040px;
}


/* layout-blog03 */

.layout-blog03 {
	padding: 75px;
	background-color: #F4F4F4;
}

.layout-blog03 .lay01:not(:last-child) {
	margin-bottom: 40px;
}

.tag-list {
	display: flex;
  justify-content: flex-start;
flex-wrap: wrap;
	gap:10px;
}

.tag-list a {
	display: inline-block;
line-height: 1.2;
font-weight: 400;
	font-size: 14px;
	padding: 7px 15px;
	background-color: #FFF;
}

.tag-list a::before {
	content: "#";
}

.tag-list a:hover {
	opacity: 1;
}


/* layout-blog04 */

.layout-blog04 ol:not(:last-child), .layout-blog04 ul:not(:last-child), .layout-blog04 blockquote:not(:last-child) {
	margin-bottom: 60px;
}

.layout-blog04 p:not(:last-child) {
	margin-bottom: 30px;
}

.layout-blog04 blockquote {
	background-color: #F4F4F4;
	padding: 70px 80px;
	position: relative;
}

.layout-blog04 blockquote p {
	font-size: 18px;
color: #818181;
line-height: 1.6;
letter-spacing: 0.05em;
font-weight: 400;
	position: relative;
}

.layout-blog04 blockquote::before {
	content: "";
	position: absolute;
left: 45px;
top: 55px;
	background-image: url("../../images/blog/icon-blockquote.svg");
background-position: left top;
background-repeat: no-repeat;
	background-size: auto 100%;
	width: 56px;
	height: 45px;
}

.layout-blog04 p a {
	color: #0043A1;
	text-decoration: underline;
}

/* layout-blog05 */

.layout-blog05 {
	padding-left: 15%;
	width: 100%;
}

.layout-blog05 .inner-wrap {
	padding-bottom: 30px;
	overflow-x: auto;
	white-space: nowrap;
	display: flex;
  justify-content: space-between;
	scrollbar-color: #D9D9D9 rgba(255,255,255,0);
}

.layout-blog05 .inner-wrap::-webkit-scrollbar {
    width: 6px;
	height: 6px;
	border-radius: 30px;
}

.layout-blog05 .inner-wrap::-webkit-scrollbar-track-piece  {
    background-color: rgba(255,255,255,0);
	border-radius: 30px;
}

.layout-blog05 .inner-wrap::-webkit-scrollbar-thumb  {
   border-radius: 30px;
	background-color: #D9D9D9;
}

.layout-blog05 .inner-wrap .box {
	background-color: #F4F4F4;
	min-width: 430px;
	min-height: 200px;
	display: inline-block;
vertical-align: top;
}

.layout-blog05 .inner-wrap .box:not(:last-child) {
	border-right-style : solid;
border-color :#2D2D2D;
border-width : 1px;
}

.layout-blog05 .inner-wrap h3 {
	white-space: normal;
}

.layout-blog05 .inner-wrap .box:not(:last-child) h3 {
	position: relative;
}

.layout-blog05 .inner-wrap .box:not(:last-child) h3::before {
	content: "";
	position: absolute;
right: 0px;
top: 0px;
	width: 1px;
	height: 100%;
	display: block;
	background-color: #FFF;
	margin-right: -1px;
}

.layout-blog05 p {
	padding: 0px 20px 20px;
	font-size: 15px;
	line-height: 1.6;
	white-space: normal;
}


/* contents02 */

.contents02 {
	width: 100%;
	background-color: #F4F4F4;
	padding: 50px 0px 200px;
}

.contents02 .box-inner {
	position: relative;
}

.contents02 .box-inner::before {
	content: "同じサービスの実績";
	position: absolute;
left: 0px;
top: 0px;
	display: inline-block;
	margin-top: -110px;
	font-size: 21px;
line-height: 1.2;
letter-spacing: 0.05em;
font-weight: 600;
}

.contents02_column .box-inner::before {
	content: "同じカテゴリの記事";
}

.contents02 .box-link, .box-link-news {
	text-align: center;
	padding-top: 70px;
}


/* works_single-body */

.works_single-body img {
	width: 100%;
height: auto;
}

.contents01 .col:after, .contents01 .container:after, .contents01 .row:after{clear:both}

.contents01 .col:after, .contents01 .col:before, .contents01 .container:after, .contents01 .container:before, .contents01 .row:after, .contents01 .row:before{content:" ";display:table;line-height:0}

.contents01 .col:before, .contents01 .container:after, .contents01 .container:before, .contents01 .row:after, .contents01 .row:before{content:" ";display:table;line-height:0}

.contents01 .col{min-height:1px;position:relative;padding-left:10px;padding-right:10px}

@media screen and (min-width:768px){
	.md-0,.md-1,.md-10,.md-11,.md-12,.md-2,.md-3,.md-4,.md-5,.md-7,.md-8,.md-9{float:left}
	.md-6{width:50%;float:left}
	.offset-md-6{margin-left:50%}
	.md-12{width:100%}
	.offset-md-12{margin-left:100%}
}

.works_single-img>div{text-align:center}

.works_single-head-label{margin-bottom:50px}

.works_single-head-label ul{margin:0;padding:0}

.works_single-head-label li{margin:0;padding:0 10px;list-style:none;display:inline-block}

.works_single-head-label li a{color:#33a4de;font-weight:700;text-decoration:none;font-size:14px}

.works_single-head-label dl{display:flex;padding-bottom:10px;border-bottom:1px solid #ddd}

.archive_blog_list,.company_logo{padding:60px 0}

.works_single-head-label dd{margin:0}

.works_single-head-label dt{font-weight:700;width:100px}

.works_single-img{margin:40px -10px 50px}

.works_single-text{margin:40px -10px 50px}

@media screen and (max-width:767px){
	.works_single-img .md-6{margin-bottom:20px}
	.works_single-img{margin:20px -10px 30px}
	.works_single-text{margin:20px -10px 30px}
}

.youtube{text-align:center;position:relative;padding-bottom:56.25%;height:0;overflow:hidden}

.youtube iframe{position:absolute;top:0;left:0;width:100%;height:100%}

.works_single-img img{border:1px solid #ddd}



.text-category-news h4 {
	line-height: 1.2;
font-weight: 400;
	font-size: 12px;
	display: inline-block;
	padding: 5px 10px;
	border-style : solid;
border-color : #000;
border-width : 1px;
	margin-top: 27px;
	margin-left: 10px;
}

.sp-view {
	display: none;
}



/* ==========================================
   2. 全体レイアウト設定（PCベース）
========================================== */
.layout-1040,
.blog-main-content {
	max-width: 1120px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
	box-sizing: border-box;
}

/* --- 目次（本文内・先頭に配置） --- */
.blog-toc {
	margin-bottom: 60px;
}

.blog-toc .layout-blog03 {
	padding: 35px 30px;
	background-color: #F4F4F4;
}

.blog-toc .layout-blog03 h4 {
	font-family: "Zen Old Mincho", serif;
	font-size: 20px;
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 1px solid #2D2D2D;
}


/* ==========================================
   3. 各コンポーネント（冒頭要約・著者情報）
========================================== */
/* --- 冒頭要約 --- */
.layout-blog-summary {
	margin-bottom: 60px;
}

.layout-blog-summary .summary-box {
	background-color: #F4F4F4;
	border: 2px solid #2D2D2D;
	border-left: 8px solid #2D2D2D;
	padding: 35px 40px;
	position: relative;
}

.layout-blog-summary .summary-title {
	font-family: "Zen Old Mincho", serif;
	font-size: 20px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	font-weight: 600;
	color: #2D2D2D;
	margin-bottom: 18px;
	padding-bottom: 10px;
	border-bottom: 1px dashed #707070;
	display: flex;
	align-items: center;
}

.layout-blog-summary .summary-title::before {
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	background-color: #2D2D2D;
	margin-right: 10px;
	border-radius: 2px;
}

.layout-blog-summary .summary-content,
.layout-blog-summary .summary-content p {
	font-size: 15px;
	line-height: 1.8;
	letter-spacing: 0.05em;
	font-weight: 500;
	color: #2D2D2D;
	margin-bottom: 0;
}

/* --- 著者情報 --- */
.layout-blog-author {
	margin-top: 80px;
	background-color: #F4F4F4;
	padding: 40px 50px;
}

.layout-blog-author .author-title {
	font-family: "Zen Old Mincho", serif;
	font-size: 20px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	font-weight: 500;
	margin-bottom: 25px;
	padding-bottom: 10px;
	border-bottom: 1px solid #2D2D2D;
	color: #2D2D2D;
}

.layout-blog-author .author-inner {
	display: flex;
	align-items: flex-start;
	gap: 30px;
}

.layout-blog-author .author-img {
	width: 100px;
	height: 100px;
	flex-shrink: 0;
	border-radius: 50%;
	overflow: hidden;
	background-color: #DDD;
}

.layout-blog-author .author-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.layout-blog-author .author-info {
	flex: 1;
}

.layout-blog-author .author-name {
	font-family: "Zen Old Mincho", serif;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.05em;
	margin-bottom: 10px;
	color: #2D2D2D;
}

.layout-blog-author .author-detail {
	font-size: 14px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	color: #2D2D2D;
}

.layout-blog-author .author-detail p:last-child {
	margin-bottom: 0;
}


/* ==========================================
   4. レスポンシブ対応（スマホ表示: 767px以下）
========================================== */
@media screen and (max-width: 767px) {
	.layout-1040,
	.blog-main-content {
		padding-left: 15px;
		padding-right: 15px;
	}

	.blog-toc .layout-blog03 {
		padding: 25px 20px;
	}

	.layout-blog-summary {
		margin-bottom: 40px;
	}

	.layout-blog-summary .summary-box {
		padding: 25px 20px;
		border-left-width: 6px;
	}

	.layout-blog-summary .summary-title {
		font-size: 18px;
	}

	.layout-blog-author {
		padding: 30px 20px;
		margin-top: 50px;
	}

	.layout-blog-author .author-inner {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}