@charset "UTF-8";

/*----------------------
*index.css
*PC・共通版
----------------------*/

/*itemList*/
ul.itemList.scaleA figure a {
	position: relative;
	display: block;
	overflow: hidden;
}
ul.itemList.scaleA figure a img {
	position: relative;
	z-index: 1;
}
ul.itemList.scaleA figure a:after {
	position: absolute;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: "";
/*	-webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;*/
}
/*ul.itemList.scaleA figure a:hover:after {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}*/
ul.itemList.scaleA figure a.service01:after {
	background: url(../../solution/images/bg-bnr-service-01-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service02:after {
	background: url(../../solution/images/bg-bnr-service-02-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service03:after {
	background: url(../../solution/images/bg-bnr-service-03-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service04:after {
	background: url(../../solution/images/bg-bnr-service-04-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service05:after {
	background: url(../../solution/images/bg-bnr-service-05-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service06:after {
	background: url(../../solution/images/bg-bnr-service-06-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service07:after {
	background: url(../../solution/images/bg-bnr-service-07-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service08:after {
	background: url(../../solution/images/bg-bnr-service-08-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service09:after {
	background: url(../../solution/images/bg-bnr-service-09-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service10:after {
	background: url(../../solution/images/bg-bnr-service-10-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service11:after {
	background: url(../../solution/images/bg-bnr-service-11-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service12:after {
	background: url(../../solution/images/bg-bnr-service-12-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service13:after {
	background: url(../../solution/images/bg-bnr-service-13-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service14:after {
	background: url(../../solution/images/bg-bnr-service-14-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service15:after {
	background: url(../../solution/images/bg-bnr-service-15-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service16:after {
	background: url(../../solution/images/bg-bnr-service-16-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service17:after {
	background: url(../../solution/images/bg-bnr-service-17-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service18:after {
	background: url(../../solution/images/bg-bnr-service-18-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service19:after {
	background: url(../../solution/images/bg-bnr-service-19-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service20:after {
	background: url(../../solution/images/bg-bnr-service-20-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service21:after {
	background: url(../../solution/images/bg-bnr-service-21-pc.jpg) center center no-repeat;
	background-size: cover;
}
ul.itemList.scaleA figure a.service22:after {
	background: url(../../solution/images/bg-bnr-service-22-pc.jpg) center center no-repeat;
	background-size: cover;
}

ul.itemList.scaleA figure a.service23:after {
	background: url(../../solution/images/bg-bnr-service-23-pc.png) center center no-repeat;
	background-size: cover;
}

ul.itemList.scaleA figure a.service24:after {
	background: url(../../solution/images/bg-bnr-service-24-pc.png) center center no-repeat;
	background-size: cover;
}


/*credo*/
.marketingArea {
	margin: 0 0 -95px;
	counter-reset: num;
}
.marketingArea > li {
	position: relative;
	box-sizing: border-box;
	min-height: 225px;
	margin: 0 0 0 75px;
	padding: 0 0 75px 75px;
	counter-increment : chapter;
	border-left: solid 1px #CCC;
}
.marketingArea > li:last-child {
	padding: 0 0 0 75px;
	border-left: none;
}
.marketingArea > li::before {
	position: absolute;
	top: 0;
	left: -50px;
	width: 100px;
	height: 100px;
    content: "" counter(num, decimal);
    counter-increment: num;
	background-color: #CCC;
    border-radius: 50px;
	font-size: 32px;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	line-height: 3.2;
	color: #FFF;
	text-align: center;
	vertical-align: middle;
}
.marketingArea > li h3 { margin: 0 10px 30px; }
.marketingArea > li dl,
.marketingArea > li p {
	margin: 0 10px 40px;
	font-size: 12px;
	line-height: 25px;
}
.marketingArea > li dt { font-weight: bold; }
.marketingArea > li dd { margin: 0 0 5px; }
.marketingArea > li dd ul { margin-top: 10px; }
figure.exwrite img {
	width: 280px;
	margin: 0 0 50px;
}

/* solution */
.solution ul.items>li{
	text-indent: 0;
    padding: 0;
}

.solution ul.items>li>p{
	margin-left: 1em;
}

/* image */
.solution figure {
    text-align: center;
}
.solution figure .karteImg {
    width: 800px;
    max-width: 100%;
}
.solution figure.borderImg {
	border: 1px solid #dddddd;
}

.solution figure .solutionImg {
	max-width: 100%;
	width: auto;
	height: auto;
}



/* UXリサーチ支援実績 */
.row--achievements ul.itemList {
  padding-bottom: 0;
  display: flex;
  flex-wrap: wrap;
}
.row--achievements .col1of4Box li {
	width: calc(100% / 3);
	text-align: left;
	margin-bottom: 0;
}

/* microCMSソリューション */
.bgColorWhite {
	background-color: #FFF;

}
.grid2col {
	display: grid;
	gap: 10px;
	grid-template-columns: 1fr 1fr;
	margin-bottom: 95px;
}

.microcmswebinar {
    width: 280px;
	margin: 0 auto;
}
figure.microcmspartner img {
    width: 280px;
}

.reason {
    font-size: 14px;
	margin: 0 10px 40px
}

figure.microcmspartner img {
    width: 280px;
}

@media screen and (max-width: 1200px) {

}

@media screen and (max-width: 960px) {
ul.itemList.scaleA figure a:after {
	-webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    transition: none;
}


}


@media screen and (max-width: 767px) {
ul.itemList.scaleA figure a.service01:after,
ul.itemList.scaleA figure a.service02:after,
ul.itemList.scaleA figure a.service03:after,
ul.itemList.scaleA figure a.service04:after,
ul.itemList.scaleA figure a.service05:after,
ul.itemList.scaleA figure a.service06:after,
ul.itemList.scaleA figure a.service07:after,
ul.itemList.scaleA figure a.service08:after,
ul.itemList.scaleA figure a.service09:after,
ul.itemList.scaleA figure a.service10:after,
ul.itemList.scaleA figure a.service11:after,
ul.itemList.scaleA figure a.service12:after,
ul.itemList.scaleA figure a.service13:after,
ul.itemList.scaleA figure a.service14:after,
ul.itemList.scaleA figure a.service15:after,
ul.itemList.scaleA figure a.service16:after,
ul.itemList.scaleA figure a.service17:after,
ul.itemList.scaleA figure a.service18:after,
ul.itemList.scaleA figure a.service19:after,
ul.itemList.scaleA figure a.service20:after,
ul.itemList.scaleA figure a.service21:after,
ul.itemList.scaleA figure a.service22:after,
ul.itemList.scaleA figure a.service23:after,
ul.itemList.scaleA figure a.service24:after,
ul.itemList.scaleA figure a:after { background: none; }

ul.itemList.spBnr {
	margin: 0 -5px;
	border-top: solid 1px #EEE;
}
.bgColor.typeA ul.itemList.spBnr {
	border-top: solid 1px #FFF;
}

ul.itemList.spBnr li {
	box-sizing: border-box;
	margin: 0;
	padding: 5px 15px;
	border-bottom: solid 1px #EEE;
}

.bgColor.typeA ul.itemList.spBnr li {
	border-bottom: solid 1px #FFF;
}




ul.itemList.spBnr figure {
	display: table-cell;
	width: 65px;
	height: 65px;
	margin-bottom: 0;
	vertical-align: top;
}
ul.itemList.spBnr figure img {
	width: 65px;
	height: 65px;
}

#content ul.itemList.spBnr .ttlB1 {
	display: table-cell;
    margin-bottom: 0;
	font-size: 12px;
	line-height: 20px;
}
#content ul.itemList.spBnr .ttlB1 .txtAC.vAM {
	display: table-cell;
	width: 700px;
	height: 65px;
	padding-left: 10px;
	text-align: left !important;
}
ul.itemList.spBnr p.gridTypeD {
	display: none;
}



/*credo*/
.marketingArea {
	margin: 0 0 0 5px;
}
.marketingArea > li {
	position: relative;
	box-sizing: border-box;
	min-height: 225px;
	margin: 0 0 0 75px;
	padding: 0 0 75px 75px;
	counter-increment : chapter;
	border-left: solid 1px #CCC;
}
.marketingArea > li {
	min-height: auto;
	margin: 0 0 0 40px;
	padding: 0 0 30px 50px;
}
.marketingArea > li:last-child {
	padding: 0 0 0 50px;
}
.marketingArea > li::before {
	left: -35px;
	width: 70px;
	height: 70px;
    border-radius: 35px;
	font-size: 26px;
	line-height: 2.8;
}
.marketingArea > li h3 { margin: 0 10px 20px; }
.marketingArea > li dl,
.marketingArea > li p {
	margin: 0 10px 30px;
}
figure.exwrite img {
	width: 215px;
	margin: 0 0 10px;
}


/* UXリサーチ支援実績 */
.row--achievements .col1of4Box li {
	width: 50%;
}

/* microCMSソリューション */
.grid2col {
	margin-bottom: 40px;
}
.grid2col .gridItem {
	grid-column: 1 / 3;
}

/*
		.marketingArea {
			margin: 0 0 -95px;
			counter-reset: num;
		}
		.marketingArea > li {
			position: relative;
			box-sizing: border-box;
			min-height: 225px;
			margin: 0 0 0 75px;
			padding: 0 0 75px 75px;
			counter-increment : chapter;
			border-left: solid 1px #CCC;
		}
			.marketingArea > li:last-child {
				padding: 0 0 0 75px;
				border-left: none;
			}
		.marketingArea > li::before {
			position: absolute;
			top: 0;
			left: -50px;
			width: 100px;
			height: 100px;
			content: "" counter(num, decimal);
			counter-increment: num;
			background-color: #CCC;
			border-radius: 50px;
			font-size: 32px;
			font-family: Helvetica, Arial, sans-serif;
			font-weight: bold;
			line-height: 3.2;
			color: #FFF;
			text-align: center;
			vertical-align: middle;
		}
			.marketingArea > li h3 { margin: 0 10px 30px; }
			.marketingArea > li dl,
			.marketingArea > li p {
				margin: 0 10px 40px;
				font-size: 12px;
				line-height: 25px;
			}
.marketingArea > li dt { font-weight: bold; }
.marketingArea > li dd { margin: 0 0 5px; }
figure.exwrite img {
	width: 280px;
	margin: 0 0 50px;
}

*/
}
