@charset "UTF-8";

/* ==============================================
  reset
============================================== */
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,a,small, strong, sub, sup, var,
b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,article, aside, dialog, figure, footer, header,menu, nav, section,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	box-sizing: border-box;
}

html {
	overflow: auto;
	font-size: 62.5%;
	letter-spacing: 0.025em;
}

body {
	font-family: kozuka-gothic-pr6n, sans-serif;
	line-height: 1;
	color: #000;
	min-width: 100%;
	-webkit-text-size-adjust: 100%;
	overflow: hidden;
	font-weight: 400;
	word-break: break-strict;
	word-wrap: break-word;
	line-break: strict;
	background: #fff;
}

/* IE11フォント対策 */
@media all and (-ms-high-contrast:none) {
	body {
		font-family: 'Meiryo', 'メイリオ', 'ＭＳ Ｐゴシック', sans-serif;
	}
}

h1, h2, h3, h4, h5, h6, small, dt, dd, li {
	line-height: 1.4;
}

p {
	line-height: 1.75;
}

article, aside, dialog, figure, footer, header,hgroup, nav, section {
	display: block;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

ins {
	background-color: #ff9;
	color: #fff;
	text-decoration: none;
}

mark {
	background-color: #ff9;
	color: #fff;
	font-style: italic;
	font-weight: 700;
}

main {
	display: block;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom: 1px dotted #fff;
	cursor: help;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

input, select {
	vertical-align: middle;
}

input[type="text"],
input[type="radio"],
input[type="checkbox"],
input[type="password"], textarea, select {
	outline: none;
}

input[type="submit"]{
	-webkit-appearance: none;
	border-radius: 0;
	border: none;
}

img {
	max-width: 100%;
	vertical-align: bottom;
	height: auto;
}

table {
	width: 100%;
}

ul {
	letter-spacing: -0.5em;
}

li {
	letter-spacing: normal;
	list-style: none;
}

a,a:focus,
*:focus {
	outline: none;
}

a {
	display: inline-block;
	margin: 0;
	padding: 0;
	border: 0;
	color: #000;
	vertical-align: baseline;
	text-decoration: none;
	transition: opacity .2s ease-in-out;
}


/* ==============================================
  web font ちらつき防止
============================================== */
html {
	visibility: hidden;
}

html.wf-active,
html.loading-delay,
html.is-visible {
	visibility: visible;
}

iframe * {
	visibility: visible;
}

/* ==============================================
  common
============================================== */
.pc_only {
	display: inline-block;
}

.sp_only {
	display: none;
}

.inner {
	position: relative;
	max-width: 960px;
	margin: 0 auto;
}

.inner2 {
	position: relative;
	max-width: 860px;
	margin: 0 auto;
}

.clearfix:after {
	content: '';
	display: block;
	clear: both;
}

.hidden {
	text-indent: 101%;
	white-space: nowrap;
	overflow: hidden;
}

.indent {
	padding-left: 1em;
	text-indent: -1em;
}

.text-right {
	text-align: right;
}

.font_small {
	font-size: 70%;
}

/**
  color
*/
.cl-lblue {
	color: #3fa9f5;
}

.cl-brown {
	color: #c69c6d;
}

/**
  bg
*/
.bg-image {
	position: absolute;
	z-index: -1;
}

.bg-image01 {
	width: 998px;
	height: 659px;
}

.bg-image02 {
	width: 703px;
	height: 757px;
}

.bg-image03 {
	width: 1065px;
	height: 622px;
}

.bg-image04 {
	width: 1039px;
	height: 577px;
}

/**
  work-images
*/
.work-images-block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	margin-bottom: 130px;
}

.work-images-box {
	width: 49%;
	text-align: center;
}

.work-images-heding {
	font-family: athelas, serif;
	font-style: italic;
	font-size: 3.0rem;
	font-weight: 400;
	letter-spacing: 0.025em;
}

.work-images {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
}

.work-images img {
	display: inline-block;
	margin: 0 10px 20px;
}

@media screen and (max-width: 1000px) {
	.inner {
		margin: 0 20px;
	}

	.work-images img {
		width: 21vw;
		height: auto;
		margin: 0 0.8vw 2vw;
	}
}

@media screen and (max-width: 767px) {
	.pc-only {
		display: none;
	}

	.sp-only {
		display: inline-block;
	}

	.inner {
		margin: 0 15px;
	}

	.inner2 {
		margin: 0 5px;
	}

	/**
		bg
	*/

	.bg-image01 {
		width: 130.12vw;
		height: 85.92vw;
	}

	.bg-image02 {
		width: 91.66vw;
		height: 98.70vw;
	}

	.bg-image03 {
		width: 138.85vw;
		height: 81.10vw;
	}

	.bg-image04 {
		width: 135.46vw;
		height: 75.23vw;
	}

	/**
		work-images
	*/
	.work-images-block {
		display: block;
		margin-bottom: 40px;
	}

	.work-images-box {
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}

	.work-images-heding {
		font-size: 2.6rem;
	}

	.work-images {
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		justify-content: center;
	}

	.work-images img {
		display: inline-block;
		width: calc(50% - 10px);
		max-width: 210px;
		margin: 0 5px 10px;
	}
}


/* ==============================================
  header
============================================== */
#header {
	position: absolute;
	width: 100%;
	padding-top: 60px;
	height: 118px;
	z-index: 100;
}

.header-logo {
	float: left;
}

.header-menu {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	float: right;
}

.header-nav {
/*	padding-top: 28px;*/
}

.header-nav.is-open {
	position: fixed;
	display: block;
	top: 5px;
	right: 70px;
	background: rgba(51, 51, 51, 0.96);
	transition: all .4s;
}

.header-nav-list {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
}

.header-nav.is-open .header-nav-list {
	padding: 1.5em 3em 1.5em 0;
}

.header-nav-list li {
	margin-left: 3em;
}

.header-nav-list li a {
	position: relative;
	font-size: 1.8rem;
	font-weight: 700;
	color: #666;
}

.header-nav.is-open .header-nav-list li a {
	color: #fff;
}

.header-nav-list li a::after {
	position: absolute;
	left: 0;
	bottom: -4px;
	content: '';
	width: 100%;
	height: 2px;
	background: #728fff;
	background: -moz-linear-gradient(left, #728fff 1%, #ffcbfc 100%);
	background: -webkit-linear-gradient(left, #728fff 1%, #ffcbfc 100%);
	background: linear-gradient(to right, #728fff 1%, #ffcbfc 100%);
	transform: scale(0, 1);
	transform-origin: right top;
	transition: transform .3s;
}

.header-nav-list li a:hover::after,
.header-nav-list li a.is-current::after {
	transform-origin: left top;
	transform: scale(1, 1);
}

.header-nav.is-open .header-nav-list li a.is-current::after {
	opacity: 0;
}

.hamburger-menu {
	position: relative;
	display: none;
	width: 40px;
	height: 30px;
	margin-left: 30px;
	transition: all .4s;
}

.hamburger-menu.is-fixed,
.is-fsc-fixed {
	position: fixed;
	top: 20px;
	right: 20px;
	display: inline-block;
}

.hamburger-menu span {
	position: absolute;
	left: 10%;
	display: inline-block;
	width: 100%;
	height: 2px;
	background-color: #333;
	transition: all .4s;
}

.hamburger-menu span:nth-of-type(1) {
	top: 0;
}

.hamburger-menu span:nth-of-type(2) {
	top: 14px;
}

.hamburger-menu span:nth-of-type(3) {
	bottom: 0;
}

.hamburger-menu span:nth-of-type(2)::after {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 2px;
	background-color: #333;
	transition: all .4s;
}

.hamburger-menu.is-active span:nth-of-type(1) {
	transform: translateY(20px) scale(0);
}

.hamburger-menu.is-active span:nth-of-type(2) {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.hamburger-menu.is-active span:nth-of-type(2)::after {
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}

.hamburger-menu.is-active span:nth-of-type(3) {
	transform: translateY(-20px) scale(0);
}

@media screen and (min-width: 768px) {
	#header.is-fsc-adjest {
		padding-top: 15px;
		height: auto;
		background: transparent;
	}

	#header.is-fsc-adjest .header-logo {
		clear: both;
	}

	#header.is-fsc-adjest .header-logo img {
		width: 120px;
		height: 34px;
	}

	#header.is-fsc-adjest .header-nav {
		display: none;
	}

	#header.is-fsc-adjest .header-nav.is-open {
		display: block;
	}
}

@media screen and (max-width: 767px) {
	#header {
		padding-top: 15px;
		height: auto;
		background: transparent;
	}

	#header.is-fixed {
		position: fixed;
		height: 64px;
		background: #fff;
	}

	.header-logo {
		clear: both;
	}

	.header-logo img {
		width: 120px;
		height: 34px;
	}

	.header-nav {
		display: none;
	}

	.header-nav.is-open {
		position: fixed;
		display: block;
		top: 64px;
		right: 0;
		width: 100%;
		height: 100%;
		background: rgba(51, 51, 51, 0.96);
		z-index: 100;
	}

	.header-nav-list {
		display: block;
	}

	.header-nav.is-open .header-nav-list {
		padding: 1.5em 2em;
	}

	.header-nav-list li {
		margin-left: 0;
	}

	.header-nav-list li a {
		display: block;
		margin: 0.5em 0 0;
		padding: 0.5em 1em 0.75em;
		color: #fff;
		border-bottom: 1px solid #666;
	}

	.header-nav-list li a:hover::after,
	.header-nav-list li a.is-current::after {
		transform: scale(0, 1);
	}

	.hamburger-menu {
		position: fixed;
		top: 15px;
		right: 15px;
		display: inline-block;
		padding: 10px;
		margin-left: 0;
	}

	.hamburger-menu span {
		width: 80%;
	}

	.hamburger-menu span:nth-of-type(1) {
		top: 4px;
	}

	.hamburger-menu span:nth-of-type(3) {
		bottom: 4px;
	}
}


/* ==============================================
  footer
============================================== */
#footer {
	padding: 5px 0;
	color: #fff;
	text-align: center;
	background: #000;
}

#go-top {
	display: none;
	position: fixed;
	right: 10px;
	bottom: 10px;
	width: 30px;
	height: 30px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
	background: #000;
	z-index: 100;
	transition: .2s ease-in-out;
}

#go-top::after {
	position: absolute;
	top: 50%;
	left: 50%;
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 5px 8px 5px;
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	border-color: transparent transparent #fff transparent;
}

@media screen and (max-width: 767px) {
	#footer .inner {
		margin: 0 5px;
	}
}


/* ==============================================
  top
============================================== */
.top-content-box {
	position: relative;
	height: 100vh;
}

.top-content-heding {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 2;
}

.top-content-heding01 {
	right: 20px;
	width: 159px;
	height: 366px;
	margin-top: -10vh;
}

.top-content-heding02 {
	left: 40px;
	width: 164px;
	height: 572px;
	margin-top: -6vh;
}

.top-content-heding03 {
	right: 20px;
	width: 140px;
	height: 281px;
	margin-top: -12vh;
}

.top-heding-img {
	position: absolute;
	display: inline-block;
	opacity: 0;
}

.heding-anime1-1,
.heding-anime1-3,
.heding-anime2-1,
.heding-anime2-3,
.heding-anime3-1,
.heding-anime3-3 {
	-webkit-transform: translateY(-20px);
	transform: translateY(-20px);
}

.is-fsc-adjest {
	margin-top: 0;
	max-height: 90vh;
}

.is-fsc-adjest img {
	width: auto;
	max-height: 90vh;
}

/* IE11画像の高さ対策 */
@media all and (-ms-high-contrast:none) {
/*
	.is-fsc-adjest img {
		height: 90vh;
	}
*/
}

.top-content-inBox {
	position: absolute;
	bottom: 60px;
	display: table;
	z-index: 2;
}

.top-content-inBox-left {
	left: 20px;
}

.top-content-inBox-right {
	right: 20px;
}

.top-content-subHeding-en {
	position: relative;
	opacity: 0;
	left: -50px;
	display: block;
	margin-bottom: 0.1em;
	font-family: athelas, serif;
	font-style: italic;
	font-weight: 400;
	line-height: 1;
	font-size: 5.3rem;
	color: #c69c6d;
}

.top-content-subHeding-narrow {
	margin-bottom: -0.1em;
}

.top-content-subHeding-ja {
	position: relative;
	opacity: 0;
	left: -50px;
	margin-bottom: 15px;
	font-size: 1.9rem;
	font-weight: 400;
	color: #666;
}

.top-content-body {
	position: relative;
	opacity: 0;
	top: 50px;
	margin-bottom: 20px;
	font-size: 1.4rem;
}

.top-content-images {
	position: relative;
	opacity: 0;
	top: 50px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: flex-start;
	align-items: flex-start;
}

.top-content-images img:not(:first-child) {
	margin-left: 12px;
}

.bg-top {
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.bg-top01 {
	left: 474px;
}

.bg-top02 {
	left: -376px;
	margin-top: -20px;
}

.bg-top03 {
	left: 368px;
	margin-top: -60px;
}

.bg-top img {
	width: 100%;
	height: auto;
*/
}

.top-content-botton-next {
	position: absolute;
	opacity: 0;
	bottom: 10px;
	width: 100%;
	font-size: 1.1rem;
	text-align: center;
}

.top-content-botton-next a {
	padding: 36px 20px 0;
	color: #666;
}

.top-content-botton-next a span {
	position: absolute;
	left: 50%;
	border-left: 2px solid #c69c6d;
	border-bottom: 2px solid #c69c6d;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	-webkit-animation: arrow-down 2s infinite;
	animation: arrow-down 2s infinite;
	opacity: 0;
}

.top-content-botton-next a span:nth-of-type(1) {
	top: 0;
	width: 20px;
	height: 20px;
	margin-left: -10px;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}

.top-content-botton-next a span:nth-of-type(2) {
	top: 14px;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	-webkit-animation-delay: .2s;
	animation-delay: .2s;
}

@-webkit-keyframes arrow-down {
	0% {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	75% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@keyframes arrow-down {
	0% {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	75% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@media screen and (max-width: 767px) {
	.top-content-box {
		position: relative;
		height: 100vh;
	}

	.top-content-heding01 {
		right: 10px;
		width: 114px;
		height: 262px;
		margin-top: -16vh;
	}

	.top-content-heding02 {
		left: 0;
		width: 86px;
		height: 300px;
		margin-top: -12vh;
	}

	.top-content-heding03 {
		right: 10px;
		margin-top: -20vh;
	}

	.top-content-heding01 {
		width: 114px;
		height: 263px;
	}

	.top-content-heding02 {
		width: 118px;
		height: 412px;
	}

	.top-content-heding03 {
		width: 102px;
		height: 205px;
	}

	.top-content-inBox {
		bottom: 10vh;
	}

	.top-content-inBox-left {
		left: 0;
	}

	.top-content-inBox-right {
		right: 0;
	}

	.top-content-subHeding-en {
		font-size: 3.8rem;
	}

	.top-content-subHeding-narrow {
		margin-bottom: -0.05em;
	}

	.top-content-subHeding-ja {
		margin-bottom: 20px;
		font-size: 1.4rem;
		line-height: 1.5;
	}

	.top-content-body {
		margin-bottom: 10px;
		font-size: 1.2rem;
	}

	#top-content02 .top-content-subHeding-en,
	#top-content02 .top-content-subHeding-ja {
		text-align: right;
	}

	.top-content-images img {
		max-width: calc(50% - 5px);
	}

	.top-content-images img:not(:first-child) {
		margin-left: 10px;
	}

	#top-content03 .top-content-images img:nth-child(1n) {
		max-width: 53.2%;
	}

	#top-content03 .top-content-images img:nth-child(2n) {
		max-width: 44.3%;
	}

	.bg-top01 {
		left: 42vw;
	}

	.bg-top02 {
		left: -50vw;
		margin-top: -2vh;
	}

	.bg-top03 {
		left: 36vw;
		margin-top: -6vh;
	}

	.bg-top img {
		width: 100%;
		height: auto;
		/*
		opacity: 0.2;
		-webkit-transform: scale(0.2, 0);
		transform: scale(0.2, 0);
	*/
	}
}

@media screen and (max-width: 460px) {
	.top-content-heding02 {
		width: 98px;
		height: 342px;
	}

	#top-content02 .top-content-subHeding-en,
	#top-content02 .top-content-subHeding-ja,
	#top-content02 .top-content-body {
		padding-left: 85px;
	}
}

@media screen and (max-width: 375px) {
	.top-content-heding02 {
		width: 92px;
		height: 321px;
	}
}

@media screen and (max-width: 320px) {
	.top-content-heding01 {
		width: 104px;
		height: 240px;
	}

	.top-content-heding02 {
		width: 86px;
		height: 300px;
	}

	.top-content-heding03 {
		width: 92px;
		height: 185px;
	}
	#top-content01 .top-content-subHeding-en,
	#top-content01 .top-content-subHeding-ja {
		max-width: 38vw;
	}

	#top-content02 .top-content-subHeding-en,
	#top-content02 .top-content-subHeding-ja,
	#top-content02 .top-content-body {
		padding-left: 60px;
	}

	#top-content03 .top-content-subHeding-en {
		max-width: 60vw;
	}
}


/* ==============================================
  main
============================================== */
main {
	padding-top: 200px;
	color: #666;
}

#top-main {
	padding-top: 0;
}

@media screen and (max-width: 767px) {
	main {
		padding-top: 80px;
	}
}


/* ==============================================
  about us
============================================== */
.about-block {
	position: relative;
	display: table;
	margin: 0 0 100px auto;
	font-size: 1.8rem;
}

.about-block p:not(:last-child) {
	margin-bottom: 1em;
}

.bg-about01 {
	top: 25px;
	left: 50%;
	-webkit-transform: translateX(240px);
	transform: translateX(240px);
}

.bg-about02 {
	top: 260px;
	left: 50%;
	-webkit-transform: translateX(-986px);
	transform: translateX(-986px);
}

@media screen and (max-width: 767px) {
	.about-block {
		margin: 0 auto 20px;
		font-size: 1.3rem;
	}

	.about-block p:not(:last-child) {
		margin-bottom: 1em;
	}

	.bg-about01 {
		top: 10vh;
		-webkit-transform: translateX(14vw);
		transform: translateX(14vw);
	}

	.bg-about02 {
		top: 26vh;
		-webkit-transform: translateX(-102vw);
		transform: translateX(-102vw);
	}
}


/* ==============================================
  work
============================================== */
.work-lead {
	margin-bottom: 60px;
	padding-left: 2em;
	font-size: 1.8rem;
}

.work-main-block {
	position: relative;
}

.work-items {
	margin-bottom: 40px;
}

.work-item {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
}

.work-item-movie {
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
	text-align: right;
}

.work-item-heding {
	font-family: athelas, serif;
	font-style: italic;
	font-size: 5.3rem;
	font-weight: 400;
	letter-spacing: 0.025em;
}

.work-item-web .work-item-heding {
	width: 2em;
}

.work-item-movie .work-item-heding {
	width: 2.5em;
}

.work-item-body {
	font-size: 1.4rem;
}

.work-item-body span:not(:first-child) {
	display: inline-block;
	margin-left: 1em;
}

.work-item-web .work-item-body {
	width: calc(100% - 2em);
	padding-left: 2em;
}

.work-item-movie .work-item-body {
	width: calc(100% - 2.5em);
	padding-right: 2em;
}

.work01-block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	margin-bottom: 30px;
}

.work02-block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
	margin-bottom: -40px;
}

.work03-block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	margin-bottom: 160px;
}

.work-heding {}

.work-heding01 {
	width: 68px;
}

.work-heding02 {
	width: 68px;
}

.work-heding03 {
	width: 314px;
}

.work-subHeding {
	font-weight: 400;
}

.work-subHeding-en {
	font-family: athelas, serif;
	font-style: italic;
	font-size: 5.3rem;
}

.work-subHeding-ja {
	padding-left: 0.5em;
	font-size: 2.4rem;
}

.work-body {
	font-size: 1.4rem;
	line-height: 1.75;
}

.work-body01 {
	width: calc(100% - 68px);
	padding: 100px 0 0 50px;
}

.work-body02 {
	width: calc(100% - 68px);
	max-width: 582px;
	padding: 0 30px 0 0;
}

.work-body03 {
	width: calc(100% - 314px);
	padding: 150px 0 0 60px;
}

.client-name {
	display: inline-block;
	padding-right: 0.25em;
}
.client-name::after {
	content: '/';
	padding-left: 0.5em;
}

.bg-work01 {
	top: 150px;
	left: 50%;
	-webkit-transform: translateX(90px);
	transform: translateX(90px);
}

.bg-work02 {
	top: -10px;
	left: 50%;
	-webkit-transform: translateX(-986px);
	transform: translateX(-986px);
}

.bg-work03 {
	top: 1145px;
	left: 50%;
	-webkit-transform: translateX(-96px);
	transform: translateX(-96px);
}

.bg-work04 {
	top: 1220px;
	left: 50%;
	-webkit-transform: translateX(-1230px);
	transform: translateX(-1230px);
}

@media screen and (max-width: 767px) {
	.work-lead {
		margin-bottom: 20px;
		padding-left: 0;
		font-size: 1.3rem;
	}

	.work-main-block {
		position: relative;
	}

	.work-items {
		margin-bottom: 40px;
	}

	.work-item-heding {
		font-size: 4.6rem;
	}

	.work-item-body {
		font-size: 1.2rem;
	}

	.work01-block {
		margin-bottom: 40px;
	}

	.work02-block {
		margin-bottom: 60px;
	}

	.work03-block {
		margin-bottom: 40px;
	}

	.work-heding01 {
		width: 48px;
	}

	.work-heding02 {
		width: 48px;
	}

	.work-heding03 {
		width: 220px;
	}

	.work-subHeding-en {
		font-size: 2.6rem;
	}

	.work-subHeding-ja {
		font-size: 1.3rem;
	}

	.work-body {
		font-size: 1.2rem;
	}

	.work-body01 {
		width: calc(100% - 48px);
		padding: 20px 0 0 20px;
	}

	.work-body02 {
		width: calc(100% - 48px);
		padding: 0 20px 0 0;
	}

	.work-body03 {
		width: calc(100% - 220px);
		padding: 60px 0 0 30px;
	}

	.bg-work01 {
		top: 10vh;
		-webkit-transform: translateX(12vw);
		transform: translateX(12vw);
	}

	.bg-work02 {
		top: -6vh;
		-webkit-transform: translateX(-112vw);
		transform: translateX(-112vw);
	}

	.bg-work03 {
		top: auto;
		bottom: -16vh;
		-webkit-transform: translateX(-28vw);
		transform: translateX(-28vw);
	}

	.bg-work04 {
		top: auto;
		bottom: -46vh;
		-webkit-transform: translateX(-142vw);
		transform: translateX(-142vw);
	}
}

@media screen and (max-width: 460px) {
	.work03-block {
/*		display: block;*/
	}
	.work-heding03 {
		width: 157px;
	}

	.work-body03 {
		width: calc(100% - 157px);
		padding: 20px 0 0 30px;
	}

	.client-name {
		display: inline;
	}

	.bg-work03 {
		bottom: -16vh;
		-webkit-transform: translateX(-28vw);
		transform: translateX(-28vw);
	}

	.bg-work04 {
		bottom: -34vh;
		-webkit-transform: translateX(-146vw);
		transform: translateX(-146vw);
	}
}


/* ==============================================
  privacy
============================================== */
.privacy-box {
	margin-bottom: 50px;
}

.privacy-heding {
	margin-bottom: 0.5em;
	padding-left: 1.25em;
	text-indent: -1.25em;
	font-size: 1.8rem;
}

.privacy-body {
	padding-left: 1.5em;
	font-size: 1.4rem;
	letter-spacing: 0.025em;
}

.privacy-body ul {
	margin: 1em 0 1em 1.5em;
}

.privacy-body ul li {
	list-style: disc;
	letter-spacing: 0.025em;
}

.privacy-body a {
	color: #666;
}

@media screen and (max-width: 767px) {
	.privacy-box {
		margin-bottom: 20px;
	}

	.privacy-heding {
		font-size: 1.6rem;
	}

	.privacy-body {
		font-size: 1.2rem;
	}
}


/* ==============================================
  company
============================================== */
#footer-contents {
	background: #e6e6e6;
}

.footer-contents-heding {
	margin-bottom: 0.3em;
	font-size: 2.0rem;
}

#company {
	position: relative;
	margin-top: 60px;
	padding-top: 60px;
	z-index: 10;
}

.company-address {
	margin-bottom: 40px;
	font-size: 1.5rem;
}

.company-info {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	margin-bottom: 30px;
}

.company-info-left-box {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-align-items: center;
	align-items: center;
	width: 52%;
}

.company-info-right-box {
	width: 48%;
}

.company-info-heding {
	font-size: 1.7rem;
	font-weight: 700;
}

.company-info-body {
	font-size: 1.5rem;
	font-weight: 400;
	overflow: hidden;
}

.company-info-left-box .company-info-heding {
	clear: both;
	float: left;
	width: 6em;
	margin-bottom: 1.3em;
}

.company-info-left-box .company-info-body {
	width: calc(100% - 7em);
	margin-bottom: 1.5em;
}

.company-info-right-box .company-info-heding {
	margin-bottom: 0.3em;
}

.company-info-right-box .company-info-body {
	margin-bottom: 1.5em;
}

.campany-map iframe {
	width: 100%;
	height: 450px;
}

@media screen and (max-width: 767px) {
	.footer-contents-heding {
		font-size: 1.6rem;
	}

	#company {
		margin-top: 40px;
		padding-top: 40px;
	}

	.company-address {
		margin-bottom: 30px;
		font-size: 1.3rem;
	}

	.company-info {
		display: block;
		margin-bottom: 30px;
	}

	.company-info-left-box {
		width: 100%;
	}

	.company-info-right-box {
		width: 100%;
	}

	.company-info-heding {
		font-size: 1.3rem;
	}

	.company-info-body {
		font-size: 1.3rem;
	}

	.company-info-right-box .company-info-heding {
		clear: both;
		float: left;
		width: 6em;
		margin-bottom: 1.3em;
	}

	.company-info-right-box .company-info-body {
		width: calc(100% - 7em);
		margin-bottom: 1.5em;
	}

	.campany-map iframe {
		height: 260px;
	}
}



/* ==============================================
  contact
============================================== */
#contact {
	padding-top: 60px;
	padding-bottom: 60px;
}

#contact-flame {
	width: 100%;
}

.contact-form-item {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	font-size: 1.6rem;
	border-top: 1px dotted #ccc;
}

.contact-form-item dt {
	width: 20%;
	margin: 10px 0;
	padding: 0.8em 0.5em;
	font-weight: 700;
	white-space: nowrap;
}

.contact-form-item dd {
	width: 80%;
	margin: 10px 0;
	padding: 0.8em 0.5em 0.5em 1.5em;
}

.radio {
	margin: 0.5rem;
	line-height: 1;
}

.radio input[type=radio] {
	position: absolute;
	opacity: 0;
}

.radio input[type=radio] + .radio-label:before {
	content: "";
	background: #f4f4f4;
	border-radius: 100%;
	border: 1px solid #9e9e9f;
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	position: relative;
	top: -0.2em;
	margin-right: 0.5em;
	vertical-align: top;
	cursor: pointer;
	text-align: center;
	transition: all 250ms ease;
}

.radio input[type=radio]:checked + .radio-label:before {
	background-color: #000;
	box-shadow: inset 0 0 0 4px #f4f4f4;
}

.radio input[type=radio] + .radio-label:empty:before {
	margin-right: 0;
}

.input-text {
	width: calc(100% - 2em);
	padding: 0.8em 0.5em;
	border: 1px solid #9e9e9f;
	background: #fff;
}

.form-button-block {
	text-align: center;
	padding: 30px 0;
}

.form-buttons-block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding: 30px 0;
}

.button {
	position: relative;
	min-width: 240px;
	padding: 0.8em;
	font-size: 1.6rem;
	color: #fff;
	text-align: center;
	cursor: pointer;
	background: #000;
}

.button-input,
.button-input2 {
	position: relative;
	display: inline-block;
	color: #fff;
	cursor: pointer;
	transition: opacity .2s ease-in-out;
}

[class^="btn"]:hover {
	opacity: 0.8;
}

.button-input::before,
.button-input2::before {
	position: absolute;
	content: '';
	top: 50%;
	width: 7px;
	height: 7px;
	-webkit-transform: rotate(45deg)translateY(-50%);
	transform: rotate(45deg)translateY(-50%);
	z-index: 3;
}

.button-input::before {
	right: 19px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}

.button-input2::before {
	left: 14px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
}

.button-back {
	background: #a6a6a6;
}

.contact-finish {
	margin-bottom: 20px;
	padding-top: 30px;
	font-size: 2.0rem;
	font-weight: 700;
	text-align: center;
	border-top: 1px dotted #ccc;
}

.contact-massage-box {
	display: table;
	margin: 0 auto 30px;
	font-size: 1.4rem;
}

.contact-info-box {
	display: table;
	margin: 0 auto;
	padding: 20px 25px;
	font-size: 1.6rem;
	border: 1px solid #000;
}

.contact-info-time {
	display: inline-block;
	margin-left: 15px;
	font-size: 1.3rem;
}

.error-message {
	font-size: 1.4rem;
	color: #cc0000;
}

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

@media screen and (max-width: 767px) {
	#contact {
		padding-top: 40px;
		padding-bottom: 40px;
	}

	.contact-form-item {
		display: block;
		font-size: 1.4rem;
		border-top: none;
	}

	.contact-form-item dt {
		width: 100%;
		margin: 2px 0;
		padding: 0.4em 0.8em;
		border-radius: 3px;
		background: #cfcfcf;
	}

	.contact-form-item dd {
		width: 100%;
		margin: 8px 0 20px;
		padding: 0.4em 0.8em;
	}

	.radio {
		margin: 0.2rem 0.5rem 0;
		padding: 0.4em 0;
	}

	.input-text {
		width: calc(100% - 1em);
		padding: 0.6em 0.5em;
	}

	.form-button-block {
		padding: 10px 0;
	}

	.form-buttons-block {
		padding: 10px 0;
	}

	.button {
		font-size: 1.5rem;
	}
	
	.form-buttons-block .button {
		min-width: 130px;
	}

	[class^="btn"]:hover {
		opacity: 1;
	}

	.contact-finish {
		margin-bottom: 15px;
		padding-top: 20px;
		font-size: 1.6rem;
	}

	.contact-massage-box {
		font-size: 1.3rem;
	}

	.contact-info-box {
		padding: 1.2em 1.5em;
		font-size: 1.3rem;
	}

	.contact-info-time {
		margin-left: 1.5em;
		font-size: 1.3rem;
	}

	.error-message {
		margin-top: 5px;
		font-size: 1.2rem;
	}
}

/* ==============================================
  security
============================================== */
.security-box {
	margin-bottom: 50px;
}

.security-heding1 {
	margin-bottom: 0.5em;
	padding-left: 1.25em;
	text-indent: -1.25em;
	font-size: 1.8rem;
	text-align: center;
}

.security-heding {
	margin-bottom: 0.5em;
	padding-left: 1.25em;
	text-indent: -1.25em;
	font-size: 1.8rem;
}

.security-body {
	padding-left: 1.5em;
	font-size: 1.4rem;
	letter-spacing: 0.025em;
}

.security-body dl {
	margin-top: 2em;
	padding: 0;
}

.security-body dl dt {
	margin-left: 1em;
	display: list-item;
	list-style-type: decimal;
	font-size: 1.6rem;
	font-weight:bolder;
}
	.security-body dl dd {
	margin-left: 1em;
	padding-bottom: 2em;
}

.security-body ul {
	margin: 1em 0 1em 1.5em;
}

.security-body ul li {
	list-style: disc;
	letter-spacing: 0.025em;
}

.security-body a {
	color: #666;
}

@media screen and (max-width: 767px) {
	.security-box {
		margin-bottom: 20px;
	}

	.security-heding {
		font-size: 1.6rem;
	}

	.security-body {
		font-size: 1.2rem;
	}
}