@charset "UTF-8";

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





/*-----------------------------------------------------------------------------------------
1000 LAYOUT & PARTS
1001 PAGES TYPOGRAPHY RESET
1002 PAGES .page-title


3001 CONTACT
3002 ABOUT
3003 ARGENCY & SUPPORT (SERVICE)
3004 ARCHIVE
3005 SINGLE
3006 SINGLE-WORKS














----------------------------------------------------------------------------------------- */





/*-----------------------------------------------------------------------------------------
1000 LAYOUT & PARTS
----------------------------------------------------------------------------------------- */
.pages article {
	border-left: 0vw solid purple;
	padding: 0;
	margin: 0;
}

.single article {
	border-color: orange;
	padding: 5vw 0;
}

.archive article {
	border-color: olive;
	padding: 5vw 0;
}

.page .pages article {
	border-color: skyblue;
	padding: 10vw 0;
}

.page #agency.pages article,
.page #support.pages article {
	border-color: yellow;
	padding: 0 0 5vw 0;
}

.pages article .first {
	padding: 5vw 0;
	background: rgba(0, 255, 255, 0.1);
	display: none;
}

.pages article .second {
	padding: 5vw 0;
	background: rgba(255, 255, 0, 0.0);
}

.pages article .third {
	padding: 5vw 0;
	background: rgba(173, 255, 45, 0.0);
}

.pages article .arrow {
	font-size: 4vw;
	color: #FF8C00;
	background: -webkit-linear-gradient(90deg, #008875, rgba(0, 189, 162, 0.1));
	background: -webkit-linear-gradient(90deg, #31444e, rgba(49, 68, 78, 0.4));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-align: center;
	padding: 0;
	margin: 2vw 0;
}

.pages blockquote {
	border: 1px solid #008875;
	padding: 0;
	margin: 0;
	background: white;
}

#support.pages blockquote {
	border: 1px solid #007FE2;
	margin: 45px 0;
}


#support.pages ul li blockquote {
	border: none;
	margin: 0 0;
}

.pages .box {
	padding: 30px;
	overflow-x: hidden;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.pages article .arrow {
		font-size: 8vw;
	}

	#support.pages blockquote {
		margin: 30px 0;
	}

	.pages .box {
		padding: 15px;
	}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}







/*-----------------------------------------------------------------------------------------
1001 PAGES TYPOGRAPHY RESET
----------------------------------------------------------------------------------------- */
.pages h1,
.pages h2,
.pages h3,
.pages h4,
.pages h5,
.pages h6,
.pages p,
.pages th,
.pages td,
.pages em,
.pages small {
	font-size: 1.0rem;
	line-height: 1.3;
	padding: 0;
	margin: 0;
	letter-spacing: 0;
	font-weight: 400;
	font-style: normal;
	color: #31444e;
}

.pages li,
.pages dt,
.pages dd {
	font-size: 1.0rem;
	line-height: 1;
	letter-spacing: 0;
	font-weight: 400;
	font-style: normal;
	color: #31444e;
}

.pages p {
	line-height: 1.5;
	font-size: 1.4rem;
}

.pages b {
	color: #BE1864;
}

p.caution {
	-webkit-align-items : center;
	-ms-flex-align : center;
	align-items : center;
	display : -webkit-flex;
	display :-ms-flexbox;
	display : flex;
	-webkit-flex-wrap : wrap;
	-ms-flex-wrap : wrap;
	flex-wrap : wrap;
	padding:0;
	margin:0;
	line-height:1.3;
	letter-spacing:0.1em;
	text-indent:0.1em;
	border-top:1px solid #31444e;
	padding-top:15px;
	margin-top:15px
}

p.caution span{
}

p.caution i{
	font-size:2.0em;
	margin-right:0.1em;
	color:darkorange;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}




/*-----------------------------------------------------------------------------------------
1002 PAGES .page-title
----------------------------------------------------------------------------------------- */
.pages .page-title {
	padding: 5vw 0;
	margin: 0;
	background: linear-gradient(90deg, #00A6E6 0%, #007EE2 100%);
	display:block;
	width:100%;
	overflow-x:hidden;
	background:url(../img/works/bg-title.jpg);
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	padding:10vw 5vw;
}


.pages .page-title h2 {
	color: white;
	text-align: center;
	font-size: 6.0rem;
	line-height: 1.2;
	padding: 0;
	margin: 0;
	font-weight: 300;
	letter-spacing: 0.05em;
	text-indent: 0.05em;
}

.pages .page-title h2 em {
	display: block;
	color: inherit;
	text-align: inherit;
	font-size: inherit;
	line-height: inherit;
	padding: inherit;
	margin: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	text-indent: inherit;
	font-family: 'Roboto Condensed', sans-serif;
}

.pages .page-title h2 small {
	display: block;
	color: inherit;
	text-align: inherit;
	font-size: 0.3em;
	line-height: inherit;
	padding: inherit;
	margin: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	text-indent: inherit;
}




#about.pages .page-title {
	background:url(../img/about/bg-title.jpg);
	background-size:cover;
	background-position:bottom right;
	background-repeat:no-repeat;
	padding:10vw 5vw;
}


#agency.pages .page-title,
.term-agency .pages .page-title {
	background:url(../img/agency/bg-title.jpg);
	background-size:cover;
	background-position:top left;
	background-repeat:no-repeat;
	padding:10vw 5vw;
}

#support.pages .page-title,
.term-open .pages .page-title {
	background:url(../img/support/bg-title.jpg);
	background-size:cover;
	background-position:center left;
	background-repeat:no-repeat;
	padding:10vw 5vw;
}

#agency.pages .page-title h2,
#support.pages .page-title h2,
.term-agency .pages .page-title h2,
.term-open .pages .page-title h2	{
	text-align:left;
	color:#008875;
	font-weight:300;
	letter-spacing:0.3em;
	}
}

#agency.pages .page-title h2 small,
#support.pages .page-title h2 small,
.term-agency .pages .page-title h2 small,
.term-open .pages .page-title h2 small {
	font-size:0.45em;
	letter-spacing:0.4em;
}

#agency.pages .page-title p,
#support.pages .page-title p,
.term-agency .pages .page-title p,
.term-open .pages .page-title p {
	font-size:1.6rem;
	color:#008875;
	letter-spacing:0.1em;
	line-height:1.6;
	margin-top:0.5em;
}


#support.pages .page-title h2,
#support.pages .page-title p,
.term-open .pages .page-title h2,
.term-open .pages .page-title p	{
	color:#007FE2;
}





@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {
	.pages .page-title h2 {
		font-size: 8vw;
		letter-spacing: 0.1em
	}

	.pages .page-title h2 small {
		letter-spacing: 0.1em
	}

	#agency.pages .page-title h2,
	#support.pages .page-title h2,
	.term-agency .pages .page-title h2,
	.term-open .pages .page-title h2 {
		letter-spacing: 0.1em;
	}

	#agency.pages .page-title h2 small,
	#support.pages .page-title h2 small,
	.term-agency .pages .page-title h2 small,
	.term-open .pages .page-title h2 small {
		letter-spacing: 0.2em;
	}

	#agency.pages .page-title p,
	#support.pages .page-title p,
	.term-agency .pages .page-title p,
	.term-open .pages .page-title p {
		font-size: 1.8vw;
	}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {

	#agency.pages .page-title p,
	#support.pages .page-title p,,
	.term-agency .pages .page-title p,
	.term-open .pages .page-title p {
		font-size: 1.3rem;
	}
}

@media screen and (max-width: 375px) {}





/*-----------------------------------------------------------------------------------------
3001 CONTACT
----------------------------------------------------------------------------------------- */
#form table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
}

#form table th,
#form table td {
	width: 33.33333%;
	margin: 0;
	font-size: 18px;
	line-height: 1.4;
	padding: 1em 1.5em;
	background: white;
	border: 1px solid #ccc;
	text-align: left;
	vertical-align: middle;
	color: #31444e;
	position: relative
}

#form table th {
	background: rgba(49, 68, 78, 0.1);
	letter-spacing: 0.1em;
}

#form table td {
	width: 66.66666%;
	background: #fff;
}

#form table th span {
	color: white;
	font-size: 0.45em;
	vertical-align: top;
	margin-lefT: 0.4em;
	background: rgba(0, 166, 230, 0.7);
	padding: 2px 5px;
	border-radius: 2px;
}

#form table b {
	font-weight: Bold;
	font-size: 1.3em;
}

#form span.mwform-tel-field {
	font-size: 2em;
	line-height: 1;
	margin-top: 0;
	display: block;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {

	#form table th,
	#form table td {
		width: 100%;
		display: block;
		border: none;
		padding: 1em;
		font-size: 14px;
	}

	#form table th {
		font-weight: bold;
	}

	#form table td {
		width: 100%;
		padding-top: 1.5em;
		padding-bottom: 1.5em;
		border: 1px solid #ddd;
	}

	#form table th span {
		font-size: 0.6em;
	}

	#form table th br {
		display: none;
	}

}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





/*-----------------------------------------------------------------------------------------
3002 ABOUT
----------------------------------------------------------------------------------------- */
#about table {
	border: 0px solid red;
	width: 100%;
	margin: 0;
}

#about table th,
#about table td {
	padding: 0.75em 2.75em;
	border: none;
	border-top: 2px solid white;
	/* background:transparent; */
	text-align: left;
	line-height: 1.8;
	font-size: 1.6rem;
	width: auto;
	vertical-align: middle;
}

#about table th {
	width: 25%;
	font-weight: 400;
	letter-spacing: 0.1em;
	background: #007EE3;
	background: rgba(221, 221, 221, 0.8);
	/* color: white; */
}

#about table td {
	width: 75%;
	letter-spacing: 0.1em;
	background: rgba(0, 126, 227, 0.1);
	background: rgba(234, 236, 237, 0.5);
}

#about table tr:first-child th {
	border-top: 15px solid #dddddd;
}

#about table tr:first-child td {
	border-top: 15px solid rgba(221, 221, 221, 0.6);
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen (max-width: 768px) {

	#about table th,
	#about table td {
		padding: 0.75em 0.75em;
		line-height: 1.4;
		font-size: 1.4rem;
	}
}

@media screen and (max-width: 520px) {

	#about table th,
	#about table td {
		width: 100%;
		border: none;
		padding: 1em;
	}

	#about table th {
		font-size: 1.6rem;
		background: #ccc;
		padding-top: 0.5em;
		padding-bottom: 0.5em;
		/* background: linear-gradient(90deg, #00A6E6 0%, #007EE2 100%); */
	}

	#about table td {
		border-bottom: 2em solid white;
	}

	#about table tr:first-child th,
	#about table tr:first-child td {
		border-top: none;
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





/*-----------------------------------------------------------------------------------------
3003 ARGENCY & SUPPORT (SERVICE)
----------------------------------------------------------------------------------------- */
.pages.service article h2 {
	font-size: 4rem;
	background: url(../img/agency/bg-midashi-1.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	color: white;
	text-align: left;
	text-shadow: -1px -1px 3px #008875;
	border-top: 8px solid #008875;
	letter-spacing: 0.1em;
	border-radius: 0;
	padding: 1em 0.75em;
	margin: 0;
	letter-spacing: 0.1em;
}

.pages.service article h2 small {
	display: block;
	font-size: 0.6em;
	letter-spacing: 0.4em;
	color: inherit;
	margin: 0.1em 0;
}

.pages.service article h3 {
	font-size: 1.8rem;
	text-align: left;
	font-style: normal;
	line-height: 2;
	letter-spacing: 0.2em;
}

.pages.service article h3.force {
	text-align: center;
	letter-spacing: 0;
}

.pages.service article h4 {
	font-size: 2.4rem;
	display: block;
	padding: 0;
	margin: 1.5em 0;
	text-align: center;
}

.pages.service article h5 {
	font-size: 4rem;
	display: block;
	padding: 0;
	margin: 0 0 2em 0;
	text-align: center;
	position: relative
}

.pages.service article h5::after {
	content: '';
	position: absolute;
	bottom: -40px;
	left: 50%;
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
	width: 150px;
	height: 5px;
	border-radius: 5px;
	background: #31444e;
}

.pages.service article h6 {
	font-size: 2.0rem;
	letter-spacing: 1em;
	text-indent: 1em;
	text-align: center;
	padding: 0;
	margin: 30px 0 0 0;
	color: #008875;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.pages.service article h2 {
		font-size: 5vw;
		border-top: 6px solid #008875;
		padding: 0.5em;
		letter-spacing: 0;
	}

	.pages.service article h2 small {
		letter-spacing: 0.2em;
	}

	.pages.service article h3 {
		font-size: 1.4rem;
		line-height: 1.8;
		letter-spacing: 0.1em;
	}

	.pages.service article h3.force {
		text-align: left;
		padding: 10px;
	}

	.pages.service article h4 {
		font-size: 3.3vw;
		padding: 0 1em;
		margin: 1.5em 0;
		text-align: left;
	}

	.pages.service article h5 {
		font-size: 5vw;
	}

	.pages.service article h5::after {
		bottom: -30px;
		width: 90px;
		height: 4px;
	}

	.pages.service article h6 {
		font-size: 3vw;
		letter-spacing: .5em;
		text-indent: 0.5em;
	}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {



	.pages.service article h4 {
		font-size: 5.2vw;
	}

	.pages.service article h5 {
		font-size: 6vw;
	}

	.pages.service article h5::after {
		bottom: -20px;
	}

	.pages.service article h6 {
		font-size: 4.5vw;
	}
}

@media screen and (max-width: 375px) {}





#support.pages.service article h4,
#support.pages.service article h5,
#support.pages.service article h6 {
	font-size: 2.0rem;
	text-align: left;
	line-height: 1.3;
	padding: 0;
	margin: 0;
	letter-spacing: 0;
}

#support.pages.service article h5:after {
	display: none;
}

#support.pages.service article h2 {
	border-color: #007FE2;
	background: url(../img/support/bg-midashi-1.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: right bottom;
	position: relative
}

#support.pages.service article h3 {}

#support.pages.service article h4 {
	font-size: 2.4rem;
	letter-spacing: 0.2em;
	margin-bottom: 0.75em;
	font-weight: 400;
}

#support.pages.service article h5 {
	font-size: 1.8rem;
	background: rgba(204, 231, 245, 0.4);
	display: block;
	text-align: center;
	padding: 0.4em;
	font-weight: 400;
	letter-spacing: 0;
	margin-bottom: 0.75em;
}

#support.pages.service article h6 {
	font-size: 2.4rem;
	background: black;
	color: White;
	display: block;
	text-align: left;
	padding: 0.5em 1em;
	margin: 0;
	font-weight: 400;
	letter-spacing: 0.1em;
	text-indent: 0;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

#support.pages.service article h6 span {
	font-weight: 400;
	color: inherit
}

#support.pages.service article h6 small {
	font-weight: 400;
	color: inherit;
	font-size: 0.6em;
	margin-left: 0.75em;
}

#agency.pages.service article h3 {
	font-size: 3rem;
	letter-spacing: 0.1em;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	#support.pages.service article h4 {
		font-size: 2.1rem;
		font-weight: 600;
	}

	#support.pages.service article h5 {
		font-size: 1.6rem;
		font-weight: 600;
	}

	#support.pages.service article h6 {
		font-size: 2.0rem;
	}

	#agency.pages.service article h3 {
		font-size: 2rem;
	}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





.pages article .anshin {
	font-size: 3.6rem;
	display: block;
	padding: 0;
	margin: 0 0 0.5em 0;
}

.pages article .anshin dl {
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 10px;
	margin: 0;
	background: #be1864;
	font-size: 2.4rem;
}

.pages article .anshin dl dt {
	background: white;
	color: #be1864;
	font-weight: 600;
	padding: 0.75em 2em;
	position: relative;
	font-size: inherit
}

.pages article .anshin dl dt::after {
	content: '';
	position: absolute;
	top: 50%;
	right: -15px;
	-webkit-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
	border-left: 15px solid white;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
}

.pages article .anshin dl dd {
	color: white;
	padding-left: 1.5em;
	letter-spacing: 0.1em;
	font-size: inherit
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.pages article .anshin dl {
		font-size: 2.75vw;
	}

	.pages article .anshin dl dt {
		width: 100%;
		text-align: center;
	}

	.pages article .anshin dl dt::after {
		top: 100%;
		right: 50%;
		-webkit-transform: translate(50%, 0%);
		transform: translate(50%, 0%);
		border-right: 10px solid transparent;
		border-left: 10px solid transparent;
		border-top: 10px solid white;
		border-bottom: 10px solid transparent;
	}

	.pages article .anshin dl dd {
		padding: 1.25em 0 0.5em;
		text-align: center;
		width: 100%
	}

}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





ul.list {
	background: transparent;
	padding: 30px;
	margin: 0;
	width: 100%;
}

ul.list li {
	width: 50%;
	padding: 5px;
}

ul.list li.last {
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	font-size: 1.6rem;
	padding: 5px 15px;
	color: #008875;
	font-weight: 600;
	letter-spacing: 0.2em;

}

ul.list li dl {
	border: 1px solid #00bda2;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 2px;
	margin: 0;
	height: auto;
	background: white;
}

ul.list li dl dt {
	background: linear-gradient(135deg, #00bda2 0%, #008875 100%);
	font-size: 3rem;
	color: white;
	font-family: 'Caveat', sans-serif;
	font-family: 'Oswald', sans-serif;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	line-height: 5rem;
	padding: 0;
	font-style: italic;
	width: 5rem;
	height: 5rem;
	text-align: center;
}

ul.list li dl dd {
	padding: 0;
	padding-left: 1em;
	font-size: 1.6rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	background: rgba(0, 136, 117, 0.1);
	display: block;
	width: calc(100% - 5rem);
	height: 5rem;
	line-height: 5rem;
	color: #008875;
	color: #31444e;
	font-weight: 400;
}

.third ul.list li {
	width: 33.33333%;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	ul.list {
		padding: 15px;
	}

	ul.list li {
		width: 100%;
	}

	ul.list li dl dt {
		font-size: 2rem;
	}

	ul.list li dl dd {
		font-size: 1.4rem;
	}

	.third ul.list li {
		width: 100%;
	}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {
	ul.list li dl dd {
		letter-spacing: 0;
	}
}

@media screen and (max-width: 375px) {}





ul.resolution {
	padding: 0;
	margin: 0;
	width: 100%;
}

ul.resolution li {
	width: 20%;
	padding: 10px;
	border: 0px solid black;
}

ul.resolution li dl {
	width: 100%;
	padding: 0;
	padding-bottom: 100%;
	position: relative;
	overflow: hidden;
	background: white;
	background: linear-gradient(90deg, #00A6E6 0%, #007EE2 100%);
	background: linear-gradient(135deg, rgba(0, 189, 162, 0.9) 0%, rgba(0, 136, 117, 0.9) 100%);
	border-radius: 50%;
}

ul.resolution li dl dt {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-90%, -55%);
	transform: translate(-90%, -55%);
	font-size: 21rem;
	font-family: 'Caveat', sans-serif;
	font-style: italic;
	color: rgba(255, 255, 255, 0.2);
}

ul.resolution li dl dd {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
	font-size: 2.0rem;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
	width: 80%;
	color: white;
	text-shadow: -1px -1px 2px rgba(0, 40, 68, 0.5);
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	ul.resolution li {
		width: 33.33333%;
	}

	ul.resolution li dl dt {
		font-size: 30vw;
	}

	ul.resolution li dl dd {
		font-size: 2.8vw;
	}
}

@media screen and (max-width: 520px) {
	ul.resolution li {
		width: 50%;
	}

	ul.resolution li dl dd {
		font-size: 4vw;
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





ul.force 	{
	border:0px solid red;
	margin:0;
	width:100%;
}

ul.force blockquote {
	border:none;
	background:#eee;
	height:100%;
}

ul.force li {
	width:50%;
	padding:10px;
	border:0px solid black;
}

ul.force li ol {
	padding:0 25px;
}

ul.force li ol li{
	width:100%;
	border-bottom:1px solid white;
	font-size:1.6rem;
	padding:0.75em 0 ;
	margin:0 0 0 0;
	list-style:none;
	line-height:1.4;
	letter-spacing:0.1em;
}

ul.force li ol li::before {
	content: '\f00c';
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right: 0.4em;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	ul.force li {
		width:100%;
		padding:5x;
	}

	ul.force li ol {
		padding:0 25px;
	}

	ul.force li ol li{
		width:100%;
		font-size:1.4rem;
	}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





ul.flow {
	border: 0px solid red;
	padding: 30px;
	margin: 0;
	width: 100%;
}

ul.flow li {
	border: 0px solid red;
	position: relative;
	padding: 0;
	margin: 0 0 3.0rem 0;
	width: 100%;
}

ul.flow li::after {
	content: '';
	position: absolute;
	bottom: -30px;
	left: 50%;
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
	border-top: 30px solid rgba(204, 231, 245, 0.4);
	border-left: 30px solid transparent;
	border-right: 30px solid transparent;
}

ul.flow li:last-child::after {
	display: none;
}

ul.flow li .number {
	font-size: 4.0rem;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-style: italic;
	width: 7.0rem;
	height: 7.0rem;
	line-height: 7.0rem;
	background: black;
	background: linear-gradient(90deg, #00A6E6 0%, #007EE2 100%);
	color: white;
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	top: -1.0rem;
	left: -1.0rem;
	border-radius: 50%;
}

ul.flow li dl {
	border: 0px solid blue;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	background: rgba(204, 231, 245, 0.4);
	padding: 30px;
}

ul.flow li dl dt,
ul.flow li dl dd {
	width: 66.66666%;
}

ul.flow li dl dt {
	padding: 30px;
	border: 3px solid white;
}

ul.flow li dl dd {
	width: 33.33333%;
	background: white;
	border-radius: 1px;
	padding: 30px;
}

.eyecatch {
	margin: 10px 0;
}

.eyecatch span,
.eyecatch div {
	width: 42%;
	background: rgba(204, 231, 245, 0.4);
	-webkit-justify-content: center;
	-ms-flex-pack: justify;
	justify-content: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	font-size: 1.4rem;
	line-height: 1.3;
	padding: 10px;
	color: #BE1864;
	letter-spacing: 0.2em;
	text-align: center;
}

.eyecatch span b {
	font-size: 1.4em;
	display: block;
	font-weight: 400;
}

.eyecatch div {
	width: 14%;
	font-size: 3rem;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	ul.flow {
		padding: 20px;
	}

	ul.flow li {
		margin-bottom: 2.0rem;
	}

	ul.flow li::after {
		bottom: -20px;
		border-top: 20px solid rgba(204, 231, 245, 0.4);
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
	}

	ul.flow li .number {
		font-size: 3.0rem;
		width: 5.0rem;
		height: 5.0rem;
		line-height: 5.0rem;
		top: -0.75rem;
		left: -.75rem;
	}

	ul.flow li dl {
		border: 0px solid blue;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		background: rgba(204, 231, 245, 0.4);
		padding: 15px;
	}

	ul.flow li dl dt,
	ul.flow li dl dd {
		width: 100%;
	}

	ul.flow li dl dt {
		padding: 30px 15px;
		border: 2px solid white;
	}

	ul.flow li dl dd {
		width: 100%;
		padding: 15px;
	}

	.eyecatch span,
	.eyecatch div {
		font-size: 1.3rem;
	}

	.eyecatch span b {
		font-size: 1.3em;
	}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





#support.pages.service article ul.force li:nth-child(1) h6 {
	background:#2b91d3;
	background: linear-gradient(90deg, #00A6E6 0%, #007EE2 100%);

}

#support.pages.service article ul.force li:nth-child(2) h6 {
	background:#2dc6b6;
	background: linear-gradient(90deg, #2dc6b6 0%, #19bcab 100%);

}

#support.pages.service article ul.force li:nth-child(3) h6 {
	background:#ffcc00;
	background: linear-gradient(90deg, #ffcc00 0%, #ffb200 100%);

}

#support.pages.service article ul.force li:nth-child(4) h6 {
	background:#f680a7;
	background: linear-gradient(90deg, #f680a7 0%, #fb4d86 100%);

}

ul.force li:nth-child(1) blockquote	{
	background:rgba(207, 233, 230, 0.6);
}

ul.force li:nth-child(2) blockquote	{
	background:rgba(202, 230, 202, 0.6);
}

ul.force li:nth-child(3) blockquote	{
	background:rgba(254, 232, 144, 0.6);
}

ul.force li:nth-child(4) blockquote	{
	background:rgba(249, 189, 209, 0.6);
}
















.pages.service .area-works {
	padding:0;
}



.pages.service .area-works .box ul.works-list {
	border:0px solid red;
	width:100%;
	display:block;
}

.pages.service .area-works .box ul.works-list li {
	border-bottom:1px solid #ddd;
	width:100%;
	padding:15px 0;
	margin:0;
}

.pages.service .area-works .box ul.works-list li:first-child {
	border-top:1px solid #ddd;
}


.pages.service .area-works .box ul.works-list li dl {
	width:100%;
	padding: 0;
	margin:0;
}

.pages.service .area-works .box ul.works-list li dl dt,
.pages.service .area-works .box ul.works-list li dl dd {
	display:block;
	width:17.5%;
	padding:0;
	margin:0;
}

.pages.service .area-works .box ul.works-list li dl dd {
	width:82.5%;
	padding-left:30px;
}

#support.pages.service article .area-works h5,
#agency.pages.service article .area-works h5 {
	background:none;
	text-align:left;
	padding:0;
	margin:0 0 0.5em;
	font-weight:600;
	font-size:2.0rem;
}

#agency.pages.service article .area-works h5::after {
	display:none;
}

#support.pages .area-works blockquote,
#agency.pages .area-works blockquote {
	margin:0;
}


@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
.pages.service .area-works .box ul.works-list li dl dt {	display:block;
	width:33.33333%;
}

.pages.service .area-works .box ul.works-list li dl dd {
	width:66.66666%;
	padding-left:15px;
}

}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}







/*-----------------------------------------------------------------------------------------
3004 ARCHIVE
----------------------------------------------------------------------------------------- */
.archive article dl {
	border-bottom: 1px solid #ddd;
	padding: 15px 0;
}

.archive article dl dt,
.archive article dl dd {
	border: 0px solid green;
	width: 25%;
	padding: 0;
	margin: 0;
}

.archive article dl dd {
	width: 75%;
	padding-left: 30px;
}

.archive .pages article h3 {
	font-size: 2.1rem;
	line-height: 1.2;
	font-weight: 600;
}

.archive .pages article time {
	background: #31444e;
	color: white;
	font-size: 1.2rem;
	display: block;
	width: 10em;
	padding: 0.25em 1em;
	margin: 0.75em 0;
	text-align: center;
}

.archive .pages article p {
	font-size: 1.6rem;
	line-height: 1.5;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.archive article dl {
		padding: 30px 0;
	}
}

@media screen and (max-width: 520px) {
	.archive article dl dd {
		padding-left: 15px;
	}

}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}





/*-----------------------------------------------------------------------------------------
3005 SINGLE
----------------------------------------------------------------------------------------- */
.single article h1,
.single article h2,
.single article h3,
.single article h4,
.single article h5,
.single article h6,
.single article p,
.single article dt,
.single article dd,
.single article li {
	font-size: 1rem;
	line-height: 1;
	letter-spacing: 0;
	font-weight: 400;
	color: #31444e;
	text-align: left;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Yu Gothic", sans-serif;
	border: none;
}

.single article a {
	text-decoration: underline;
	color: #0089CE;
}

.single article strong {
	font-weight: 600 !important;
	color: inherit;
}

.single article time {
	text-align: right;
	padding: 0;
	margin: 30px 0;
	display: block;
}

.single article time span {
	display: inline-block;
	font-size: 1.4rem;
	line-height: 1.3;
	padding: 0;
	margin: 0.25em;
	;
}

.single article h1 {
	font-size: 3.2rem;
	font-weight: 500;
	line-height: 1.2;
	padding: 0;
	margin: 1em 0;
}


.single article h2 {
	font-size: 2.4rem;
	line-height: 1.3;
	padding: 0;
	margin: 1em 0;
	font-weight: 600;
}

.single article .title h2 {
	font-size: 4.0rem;
	padding: 0;
	margin: 0;
}

.single article h3 {
	font-size: 2.4rem;
	line-height: 1.3;
	padding: 0;
	margin: 1em 0;
}

.single article h3::after {
	display: none;
}

.single article h4 {
	font-size: 2.4rem;
	line-height: 1.3;
	padding: 0;
	margin: 1em 0;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.single article h5 {
	font-size: 1.8rem;
	line-height: 1.5;
	padding: 0;
	margin: 1em 0;
	font-weight: 600;
}

.single article h6 {
	font-size: 1.8rem;
	line-height: 1.5;
	padding: 0;
	margin: 1em 0;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.single article p {
	font-size: 1.6rem;
	line-height: 1.9;
	padding: 0;
	margin: 0.75em 0;
}

.single article ul,
.single article ol {
	padding: 0 0 0 2.4em;
	margin: 3.0rem 0;
}

.single article ul li,
.single article ol li {
	list-style-type: disc;
	list-style-position: outside;
	font-size: 1.6rem;
	line-height: 1.5;
	padding: 0;
	margin: 1em 0;
}

.single article ol li {
	list-style-type: decimal;
}

.single article blockquote {
	border: 4px solid #f7f7f7;
	background: #fcfcfc;
	padding: 45px;
	margin: 30px 0;
}

.single article blockquote p {
	opacity: 0.8;
	font-style: italic;
	margin: 1em 0;
}

.single article blockquote p:last-child {
	margin-bottom: 0;
}

.single article pre {
	position: static;
	font-size: 1.6rem;
	color: #31444e;
	background: #f7f7f7;
	padding: 1.5em 0.5em;
	margin: 1em 0;
	width: 100%;
	overflow: auto;
	border-right: 1em solid #eee;
	border-left: 1em solid #eee;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}

.single article hr {
	margin: 6rem 0;
	clear: both;
}

.single article img {
	width: auto;
	max-width: 100%;
	height: auto;
	padding: 0;
	margin: 5px 0;
}

.single article img.size-thumbnail {}

.single article img.size-medium {}

.single article img.size-large {}

.single article img.size-full {}

.single article img.alignleft {
	float: left;
	margin: 15px 15px 15px 0 !important;
	clear: both;
}

.single article img.alignright {
	float: right;
	margin: 15px 0 15px 15px !important;
	clear: both;
}

.single article img.aligncenter {
	margin: 15px auto !important;
	clear: both;
}

.single article .wp-caption {
	border: 0px solid green;
	display: block;
	width: 100% !important;
}

.single article .wp-caption-text {
	background: white;
	display: block;
	font-size: 1.4rem;
	line-height: 1.4;
	padding: 0.5em 0;
	margin: 1em 0 2em;
	text-align: center;
	color: #999;
}


@media screen and (max-width: 1200px) {}

@media screen and (max-width: 768px) {
	.single article .title h2 {
		font-size: 4rem;
	}

	.single article blockquote {
		padding: 30px;
		margin: 15px 0;
	}

	.single article img.alignleft {
		margin: 10px 10px 10px 0 !important;
	}

	.single article img.alignright {
		margin: 10px 0 10px 10px !important;
	}

	.single article img.aligncenter {
		margin: 10px auto !important;
	}


}

@media screen and (max-width: 520px) {
	.single article .title h2 {
		font-size: 3rem;
	}

	.single article blockquote {
		padding: 20px;
		margin: 10px 0;
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}














/*-----------------------------------------------------------------------------------------
3006 SINGLE-WORKS
----------------------------------------------------------------------------------------- */
.single-works article ul.gallery {
	border: 0px solid red;
	width: 100%;
	-webkit-justify-content: center;
	-ms-flex-pack: justify;
	justify-content: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 0;
	margin: 0;
}

.single-works article ul.gallery li {
	list-style-type: none !important;
	border: 0px solid black;
	width: 33.33333%;
	padding: 1px;
	margin: 0;
}

.single-works article ul.gallery li:first-child {
	width: 100%;
}

.single-works article ul.gallery li a {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	border: 0px solid green;
	display: block;
}

.single-works article ul.gallery li a img {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width:100%;
	height:auto;
	display:block;
}

.single-works article h5	{
	font-size:2.7rem;
}

.single-works article p {
	margin:0;
	line-height:1.6;
	font-size:1.6rem;
}

.single-works article p.tel a::before,
.single-works article p.url a::before	{
content: '\f0a9';
font-family: "Font Awesome 5 Free";
font-weight: 900;
margin-right: 0.25em;
}

.single-works article p.tel a::before{
	content:'\f87b'
}

.single-works .comment {
	background:#f9f9f9;
	padding:30px;
	margin:30px 0;
}

.single-works .comment p {
	line-height:1.9;
}

.single-works article a{
	text-decoration:none;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
.single-works .comment {
	padding:15px;
	margin:15px 0;
}
}

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}


