@charset "utf-8";
/* CSS Document */
html {
	font-size: 62.5%;
}

body{
	font-family: "Noto Sans Japanese","Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	color: #000;
	font-size: 1.5rem;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
}

ul {
	list-style-type: none;
}
img, svg {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
a {
	color :#000;
	text-decoration: none;
}
.clearfix:after {
    content:"";
    display:block;
    clear:both;
}
.pcNone{ display: block; visibility: visible;}
.spNone{ display: none; visibility: hidden;}

@media screen and (min-width: 641px){	
	.spNone{ display: block; visibility: visible;}
	.pcNone{ display: none; visibility: hidden;}
}

.align-l {
	text-align: left;
}
.align-c {
	text-align: center;
}
.align-r {
	text-align: right;
}

.josefin {
	font-family: 'Josefin Sans', sans-serif;
}

/* loader */
#loader-bg {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: #fff;
	z-index: 998;
}

#loader,
#loader:after {
	border-radius: 50%;
	width: 5em;
	height: 5em !important;
}
#loader {
	margin: 0 auto;
	font-size: 10px;
	position: absolute;
	top: 50%;
	left: 50%;
	text-indent: -9999em;
	border-top: 0.2em solid rgba(51, 185, 231, 0.2);
	border-right: 0.2em solid rgba(51, 185, 231, 0.2);
	border-bottom: 0.2em solid rgba(51, 185, 231, 0.2);
	border-left: 0.2em solid  rgba(51, 185, 231, 1.0);
	z-index: 999;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-animation: loader-spin 1.1s infinite linear;
	animation: loader-spin 1.1s infinite linear;
}


/* header */

header {
	z-index: 990;
	width: 100%;
	height: 60px;
	position: fixed;
	top: 0;
	left: 0;
}

header::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: -30px;
	width: 200px;
	height: 60px;
	background: rgba(255,255,255,0.7);
	-webkit-transform: skew(-25deg,0);
	-ms-transform: skew(-25deg,0);
	transform: skew(-25deg,0);
	z-index: -1;
}

header #header-logo a {
	position: fixed;
	display: block;
	top: 16px;
	left: 14px;
}

header #header-logo a img {
	display: block;
	width: auto;
    height: 26px;
}

/* gnav */
.cd-logo, .cd-nav-trigger {
	position: fixed;
	display: inline-block;
	cursor: pointer;
}

.cd-logo {
	top: 28px;
	left: 5%;
}
.cd-logo img {
	display: block;
}

.cd-nav-trigger {
	top: 5px;
	right: 8px;
	height: 50px;
	width: 50px;
	z-index: 996;
	/* image replacement */
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
.cd-nav-trigger .cd-icon {
	/* icon created in CSS */
	position: absolute;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	display: inline-block;
	width: 18px;
	height: 3px;
	background-color: #000000;
	z-index: 997;
}
.cd-nav-trigger .cd-icon::before, .cd-nav-trigger .cd-icon:after {
	/* upper and lower lines of the menu icon */
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: #000000;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	/* apply transition to transform property */
	-webkit-transition: -webkit-transform .3s;
	-ms-transition: -moz-transform .3s;
	transition: transform .3s;
}
.cd-nav-trigger .cd-icon::before {
	-webkit-transform: translateY(-6px) rotate(0deg);
	-ms-transform: translateY(-6px) rotate(0deg);
	transform: translateY(-6px) rotate(0deg);
}
.cd-nav-trigger .cd-icon::after {
	-webkit-transform: translateY(6px) rotate(0deg);
	-ms-transform: translateY(6px) rotate(0deg);
	transform: translateY(6px) rotate(0deg);
}
.cd-nav-trigger::before, .cd-nav-trigger::after {
	/* 2 rounded colored backgrounds for the menu icon */
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%;
	height: 100%;
	width: 100%;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-property: -webkit-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;
}
.cd-nav-trigger::before {
	/*background-color: #ffffff;*/
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-webkit-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-delay: 0.4s;
	-ms-transition-delay: 0.4s;
	transition-delay: 0.4s;
}
.cd-nav-trigger::after {
	/*background-color: #000000;*/
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	-webkit-transition-duration: 0s;
	-ms-transition-duration: 0s;
	transition-duration: 0s;
	-webkit-transition-delay: 0s;
	-ms-transition-delay: 0s;
	transition-delay: 0s;
}
.cd-nav-trigger.close-nav::before {
	/* user clicks on the .cd-nav-trigger element - 1st rounded background disappears */
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
}
.cd-nav-trigger.close-nav::after {
	/* user clicks on the .cd-nav-trigger element - 2nd rounded background appears */
	/*background-color: #000000;*/
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-webkit-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-delay: 0.4s;
	-ms-transition-delay: 0.4s;
	transition-delay: 0.4s;
}
.cd-nav-trigger.close-nav .cd-icon {
	/* user clicks on the .cd-nav-trigger element - transform the icon */
	background-color: rgba(255, 255, 255, 0);
}
.cd-nav-trigger.close-nav .cd-icon::before, .cd-nav-trigger.close-nav .cd-icon::after {
	background-color: white;
}
.cd-nav-trigger.close-nav .cd-icon::before {
	-webkit-transform: translateY(0) rotate(45deg);
	-ms-transform: translateY(0) rotate(45deg);
	transform: translateY(0) rotate(45deg);
}
.cd-nav-trigger.close-nav .cd-icon::after {
	-webkit-transform: translateY(0) rotate(-45deg);
	-ms-transform: translateY(0) rotate(-45deg);
	transform: translateY(0) rotate(-45deg);
}

.cd-primary-nav {
	/* by default it's hidden */
	position: fixed;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	padding: 80px 5%;
	z-index: 994;
	background: url(../img/common/logo_nav_bg.svg) no-repeat #000;
	background-position: center 10%;
	background-size: 90%;
	overflow: auto;
	/* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
	-webkit-overflow-scrolling: touch;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility 0s, opacity 0s;
	-ms-transition: visibility 0s, opacity 0s;
	transition: visibility 0s, opacity 0s;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	flex-direction: column;
}
.cd-primary-nav li {
	margin: 1em 0;
	text-align: center;
	text-transform: capitalize;
	visibility: hidden;
	opacity: 0;
	display: block;
	-webkit-transform: translateX(50px);
	-ms-transform: translateX(50px);
	transform: translateX(50px);
	transition: all 150ms ease-in-out;

}
.cd-primary-nav a {
	font-size: 20px;
	font-size: 2.0rem;
	font-family: 'Josefin Sans', sans-serif;
	color: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transition: all 0.2s;
}
.cd-primary-nav a::after {
	content: "";
	position: relative;
	display: block;
	border-bottom: 2px solid #fff;
	width: 0;
	transition: all .3s ease;
}
.cd-primary-nav a:hover::after {
	width: 100%;
}
.no-touch .cd-primary-nav a:hover {
	color: #ffffff;
}
.cd-primary-nav.fade-in {
	/* navigation visible at the end of the circle animation */
	visibility: visible;
	opacity: 1;

	list-style: none;
}
.cd-primary-nav.fade-in li {
	/* navigation visible at the end of the circle animation */
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	visibility: visible;
	opacity: 1;
}
.cd-primary-nav.fade-in li:nth-of-type(1){	
	transition-delay: 0.10s;	
}
.cd-primary-nav.fade-in li:nth-of-type(2){
	transition-delay: 0.15s;			
}
.cd-primary-nav.fade-in li:nth-of-type(3){
	transition-delay: 0.20s;		
}
.cd-primary-nav.fade-in li:nth-of-type(4){
	transition-delay: 0.25s;		
}
.cd-primary-nav.fade-in li:nth-of-type(5){
	transition-delay: 0.30s;		
}
.cd-primary-nav.fade-in li:nth-of-type(6){
	transition-delay: 0.35s;			
}

.cd-overlay-nav, .cd-overlay-content {
	/* containers of the 2 main rounded backgrounds - these containers are used to position the rounded bgs behind the menu icon */
	position: fixed;
	top: 5px;
	right: 8px;
	height: 4px;
	width: 4px;
	-webkit-transform: translateX(-20px) translateY(20px);
	-ms-transform: translateX(-20px) translateY(20px);
	transform: translateX(-20px) translateY(20px);
}
.cd-overlay-nav span, .cd-overlay-content span {
	display: inline-block;
	position: absolute;
	border-radius: 50%;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0) scale(0);
	-ms-transform: translateZ(0) scale(0);
	transform: translateZ(0) scale(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	will-change: transform;
	-webkit-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}
.cd-overlay-nav.is-hidden, .cd-overlay-content.is-hidden {
	/* background fades out at the end of the animation */
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity .3s 0s, visibility 0s .3s;
	-moz-transition: opacity .3s 0s, visibility 0s .3s;
	transition: opacity .3s 0s, visibility 0s .3s;
}

.cd-overlay-nav {
	/* main rounded colored bg 1 */
	z-index: 993;
}
.cd-overlay-nav span {
	background-color: #000000;
}

.cd-overlay-content {
	/* main rounded colored bg 2 */
	z-index: 995;
}
.cd-overlay-content span {
	background-color: #ffffff;
}

.cd-content {
	z-index: 1;
}


/* main */

main {
	width: 100%;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 0;
}

#main-inner {
	width: 100%;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 15% 25px 0;
	max-width: 500px;
}

body.news #main-inner {
	padding: 10% 25px 0;
}

body:not(.company) #main-inner {
	padding: 0 25px 0;
}

.company #main-inner {
	padding: 15% 25px 0;
}

main > section,
#main-inner > section {
	margin-bottom: 20%;
	position: relative;
	padding-top: 60px;
}

#common-title {
	width: 100%;
	text-align: center;
	margin: 60px auto 0;
	position: relative;
	height: 200px;
}

.service #common-title {
	background: url(../img/service/service_title.jpg) no-repeat;
	background-size: cover;
	background-position: 70% 40%;
}
.consulting #common-title {
	background: url(../img/service/marketing_consulting_title.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}
.advertising #common-title {
	background: url(../img/service/marketing_advertising_title.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}
.casting #common-title {
	background: url(../img/service/marketing_casting_title.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}
.creative #common-title {
	background: url(../img/service/marketing_creative_title.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}

.news #common-title {
	background: url(../img/news/news_title.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
}

.recruit #common-title {
	background: url(../img/recruit/recruit_title.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
}

.company #common-title {
	background: url(../img/company/company_title.jpg) no-repeat;
	background-size: cover;
	background-position: 70% 20%;
}

.contact #common-title {
	background: url(../img/contact/contact_title.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}

#common-title h1 {
	font-family: 'Josefin Sans', sans-serif;
	font-size: 4rem;
	background: #000;
	color: #fff;
	width: 60%;
	max-width: 240px;
	display: inline-block;
	margin: 0 auto;
	padding: 15px 0 5px 0;
	position: absolute;
	bottom: -15px;
	left: 0;
	right: 0;
	z-index: 1
}

#common-title h1::after {
	content: "";
	display: block;
	width: 120%;
	height: 100%;
	background: #000;
	position: absolute;
	top: 0;
	left: -10%;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	-webkit-transform: skew(-25deg,0);
	-ms-transform: skew(-25deg,0);
	transform: skew(-25deg,0);
	z-index: -1;
}

.consulting #common-title h1,
.advertising #common-title h1,
.casting #common-title h1,
.creative #common-title h1 {
	bottom: inherit;
	top: 13%;
}

.anchor-link {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.anchor-link li {
	width: 48%;
	margin-right: 4%;
	margin-bottom: 15px;
}

.anchor-link li:nth-child(2n) {
	margin-right: 0;
}

.anchor-link li a {
	position: relative;
	padding: 3px 5px 15px;
	font-size: 1.4rem;
	color: #000;
	border: 2px solid #000;
	margin: 0 auto;
	display: inline-block;
	text-align: center;
	box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
	transition:  all 0.3s ease 0s;
	width: 100%;
	font-weight: bold;
}

.anchor-link li a:hover {
	color: #fff;
	background: #000;
	padding: 9px 5px 9px;
}

.anchor-link li a::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: rgba(0,0,0,0);
	-webkit-transform: translate(0,-50%) rotate(135deg);
	-ms-transform: translate(0,-50%) rotate(135deg);
	transform: translate(0,-50%) rotate(135deg);
	position: absolute;
	left: 48%;
	bottom: 3px;
	transition: all .3s ease 0s;
}

.anchor-link li a:hover::after {
	bottom: -10px;
	background: #000;
}

.title-area {
	width: 100%;
	position: relative;
	margin: 0 auto 3%;
	text-align: center;
}

.title-area h2,
#common-title h2,
.title-area h3 {
	text-align: center;
	margin: 0 auto 3%;
	position: relative;
	display: block;
	width: auto;
}

#common-title h2 {
	margin: 10% auto 0;
}

.title-area h2 span.main-txt,
#common-title h2 span.main-txt,
.title-area h3 span.main-txt {
	font-family: 'Josefin Sans', sans-serif;
	text-align: center;
	font-size: 3.6rem;
	position: relative;
	display: block;
	width: auto;
}
#common-title h2 span.main-txt {
	color: #fff;
}

.title-area h2 span.sub-txt,
#common-title h2 span.sub-txt,
.title-area h3 span.sub-txt {
	font-size: 1.4rem;
	font-weight: bold;
	display: inline-block;
	text-align: center;
	line-height: 3rem;
	padding: 0 1em 0;
	color: #fff;
	position: relative;
	background: #000;
	font-family: "Noto Sans Japanese","Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
#common-title h2 span.sub-txt {
	color: #000;
	background: #fff;
}

p.copy-txt {
	font-size: 2.4rem;
	text-align: center;
	line-height: 4rem;
	display: inline-block;
	margin: 0 auto 2rem;
	font-weight: bold;
}

p.copy-txt span {
	position: relative;
	padding: 0 0.5rem 0;
	border-bottom: 4px solid #ccc;
}

p.txt {
	text-align: left;
	margin-bottom: 2rem;
	line-height: 3rem;
}

/* breadcrumb */
.bc-wrap {
	border-top: 1px solid #000;
	width: 100%;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 10px 2%;
}
.bc-inner {
	padding: 0;
}
.breadcrumb {
	display: flex;
	justify-content: flex-start;
	align-items: top;
	flex-wrap: wrap;
}
.breadcrumb li {
	position: relative;
	padding: 0 6px 0 16px;
	font-size: 1.3rem;
}
.breadcrumb li:first-child {
	padding: 0 6px 0 0;
}
.breadcrumb li::before {
	content: "";
    display: block;
    width: 6px;
    height: 6px;
    border-right: 1px solid #555;
    border-top: 1px solid #555;
    background: rgba(0,0,0,0);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    left: 0px;
    top: 7px;
}
.breadcrumb li:first-child::before {
	content: none;
}
.breadcrumb li a {
	transition: all 0.7s ease;
	color: #000;
}
.breadcrumb li a:hover {
	opacity: 0.7;
	text-decoration: underline;
}

/* footer */
footer {
	text-align: center;
	background: #000;
	color: #fff;
}

footer .inner {
	padding: 40px 2%;
}
footer .footer-nav-list li {
	width: 100%;
	text-align: left;
	font-family: 'Josefin Sans', sans-serif;
}
footer .footer-nav-list li a {
	color: #fff;
	display: block;
	box-sizing: border-box;
	width: 100%;
	position: relative;
	transition: all 0.7s ease;
}
footer .footer-nav-list > li > a {
	padding: 14px 14px 10px;
	border-bottom: 1px solid #555;
}

footer .footer-nav-list > li > a::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #fff;
	border-top: 1px solid #fff;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	right: 15px;
	top: 50%;
	transition: all 0.7s ease;
}
footer .footer-nav-list > li > a:hover::after {
	-webkit-animation: arrow 0.7s ease 0s forwards;
	animation: arrow 0.7s ease 0s forwards;
	border-color: #fff;
}
footer .footer-nav-list > li > a.parent {
	/*pointer-events: none;*/
	cursor: pointer;
}
footer .footer-nav-list > li > a.parent.pc {
	display: none;
}
footer .footer-nav-list > li > a.parent::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #fff;
	border-top: 1px solid #fff;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(135deg);
	-ms-transform: translateY(-50%) rotate(135deg);
	transform: translateY(-50%) rotate(135deg);
	position: absolute;
	right: 14px;
	top: 50%;
}
footer .footer-nav-list > li > a.parent.open::after {
	-webkit-transform: translateY(-50%) rotate(315deg);
	-ms-transform: translateY(-50%) rotate(315deg);
	transform: translateY(-50%) rotate(315deg);
}
footer .footer-nav-list > li > a.parent:hover::after,
footer .footer-nav-list > li > a.parent.open:hover::after{
	border-color: #fff;
	-webkit-animation: none;
	animation: none;
}

footer .footer-nav-list > li.facebook > a,
footer .footer-nav-list > li.contact > a {
	background: rgba(23, 181, 231, 0.2);
	border: 1px solid rgba(23, 181, 231, 0.2);
	max-width: 240px;
	margin: 20px auto 0;
	padding: 20px 14px 16px;
	text-align: center;
	transition: all 0.7s ease;
}
footer .footer-nav-list > li.facebook > a:hover,
footer .footer-nav-list > li.contact > a:hover {
	background: rgba(23, 181, 231, 0.4);
	border: 1px solid rgba(23, 181, 231, 0.2);
}

footer .footer-nav-list .child {
	display: none;
	padding: 10px 14px;
}
footer .footer-nav-list .child li {
	font-family: "Noto Sans Japanese","Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-size: 1.3rem;
}
footer .footer-nav-list .child li a {
	padding: 5px 0 5px 12px;
}
footer .footer-nav-list .child li a::after {
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	border-right: 1px solid #17b5e7;
	border-top: 1px solid #17b5e7;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	left: 0px;
	top: 50%;
	transition: all 0.7s ease;
}
footer .footer-nav-list .child li a:hover::after {
	border-color: #fff;
}

footer .footer-info {
	margin-top: 40px;
}
footer p.footer-logo {
	width: 50%;
	width: 160px;
	max-width: 160px;
	margin: 0 auto 10px;
}
footer p.footer-detail {
	font-size: 1.3rem;
	color: #a7a7a7;
}

footer p.copyright {
	color: #a7a7a7;
	font-size: 1.2rem;
	padding: 20px 0;
	font-family: 'Josefin Sans', sans-serif;
	border-top: 1px solid rgba(255,255,255,0.1)
}


/* mv area */
.index header {
  z-index: 1;
}

#mv-area {
	width: 100%;
	height: 100vh;
    position: relative;
	text-align: center;
	overflow: hidden;
}

#logo-set-wrap {
	width: 80%;
	max-width: 490px;
	max-height: 340px;
	position: absolute;
	top: 46%;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 3;
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	transform: translate(0,-50%);
	text-align: center;
}

@media screen and (min-width: 812px), screen and (orientation: landscape) {
	#logo-set-wrap {
		width: 50%;
	}
}


#logo-set {
	position: relative;
    width: 100%;
    height: 100%;
    padding: 69.4% 0 0;
}

#logo-set-inner {
	position: absolute;
    top: 0;
    left: 0;
	bottom: 0;
	right: 0;
    width: 100%;
    height: 100%;
	text-align: center;
}

#logo {
	width: 100%;
	margin: 0 auto;
	position: absolute;
	top: 40.6666%;
	left: 0;
	right: 0;
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	transform: translate(0,-50%);
	fill: #000;
	z-index: 3;
}

#logo-sub {
	width: 73.4693%;
	margin: 0 auto;
	position: absolute;
	top: 68%;
	left: 0;
	right: 0;
	-webkit-transform: translate(0%,-50%);
	-ms-transform: translate(0%,-50%);
	transform: translate(0%,-50%);
	z-index: 3;
}

#logo-circle {
	-webkit-clip-path: circle(50% at 50% 50%);
	clip-path: circle(50% at 50% 50%);
	border: 2px solid #33b9e7;
	border-radius: 50%;
	box-sizing: border-box;
	height: 100%;
	width: 61.3%;
	background: rgba(255,255,255,0.40);
	z-index: 2;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}

#container {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    text-align: center;
	overflow: hidden;
	-webkit-filter: invert(100%);
	-moz-filter: invert(100%);
	-o-filter: invert(100%);
	-ms-filter: invert(100%);
	filter: invert(100%);
	/*mix-blend-mode: darken;*/
}

#logo-circle-ie {
	display: none;
	visibility: visible;
}

/* IE8~11のみ */
@media screen\0 {
	#logo-circle {
		display: none;
		visibility: visible;
	}
	#logo-circle-ie {
		height: 100%;
		width: 61.3%;
		max-height: 300px;
		max-width: 300px;
		background: url(../img/common/logo_circle.svg) no-repeat;
		background-position: center center;
		background-size: contain;
		display: block;
		z-index: 2;
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
	}
}

/* Edgeのみ */
/*@supports (-ms-ime-align: auto) {
	#logo-circle {
		display: none;
		visibility: visible;
	}
	#logo-circle-iedge {
		height: 100%;
		width: 61.3%;
		max-height: 300px;
		max-width: 300px;
		background: url(../img/common/logo_circle.svg) no-repeat;
		background-position: center center;
		background-size: contain;
		display: block;
		z-index: 2;
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
	}
}*/

#mv-bg {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 0;
	top: 0;
	background: url(../img/index/main_bg.jpg) no-repeat;
	background-size: cover;
}

#mv-effect {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	top: 0;
}


/* contents */
.index #main-inner {
	padding: 10% 25px 0;
}

.title-area {
	width: 100%;
	position: relative;
	margin: 0 auto 5%;
	text-align: center;
}

.title-area h2,
#common-title h2,
.title-area h3 {
	font-family: 'Josefin Sans', sans-serif;
	text-align: center;
	font-size: 3.6rem;
	margin: 3% auto 0;
	position: relative;
	display: block;
	width: auto;
}
#common-title h2 {
	margin: 40px auto 0;
}

.title-area a.btn-more {
	position: relative;
	padding: 3px 40px 3px 15px;
	font-size: 1.4rem;
	color: #000;
	border: 2px solid #000;
	margin: 0 auto;
	display: inline-block;
	box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
	transition:  all 0.3s ease 0s;
}

.title-area a.btn-more:hover {
	color: #fff;
	background: #000;
	padding: 3px 30px 3px 25px;
}

.title-area a.btn-more::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	right: 15px;
	top: 50%;
	transition: all 0.7s ease;
}

.title-area a.btn-more:hover::after {
	-webkit-animation: arrow 0.7s ease 0s forwards;
	animation: arrow 0.7s ease 0s forwards;
	border-color: #fff;
}

/* common list */

ul.service-list-index li,
ul.news-list li,
ul.recruit-list li,
ul.media-list li,
ul.marketing-list li {
	width: 100%;
	margin-bottom: 5%;
	position: relative;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	transition: all .5s linear 0s;
	overflow: hidden;
}

ul.contact-list li {
	width: 100%;
	margin-bottom: 0;
	position: relative;
	transition: all .5s linear 0s;
}
ul.contact-list li .wrap {
	position: relative;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	transition: all .5s linear 0s;
	overflow: hidden;
}

ul.service-list-index li,
ul.media-list li {
	margin-bottom: 8%;
}

ul.service-list-index li .inner,
ul.news-list li .inner,
ul.recruit-list li .inner,
ul.contact-list li .inner,
ul.media-list li .inner,
ul.marketing-list li .inner,
ul.gallery-case-wrapper li .inner,
.entry-btn a,
ul.form-list li .inner {
	margin: 0;
	width: 100%;
	position: relative;
	background: -webkit-linear-gradient(-60deg, #000 49.9%, #535353 50%);
	background: linear-gradient(-60deg, #000 49.9%, #535353 50%);
	background-position: right 0;
	background-size: 240% 100%;
	transition: all .5s linear 0s;
}
ul.marketing-list li .inner {
	background-size: 260% 100%;
}

ul.service-list-index li .inner:hover,
ul.news-list li .inner:hover,
ul.recruit-list li .inner:hover,
ul.contact-list li .inner:hover,
ul.media-list li .inner:hover,
ul.marketing-list li .inner:hover,
ul.gallery-case-wrapper li .inner:hover,
.entry-btn a:hover,
ul.form-list li .inner:hover {
	background-position: left 0;
}

ul.news-list li .inner {
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
	display: flex;
	-webkit-align-items: center;
	align-items: center;
}

ul.contact-list li .inner,
.entry-btn a,
ul.form-list li .inner {
	padding: 5% 40px 5% 80px;
	max-height: 120px;
	height: 100%;
	text-align: center;
}

ul.service-list-index li a,
ul.news-list li a,
ul.contact-list li .inner a,
ul.media-list li a,
ul.marketing-list li a,
ul.form-list li .inner a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	text-indent: -9999px;
	z-index: 1;
}

ul.service-list-index li h3::after,
ul.news-list li .inner a::after,
ul.recruit-list li .inner a::after,
ul.contact-list li .inner a::after,
.entry-btn a::after,
ul.form-list li .inner a::after {
	content: "";
	display: block;
	width: 13px;
	height: 13px;
	border-right: 2px solid #fff;
	border-top: 2px solid #fff;
	position: absolute;
	right: 15px;
	top: 50%;
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	transition: all .5s ease-in-out;
}
ul.marketing-list li .inner a::after {
	content: none;
}

ul.media-list li .inner h4::before,
ul.media-list li .inner h4::after {
    content: "";
    width: 12px;
    height: 12px;
    border: 1px solid #fff;
    background: #000;
    position: absolute;
    top: calc(50% - 2px);
    right: 15px;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	transition: all .5s ease-in-out;
}
ul.media-list li .inner h4::before {
    top: calc(50% + 1px);
    right: 18px;
}
ul.media-list li .inner:hover h4::before,
ul.media-list li .inner:hover h4::after {
	background: #535353;
}

ul.service-list-index li .inner:hover h3::after,
ul.news-list li .inner a:hover::after,
ul.recruit-list li .inner a:hover::after,
ul.contact-list li .inner a:hover::after,
.entry-btn a:hover::after,
ul.form-list li .inner a:hover::after {
	-webkit-animation: arrow 0.7s ease 0s forwards;
	animation: arrow 0.7s ease 0s forwards;
}

.news-wrap,
.recruit-wrap,
.policy-wrap {
	padding: 0;
	position: relative;
	width: 100%;
}

.news-bg,
.recruit-bg {
	display: none;
	visibility: hidden;
}


/* service */
ul.service-list-index {
}

ul.service-list-index li:last-child {
	margin-bottom: 0;
}

ul.service-list-index li figure {
	overflow: hidden;
}

ul.service-list-index li figure img {
	transition: all .5s ease-out;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

ul.service-list-index li:hover figure img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	opacity: 0.6;
}

ul.service-list-index li h3 {
	text-align: left;
	width: 100%;
	padding: 10px 15px;
	font-weight: bold;
	display: block;
	font-size: 1.4rem;
	color: #fff;
	text-decoration: none;
	letter-spacing: 0.2rem;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}


/* news */
ul.news-list {
	width: 100%;
}

ul.news-list li:last-child {
	margin-bottom: 0;
}

ul.news-list li .inner figure {
	flex-basis: 25%;
	width: 25%;
	min-height: 80px;
	min-width: 100px;
	max-width: 115px;
	position: relative;
	overflow: hidden;
}

ul.news-list li .inner figure.trim img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-backface-visibility: hidden;
    backface-visibility: hidden;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: auto;
	height: 100%;
	transition: all .5s ease-out;
}

ul.news-list li:hover .inner figure.trim img {
	-webkit-transform: translate(-50%, -50%) scale(1.1,1.1);
	-ms-transform: translate(-50%, -50%) scale(1.1,1.1);
	transform: translate(-50%, -50%) scale(1.1,1.1);
	opacity: 0.6;
}

ul.news-list li .inner dl {
	position: relative;
	width: 75%;
	color: #fff;
	padding: 0px 40px 0px 15px;
}

ul.news-list li .inner dl dt {
	color: rgba(255,255,255,0.30);
	font-size: 3.0rem;
	font-family: 'Josefin Sans', sans-serif;
}

ul.news-list li .inner dl dd {
	font-size: 1.4rem;
	width: 100%;
	color: #fff;
	position: relative;
	top: -5px;
	overflow: hidden;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}


.news-detail #news {
	margin-bottom: 10%;
}
.news-detail .title-area {
	margin-bottom: 10%;
}
.news-detail .news-title {
	background: #f5f5f5;
	padding: 20px 0 0;
	box-shadow: 8px 8px 10px rgba(0,0,0,0.15);
	margin-bottom: 3%;
}
.news-detail .news-title h3 {
	padding: 10px 15px 15px;
}
.news-detail .news-title p {
    font-family: 'Josefin Sans', sans-serif;
	padding: 5px 10px 5px 15px;
	background: #000;
	color: #fff;
	text-align: right;
	font-size: 1.8rem;
	display: inline-block;
	position: relative;
}
.news-detail .news-title p::after {
	content: "";
    width: 25px;
    height: 100%;
    background: #000;
	-webkit-transform: skew(-20deg);
	-ms-transform: skew(-20deg);
    transform: skew(-20deg);
    position: absolute;
    right: -12px;
    top: 0;
}
.news-detail .news-content p {
	line-height: 1.8em;
	margin-bottom: 1rem;
}
.news-detail #service-contact {

	padding-top: 0;
}

a.btn-square {
	position: relative;
	padding: 10px 50px 10px 25px;
	font-size: 1.4rem;
	color: #000;
	border: 2px solid #000;
	margin: 30px auto 0;
	display: block;
	width: 205px;
	box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
	transition:  all 0.3s ease 0s;
}

a.btn-square:hover {
	color: #fff;
	background: #000;
	padding: 10px 40px 10px 35px;
}

a.btn-square::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	right: 15px;
	top: 50%;
	transition: all 0.7s ease;
}

a.btn-square:hover::after {
	-webkit-animation: arrow 0.7s ease 0s forwards;
	animation: arrow 0.7s ease 0s forwards;
	border-color: #fff;
}

.policy .policy-content h3 {
	position: relative;
	padding: 0 0 0 26px;
	margin-bottom: 6px;
}
.policy .policy-content h3::before {
	content: "";
	width: 12px;
	height: 20px;
	background: #ccc;
	display: block;
	-webkit-transform: translateY(-50%) skewX(-20deg);
	-ms-transform: translateY(-50%) skewX(-20deg);
	transform: translateY(-50%) skewX(-20deg);
    position: absolute;
    top: 50%;
    left: 4px;
}
.policy .policy-content p {
	line-height: 2em;
	margin-bottom: 1rem;
}
p.mbl {
	margin-bottom: 3rem !important;
}
.policy-list {
	margin-bottom: 3rem;
}
.policy-list li {
	margin-bottom: 1.4rem;
	padding: 0 0 0 20px;
	text-indent: -20px;
	line-height: 2rem;
}
.policy-list li::before {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 2px solid #ccc;
	border-radius: 50%;
	margin: 0 6px 0 4px;
}
.policy-list li:last-child {
	margin-bottom: 0;
}

/* recruit */
ul.recruit-list {
	width: 100%;
}

ul.recruit-list li:last-child {
	margin-bottom: 0;
}

ul.recruit-list li a {
	width: 100%;
	display: block;
	padding: 5%;
	color: #fff;
	font-weight: bold;
}


/* contact */
p.contact-txt {
	text-align: center;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 2.8rem;
	position: relative;
	display: inline-block;
	padding: 5px 10px;
	margin: 0 auto 2%;
}
/*p.contact-txt::before,
p.contact-txt::after {
	content: "";
	width: 1px;
	height: 100%;
	display: block;
	background: #000;
	position: absolute;
}
p.contact-txt::before {
	content: "";
	-webkit-transform: skewX(30deg);
	-ms-transform: skewX(30deg);
	transform: skewX(30deg);
	top: 0;
	left: 3%;
}
p.contact-txt::after {
	content: "";
	-webkit-transform: skewX(-30deg);
	-ms-transform: skewX(-30deg);
	transform: skewX(-30deg);
	top: 0;
	right: 3%;
}*/
p.contact-txt span {
	font-size: 1.8rem;
	background: #fff;
	border: 2px solid #000;
	padding: 0.3em 0.5em;
	display: inline-block;
	margin-top: 0.3em;
}

ul.contact-list,
ul.form-list {
	width: 100%;
}

ul.contact-list li,
ul.form-list li {
	position: relative;
	margin-bottom: 5%;
	width: 100%;
}

ul.contact-list li .inner a::before,
ul.form-list li .inner a::before {
	content: "";
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: block;
	position: absolute;
	top: 50%;
	left: 5%;
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
	transition: all .5s ease 0s;
	opacity: 0.3;
}

ul.contact-list li:first-child .inner a::before {
	background: url(../img/common/icon_tel.svg) no-repeat #fff;
	background-position: center center;
	background-size: 40px 40px;
}

ul.contact-list li:last-child .inner a::before {
	background: url(../img/common/icon_mail.svg) no-repeat #fff;
	background-position: center center;
	background-size: 40px 40px;
}

ul.form-list li:nth-child(1) .inner a::before {
	background: url(../img/common/icon_business.svg) no-repeat #fff;
	background-position: center center;
	background-size: 40px 40px;
}
ul.form-list li:nth-child(2) .inner a::before {
	background: url("../img/common/icon_recruit.svg") no-repeat #fff;
	background-position: center center;
	background-size: 40px 40px;
}
ul.form-list li:nth-child(3) .inner a::before {
	background: url(../img/common/icon_mail.svg) no-repeat #fff;
	background-position: center center;
	background-size: 40px 40px;
}

ul.contact-list li .inner a:hover::before,
ul.form-list li .inner a:hover::before {
	-webkit-transform: translate(0, -50%) scale(1.1,1.1);
	-ms-transform: translate(0, -50%) scale(1.1,1.1);
	transform: translate(0, -50%) scale(1.1,1.1);
	opacity: 0.4;
}

ul.contact-list li,
ul.form-list li {
	width: 100%;
	margin-bottom: 10px;
	display: block;
	/*font-weight: bold;*/
	font-size: 1.6rem;
	text-align: center;
	transition: all .5s ease 0.5s;
	/*visibility: hidden;*/
}

ul.contact-list li .inner p,
ul.form-list li .inner p {
	color: #fff;
}

ul.contact-list li:first-child .inner p {
	line-height: 2.2rem;
    font-size: 1.4rem;
}

ul.contact-list li .inner p.tel {
	font-family: 'Josefin Sans', sans-serif;
	font-size: 2.6rem;
	line-height: 3.8rem;
}

ul.contact-list li:last-child .inner p {
	line-height: 6rem;
	font-size: 1.6rem;
}

ul.contact-list li p.caption {
	font-size: 1.4rem;
	text-align: left;
	margin: 10px 0 20px;
}

ul.form-list li .inner p {
	font-size: 1.6rem;
	line-height: 2.2rem;
}
ul.form-list li .inner p br:nth-child(1) {
	display: none;
}



/* SERVICE */
.comingsoon-wrap p {
	text-align: center !important;
	display: block;
}

ul.service-list li {
	width: 100%;
	margin-bottom: 5%;
	position: relative;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	transition: all .5s linear 0s;
	overflow: hidden;
}

ul.service-list li .inner {
	margin: 0;
	width: 100%;
	position: relative;
	background: -webkit-linear-gradient(-30deg, #000 49.9%, #535353 50%);
	background: linear-gradient(-60deg, #000 49.9%, #535353 50%);
	background-position: right top;
	background-size: 400% 100%;
	transition: all .5s linear 0s;
}

ul.service-list li .inner:hover {
	background-position: left top;
}

ul.service-list li a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	text-indent: -9999px;
	z-index: 1;
}

ul.service-list li .inner figure,
ul.service-list li .inner .service-list-txt {
	width: 100%;
}

ul.service-list li .inner figure {
	overflow: hidden;
	position: relative;
	height: 190px;
}

ul.service-list li .inner figure img {
	transition: all .5s ease-out;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
    position: absolute;
    width: auto;
    height: auto;
    top: 50%;
    left: 50%;
    min-height: 100%;
    min-width: 100%;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
@supports ( object-fit: cover ) {
    ul.service-list li .inner figure img {
        position: static;
        height: 100%;
        width: 100%;
        left: 0;
        -o-object-fit: cover;
        object-fit: cover;
        top: 0;
        -ms-transform: none;
        -moz-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

ul.service-list li:hover .inner figure img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	opacity: 0.6;
}

ul.service-list li .inner .service-list-txt {
	padding: 30px 5%;
}
ul.service-list li .inner .service-list-txt h3 {
	color: #fff;
	text-align: center;
	margin-bottom: 1rem;
}
ul.service-list li .inner .service-list-txt p {
	color: #ccc;
	position: relative;
}
ul.service-list li .inner .service-list-txt p.btn-more,
ul.marketing-list li .inner p.btn-more {
	margin: 2rem auto 0;
	padding: 10px;
	text-align: center;
	width: 80%;
	border: 2px solid #ccc;
	transition: all 0.7s ease;
}
ul.service-list li .inner .service-list-txt p.btn-more::after,
ul.marketing-list li .inner p.btn-more::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	right: 15px;
	top: 50%;
	transition: all 0.7s ease;
}
ul.service-list li:hover .inner .service-list-txt p.btn-more,
ul.marketing-list li:hover .inner p.btn-more {
	background: #fff;
	color: #000;
	border-color: #fff;
}
ul.service-list li:hover .inner .service-list-txt p.btn-more::after,
ul.marketing-list li:hover .inner p.btn-more::after {
	-webkit-animation: arrow 0.7s ease 0s forwards;
	animation: arrow 0.7s ease 0s forwards;
	border-color: #000;
}


.sub-title-area {
    width: 100%;
    position: relative;
    margin: 10rem auto 3rem;
    text-align: center;
}
.sub-title-area h3 span.main-txt {
    font-family: 'Josefin Sans', sans-serif;
    text-align: center;
    font-size: 3.0rem;
    position: relative;
    display: block;
    width: auto;
}
.sub-title-area h3 span.sub-txt {
    font-size: 1.3rem;
    font-weight: bold;
    display: inline-block;
    text-align: center;
    line-height: 2.2rem;
    padding: 0 1em 0;
    color: #fff;
    position: relative;
    background: #000;
}

.marketing .copy-txt span {
	display: inline-block;
}

ul.marketing-list li {
	position: relative;
	background: #000;
	color: #fff;
    box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
    transition: all .5s linear 0s;
    overflow: hidden;
	margin-bottom: 5%;
}
ul.marketing-list li .inner {
	position: relative;
	height: 100%;
	display: flex;
    flex-direction: column;
	padding-bottom: 20px;
}
.casting ul.marketing-list li .inner,
.creative ul.marketing-list li .inner {
	padding-bottom: 0;
}
ul.marketing-list li .inner .marketing-list-txt {
	padding: 15px 15px 20px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
ul.marketing-list li h4 {
	font-size: 1.6rem;
	padding: 10px 12px 10px 15px;
	display: inline-block;
	position: absolute;
	background: #000;
	top: 5%;
	left: 0px;
}
ul.marketing-list li h4::before {
    content: "";
    width: 20px;
    height: 100%;
    background: #000;
    transform: skew(-20deg);
    position: absolute;
    right: -12px;
    top: 0;
}
ul.marketing-list li figure {
	overflow: hidden;
}
ul.marketing-list li figure img {
	transition: all .5s ease-out;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
ul.marketing-list li:hover figure img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	opacity: 0.6;
}
.casting ul.marketing-list li .inner:hover,
.creative ul.marketing-list li .inner:hover {
	background-position: right 0;
}
.casting ul.marketing-list li:hover figure img,
.creative ul.marketing-list li:hover figure img {
	-webkit-transform: scale(1.0,1.0);
	-ms-transform: scale(1.0,1.0);
	transform: scale(1.0,1.0);
	opacity: 1.0;
}
ul.marketing-list li h3 {
	text-align: left;
	width: 100%;
	padding: 10px 15px;
	font-weight: bold;
	display: block;
	font-size: 1.4rem;
	color: #fff;
	text-decoration: none;
	letter-spacing: 0.2rem;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}
ul.marketing-list li p.btn-txt {
	color: rgba(255,255,255,0.8);
	padding: 15px 15px 15px;
}
ul.marketing-list li .inner p.btn-more {
	margin: auto auto 0 !important;
	position: relative;
}

ol.service-value,
ol.service-solution {
	counter-reset: value-count;
	list-style: none;
	padding: 0;
}
ol.service-value li,
ol.service-solution li {
	margin-bottom: 20px;
	margin-left: 70px;
	position: relative;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
	align-items: center;
	-ms-flex-align: center; /*IE10*/
	-webkit-box-align: center; /* Android4.3以下、Safari3.1〜6.0 */
	-webkit-align-items: center; /* Safari6.1以降 */
	z-index: 2;
}
ol.service-value li p,
ol.service-value li dl,
ol.service-solution li p {
	position: relative;
	font-weight: bold;
	background: #f5f5f5;
	padding: 20px;
	box-shadow: 8px 8px 10px rgba(0,0,0,0.15);
	z-index: 2;
	display: block;
	width: 100%;
}
ol.service-value li p span,
ol.service-solution li p span {
	font-weight: normal;
	margin-top: 1rem;
	display: inline-block;
}
ol.service-value li::before,
ol.service-solution li::before {
	content: counter(value-count);
	counter-increment: value-count;
	background: #000;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 3.6rem;
	display: block;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.15);
	line-height: 50px;
	text-align: center;
	height: 50px;
	width: 50px;
	border-radius: 50%;
	-webkit-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    transform: translate(0,-50%);
	position: absolute;
	top: 50%;
	left: -70px;
}
ol.service-value li::after,
ol.service-solution li::after {
	content: "";
    display: block;
    width: 20px;
    height: 20px;
	background: #f5f5f5;
	box-shadow: -3px 5px 10px rgba(0,0,0,0.15);
    -webkit-transform: translate(0,-50%) rotate(-45deg) skew(20deg,20deg);
    -ms-transform: translate(0,-50%) rotate(-45deg) skew(20deg,20deg);
    transform: translate(0,-50%) rotate(-45deg) skew(20deg,20deg);
    position: absolute;
    top: 50%;
    left: -8px;
    z-index: 1;
}
ol.service-value li dl,
ol.service-solution li dl {
	position: relative;
	font-weight: bold;
	background: #f5f5f5;
	padding: 10px 0 20px;
	box-shadow: 8px 8px 10px rgba(0,0,0,0.15);
	z-index: 2;
	display: block;
	width: 100%;
}
ol.service-value li dl dt,
ol.service-solution li dl dt {
	padding: 10px 20px 0;
}
ol.service-solution li dl dt span {
	font-weight: normal;
	display: block;
}
ol.service-value li dl dd,
ol.service-solution li dl dd {
	/*display: none;*/
}

ol.service-value li p,
ol.service-value li dl,
ol.service-solution li p {
	padding: 50px;
}

ol.service-value li dl,
ol.service-solution li dl {
	padding: 20px 0 20px;
}
ol.service-value li dl dt,
ol.service-solution li dl dt {
	font-weight: bold;
	font-size: 1.7rem;
	background: /*#e4e4e4*/#000;
	color: #fff;
	margin-right: 20px;
	padding: 5px 15px;
	display: inline-block;
	position: relative;
	margin-bottom: 1.4rem;
}
ol.service-solution li dl dt span {
	font-size: 1.5rem;
	font-weight: normal;
	display: inline-block;
	margin-left: 1rem;
}
ol.service-value li dl dd,
ol.service-solution li dl dd {
	padding: 0 20px;
	font-weight: normal;
	line-height: 3rem;
	display: block;
}

ol.service-value li dl dd .value-bnr img {
	width: auto;
	max-height: 72px;
}

figure.service-img {
	margin: 0 -25px;
	padding: 30px 0;
	background: #f5f5f5;
}

#service-contact,
#inhouse_contact,
#marketing_contact {
	text-align: center;
	background: #f5f5f5;
}
#main-inner #content-contact {
	text-align: center;
	width: 100%;
    margin: 0 auto 20%;
	padding-top: 0;
}
.contact-area {
	background: #f5f5f5;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	padding: 3% 5%;
}

/* media */
ul.media-list {
}

ul.media-list li:last-child {
	margin-bottom: 0;
}

ul.media-list li figure {
	overflow: hidden;
}

ul.media-list li figure img {
	transition: all .5s ease-out;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

ul.media-list li:hover figure img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	opacity: 0.6;
}

ul.media-list li h4 {
	text-align: left;
	width: 100%;
	padding: 10px 15px;
	font-weight: bold;
	display: block;
	font-size: 1.4rem;
	color: #fff;
	text-decoration: none;
	letter-spacing: 0.2rem;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}

.casting .swiper-container {
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
}
.casting-case {
	width: 100vw;
	position: relative;
	box-sizing: border-box;
	margin-left: calc(-50vw + 50%);
}
.swiper-button-next, .swiper-button-prev {
	color: #00a2d5 !important;
}
.swiper-button-prev, .swiper-rtl .swiper-button-next {
	left: 16px !important;
}
.swiper-button-next, .swiper-rtl .swiper-button-prev {
	right: 16px !important;
}
.swiper-pagination-bullet {
	background: #fff !important;
}
.swiper-pagination-bullet-active {
	background: #00a2d5 !important;
}

.lum-lightbox {
    background: rgba(0,0,0,.8) !important;
}
.lum-lightbox.lum-open {
    display: block;
    z-index: 9999 !important;
}
.gallery-case-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.gallery-case-wrapper li {
	width: 46%;
	margin-bottom: 20px;
	background: #000;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	position: relative;
	overflow: hidden;
}

.gallery-case-wrapper li img {
	transition: all .5s ease-out;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.gallery-case-wrapper li:hover img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	opacity: 0.6;
}
.gallery-case-wrapper li p {
	font-weight: bold;
	color: #fff;
	background: #000;
	padding: 5px 10px;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}

.lum-lightbox-inner img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
}
@media (max-width: 460px) {

	.lum-lightbox-inner img {
		max-width: 100% !important;  /* 好きなサイズ感で */
		max-height: 88vh !important;  /* 90vhだと数pxだけ上下にスクロールできてしまうためこのサイズ */
		/* display: block;  を追加すると max-height: 92vh くらいでも大丈夫 */
	}

　 /* 矢印ナビが大きすぎると感じたら */
	.lum-gallery-button:after {
		width: 6vw !important;
		height: 6vw !important;
	}
	.lum-lightbox-caption {
		/* width: 100%; */
		position: absolute;
		bottom: 0;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		-ms-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
}

/*SERVICE > web marketing*/
ul.tabs {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 60px 0 5%;
}

ul.tabs li {
	width: 100%;
	margin-right: 0;
	margin-bottom: 15px;
}
ul.tabs li:last-child {
	margin-right: 0;
}

ul.tabs li a {
	width: 100%;
	position: relative;
	padding: 6px 5px 18px;
	font-size: 1.4rem;
	color: #000;
	border: 2px solid #000;
	margin: 0 auto;
	display: block;
	text-align: center;
	box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
	transition:  all 0.3s ease 0s;
	font-weight: bold;
	cursor: pointer;
}

ul.tabs li a:hover,
ul.tabs li a.active {
	color: #fff;
	background: #000;
	padding: 12px 5px 12px;
}

ul.tabs li a::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: rgba(0,0,0,0);
	-webkit-transform: translate(0,-50%) rotate(135deg);
	-ms-transform: translate(0,-50%) rotate(135deg);
	transform: translate(0,-50%) rotate(135deg);
	position: absolute;
	left: 48%;
	bottom: 3px;
	transition: all .3s ease 0s;
}

ul.tabs li a:hover::after,
ul.tabs li a.active::after {
	bottom: -10px;
	background: #000;
}
.tab-content.hide {
	display: none;
}

.tab-content section {
    margin: 0 auto 10rem;
}
.tab-content section .sub-title-area {
    margin: 0 auto 3rem;
}

/*SERVICE > web marketing > inhouse*/
.inhouse-support {
	width: 100%;
	display: block;
}
.inhouse-support figure {
    margin: 0 -25px 20px;
    padding: 0;
    background: #f5f5f5;
}
.inhouse-support figure img {
	max-width: 500px;
}
.inhouse-support ul li {
	font-size: 1.5rem;
	line-height: 2rem;
	margin-bottom: 0.8rem;
	position: relative;
	padding-left: 20px;
}
.inhouse-support ul li:last-child {
	margin-bottom: 0;
}
.inhouse-support ul li::before {
	content: "";
	background: #cbcbcb;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: block;
	position: absolute;
	top: 6px;
	left: 0;
	
}

ol.inhouse-flow {
	counter-reset: value-count;
	list-style: none;
	padding: 0;
	position: relative;
}
ol.inhouse-flow li {
	margin-bottom: 20px;
	margin-left: 70px;
	position: relative;
	background: #f5f5f5;
	padding: 15px 0 20px;
	box-shadow: 8px 8px 10px rgba(0,0,0,0.15);
	z-index: 2;
	display: block;
}
ol.inhouse-flow li::before {
	content: counter(value-count);
	counter-increment: value-count;
	background: #000;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 3.6rem;
	display: block;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.15);
	line-height: 50px;
	text-align: center;
	height: 50px;
	width: 50px;
	border-radius: 50%;
	position: absolute;
	top: 10px;
	left: -70px;
	z-index: 2;
}
ol.inhouse-flow li:nth-last-child(n+2)::after {
	content: "";
	width: 2px;
	height: 100%;
	background: #000;
	position: absolute;
	top: 44px;
	left: -46px;
	z-index: 1;
}
ol.inhouse-flow li h4 {
	font-weight: bold;
	font-size: 1.6rem;
	background: /*#e4e4e4*/#000;
	color: #fff;
	margin-right: 0;
	padding: 5px 20px;
	display: inline-block;
	position: relative;
	margin-bottom: 1rem;
}
ol.inhouse-flow li h4::before {
	content: "";
    display: block;
    width: 20px;
    height: 2px;
	background: #000;
    position: absolute;
    top: 18px;
    left: -20px;
    z-index: 1;
}
ol.inhouse-flow li h4 span {
	font-size: 1.5rem;
	font-weight: normal;
}
ol.inhouse-flow li p {
	padding: 0 20px;
	line-height: 2.4rem;
}

ol.inhouse-flow li p.caption {
	font-size: 1.2rem;
	line-height: 1.6rem;
}

.inhouse-worry {
	width: 100%;
	display: block;
}
.inhouse-worry figure,
.inhouse-worry .txt-area {
	width: 100%;
	max-width: 500px;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.15);
}
.inhouse-worry figure {
	background: #f5f5f5;
	display: flex;
}
.inhouse-worry figure img {
	align-self: center;
}
.inhouse-worry .txt-area {
	background: #f5f5f5;

	display: flex;
	flex-direction: column;
}
.inhouse-worry .txt-area .worry-q {
	padding: 20px;
	font-weight: bold;
	position: relative;
}
.inhouse-worry .txt-area .worry-q::after {
	content: "";
	width: 30px;
	height: 30px;
	background: #f5f5f5;
	display: block;
	-webkit-transform: translate(-50%,0) rotate(135deg);
	-ms-transform: translate(-50%,0) rotate(135deg);
	transform: translate(-50%,0) rotate(135deg);
	position: absolute;
	bottom: -12px;
	left: 50%;
}
.inhouse-worry .txt-area .worry-a {
	padding: 20px;
	width: 100%;
	background: #000;
	color: #fff;
	font-weight: bold;
	margin-top: auto;
}
.inhouse-worry .txt-area .worry-q li {
	padding: 0 0 0 34px;
	position: relative;
	line-height: 3rem;
	margin-bottom: 20px;
}
.inhouse-worry .txt-area .worry-q li:last-child {
	margin-bottom: 0;
}
.inhouse-worry .txt-area .worry-q li::before {
	content: "?";
	font-family: 'Josefin Sans', sans-serif;
	font-size: 2.4rem;
	line-height: 3.6rem;
	color: #fff;
	text-align: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #000;
	position: absolute;
	top: 0;
	left: 0;
}
.inhouse-worry .txt-area .worry-a li {
	padding: 0 20px 0 20px;
	position: relative;
	line-height: 3rem;
	margin-bottom: 30px;
}
.inhouse-worry .txt-area .worry-a li:last-child {
	margin-bottom: 0;
}
.inhouse-worry .txt-area .worry-a li::before {
	content: "";
	width: 15px;
	height: 30px;
	border-top: 1px solid #999999;
	border-left: 1px solid #999999;
	position: absolute;
	top: 0;
	left: 0;
}
.inhouse-worry .txt-area .worry-a li::after {
	content: "";
	width: 15px;
	height: 30px;
	border-bottom: 1px solid #999999;
	border-right: 1px solid #999999;
	position: absolute;
	bottom: 0;
	right: 0;
}
.price-wrap .table-border {
	border-top: 1px solid #ccc;
}
.price-wrap .table-border tr th {
	text-align: center;
}
.price-wrap .table-border tr th span {
	background: #e5e5e5;
	display: block;
	width: 100%;
	padding: 2px 3px;
}
.price-wrap .table-border tr td {
	text-align: center;
}
.price-wrap .table-border tr td span {
	font-size: 1.2rem;
	line-height: 1.8rem;
}

/* SERVICE > marketing > consulting */
#trouble {
	width: 100%;
	background: #f5f5f5;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	margin: 0 auto;
	padding: 3% 5%;
}

#trouble p {
	font-size: 2.2rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 20px;
}
.trouble-list {
	width: 100%;
	margin: 0 auto 20px;
}
.trouble-list li {
	width: 100%;
	background: #000;
	color: #fff;
	font-size: 1.7rem;
	font-weight: bold;
	text-align: center;
	padding: 30px;
	position: relative;
}
.trouble-list li::before {
	content: "?";
	font-family: 'Josefin Sans', sans-serif;
	position: absolute;
	display: block;
	color: rgba(255,255,255,0.1);
	font-size: 16rem;
	top: 50%;
	right: -10px;
	transform: translate(0,-40%);
}
.trouble-list li::after {
	content: "";
	position: absolute;
	display: block;
	width: 20px;
	height: 20px;
	background: #000;
	bottom: -10px;
	left: 50%;
	transform: translate(-50%, 0) rotate(-45deg);
}

p.copy-txt-m {
	font-size: 2.0rem;
	font-weight: bold;
	margin-bottom: 2%;
}


/* NEWS */



/* RECRUIT */
.recruit-company {
    box-shadow: 5px 5px 10px rgba(0,0,0,0.15);
	position: relative;
	margin: 10% auto 15%;
}
.recruit-company h4 {
	color: #fff;
	font-weight: 700;
	font-size: 1.6rem;
    padding: 10px 12px 10px 15px;
    display: inline-block;
    position: absolute;
    background: #000;
	top: -10%;
	left: 0;
	z-index: 10;
}
.recruit-company h4::before {
	content: "";
    width: 20px;
    height: 100%;
    background: #000;
    transform: skew(-20deg);
    position: absolute;
    right: -12px;
    top: 0;
}
.recruit-slide-wrap {
	width: 100%;
	position: relative;
	background: #000;
}
.recruit-slider .swiper-slide {
	background: #000;
	position: relative;
}
.recruit-slider .swiper-slide p {
	color: #fff;
	background: #000;
	padding: 10px 10px 30px;
}
.recruit-slide-wrap .swiper-button-prev, .recruit-slide-wrap .swiper-rtl .swiper-button-next {
	left: -16px !important;
}
.recruit-slide-wrap .swiper-button-next, .recruit-slide-wrap .swiper-rtl .swiper-button-prev {
	right: -16px !important;
}
.recruit-photo {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	margin-top: 0;
	margin-bottom: 50px;
	display: flex;
}
.recruit-photo li {
	width: calc( (100% - 2px) / 3);
	margin-right: 1px;
}
.recruit-photo li:last-child {
	margin-right: 0;
}

.recruit-list {
	width: 100%;
    display: block;
	margin: 0 auto;
}
.recruit-list dl {
	background: #f5f5f5;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.15);
	margin-bottom: 20px;
}
.recruit-list dl dt {

}
.recruit-list dl dt a {
	color: #fff;
	display: block;
	padding: 20px;
	width: 100%;
	background: #000;
	text-align: center;
	font-weight: bold;
	position: relative;
	transition: all .3s ease 0s;
}
.recruit-list dl dt a::after {
	content: "";
    width: 20px;
    height: 20px;
    background: #000;
    display: block;
    -webkit-transform: translate(-50%,0) rotate(135deg);
    -ms-transform: translate(-50%,0) rotate(135deg);
    transform: translate(-50%,0) rotate(135deg);
    position: absolute;
    bottom: -8px;
    left: 50%;
	transition: all .3s ease 0s;
}
.recruit-list dl dt a:hover {
	background: #494949;
}
.recruit-list dl dt a:hover::after {
	background: #494949;
}
.recruit-list dl dd {
	padding: 20px 50px 30px;
}
.recruit-list dl dd ul li {
	margin-top: 5px;
	padding-left: 1.5rem;
	position: relative;
}
.recruit-list dl dd ul li::before {
	content: "";
    width: 6px;
    height: 6px;
    background: #000;
    display: block;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    position: absolute;
    left: 0;
	top: 9px;
}
.recruit-list dl dd ul li a:hover {
	text-decoration: underline;
}

#entry ul.contact-list li {
	margin: 0 auto;
	width: 100%;
}


.recruit-set {
	padding: 3% 0 6%;
}
.recruit-set:last-of-type {
	padding: 3% 0 0;
}

.recruit-not-txt {
	text-align: center;
	font-weight: bold;
	margin-top: 2em;
	font-size: 1.6rem;
}

body.recruit h3 {
	text-align: center;
	background: #f5f5f5;
	padding: 15px;
	width: 100%;
    margin: 30px 0 10px;
}

ul.entry-skill li {
	margin-bottom: 5px;
	padding-left: 1.2rem;
	position: relative;
}
ul.entry-skill li::before {
	content: "";
    width: 4px;
    height: 4px;
    background: #000;
    display: block;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    position: absolute;
    left: 0;
	top: 10px;
}
ul.entry-skill li:last-child {
	margin-bottom: 0;
}

ul.entry-flow li {
	display: inline-block;
	background: #f5f5f5;
	padding: 5px 10px;
	position: relative;
	margin-right: 20px;
	margin-top: 5px;
}

ul.entry-flow li::after {
	content: "";
	width: 10px;
	height: 10px;
	border-top: 1px solid #000;
	border-right: 1px solid #000;
	-webkit-transform: translate(0,-50%) rotate(45deg);
	-ms-transform: translate(0,-50%) rotate(45deg);
	transform: translate(0,-50%) rotate(45deg);
	position: absolute;
	top: 50%;
	right: -15px;
}
ul.entry-flow li:last-child::after {
	content: none;
}

a.btn-entry {
	position: relative;
	padding: 15px 40px 15px 15px;
	font-size: 1.8rem;
	text-align: center;
	color: #000;
	border: 2px solid #000;
	margin: 20px auto 0;
	width: 90%;
	max-width: 400px;
	display: block;
	box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
	transition:  all 0.3s ease 0s;
}

a.btn-entry:hover {
	color: #fff;
	background: #000;
	padding: 15px 30px 15px 25px;
}

a.btn-entry::after {
	content: "";
	display: block;
	width: 12px;
	height: 12px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	right: 15px;
	top: 50%;
	transition: all 0.7s ease;
}

a.btn-entry:hover::after {
	-webkit-animation: arrow 0.7s ease 0s forwards;
	animation: arrow 0.7s ease 0s forwards;
	border-color: #fff;
}


/* COMPANY */

.value-wrap {
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
	display: flex;
	-ms-flex-wrap: wrap; /*IE10*/
	-webkit-flex-wrap: wrap; /* Safari6.1以降 */
	flex-wrap: wrap;
	-ms-flex-pack: justify; /*IE10*/
	-webkit-box-pack: justify; /* Android4.3以下、Safari3.1〜6.0 */
	-webkit-justify-content: space-between; /* Safari6.1以降 */
	justify-content: space-between;
}

.value-wrap dl {
	width: 100%;
	min-height: 140px;
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
	display: flex;
	-webkit-justify-content: center; /* Safari6.1以降 */
	justify-content: center;
	-ms-flex-align: center; /*IE10*/
	-webkit-box-align: center; /* Android4.3以下、Safari3.1〜6.0 */
	-webkit-align-items: center; /* Safari6.1以降 */
	align-items: center;
	background: #f5f5f5;
}

.value-wrap dl dt,
.value-wrap dl dd {
	width: 50%;
	height: 100%;
	min-height: 140px;
	padding: 10px 20px;
	position: relative;
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
	display: flex;
	-webkit-justify-content: center; /* Safari6.1以降 */
	justify-content: center;
	-ms-flex-align: center; /*IE10*/
	-webkit-box-align: center; /* Android4.3以下、Safari3.1〜6.0 */
	-webkit-align-items: center; /* Safari6.1以降 */
	align-items: center;
	text-align: center;
}

.value-wrap dl dt {
	width: 50%;
	height: 100%;
	background: #000;
	font-family: 'Josefin Sans', sans-serif;
	color: #eee;
	position: relative;
	font-size: 2.8rem;
}

.value-wrap dl dt::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border: 15px solid transparent;
	border-left: 15px solid #000;
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	transform: translate(0,-50%);
	position: absolute;
	top: 50%;
	right: -30px;
	z-index: 0;
}

.value-wrap dl dd {
	width: 50%;
	height: 100%;
	font-size: 1.6rem;
	font-weight: bold;
}

p.message-name {
	font-weight: bold;
	margin-top: 1rem;
}

.history-wrap {
	width: 100%;
	position: relative;
	padding: 20px 0 0 0;
}

.history-wrap::before,
.history-wrap::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 14px;
	width: 2px;
	height: 100%;
	border-left: 2px solid #000;
	-webkit-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.history-wrap::after {
	height: 34px;
	border-left: 2px dotted #fff;
}

.history-wrap .history-inner {
	width: auto;
	display: block;
	margin: 20px 0 0 0;
}

.history-wrap .history-inner:first-child {
	margin-top: 0;
}

.history-wrap .history-inner:last-child {
	margin-top: 30px;
}

.history-wrap .history-inner dl {
	width: auto;
	margin: 0 0 0 44px;
	position: relative;
	background: #f5f5f5;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	display: inline-block;
}

.history-wrap .history-inner:last-child dl {
	margin: 0 0 0 0;
}

.history-wrap .history-inner dl::before {
	content: "";
	display: block;
	position: absolute;
	top: 18px;
	width: 30px;
	height: 2px;
	background: #000;
}

.history-wrap .history-inner dl::after {
	content: "";
	display: block;
	position: absolute;
	top: 14px;
	width: 10px;
	height: 10px;
	background: #000;
	border: 2px solid #000;
	border-radius: 50%;
	-webkit-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.history-wrap .history-inner:last-child dl::before,
.history-wrap .history-inner:last-child dl::after {
	content: none;
}

.history-wrap .history-inner dl dt {
	font-size: 2.8rem;
	display: block;
}

.history-wrap .history-inner:nth-last-child(n+2) dl dt {
	font-family: 'Josefin Sans', sans-serif;
}

.history-wrap .history-inner dl dd {
	padding: 0px 20px 15px;
	margin: 0;
	display: inline-block;
}


.history-wrap .history-inner:last-child dl {
	position: relative;
	width: 100%;
}

.history-wrap .history-inner:last-child dl dt {
	width: 62px;
	height: 62px;
	border-radius: 50%;
	position: absolute;
	top: -16px;
	left: 16px;
	background: #000;
	display: block;
	color: #fff;
	text-align: center;
	padding: 0;
	font-size: 1.8rem;
	line-height: 62px;
	font-weight: bold;
	-webkit-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.history-wrap .history-inner:last-child dl dd {
	padding: 20px 15px;
	margin: 0;
	font-weight:bold;
	text-align: center;
	font-size: 1.8rem;
	width: 100%;
}

.data-wrap,
.price-wrap,
.contact-wrap {
	width: 100%;
	margin: 0;
}

table.table-border {
	width: 100%;
	border-collapse: collapse;
}

table.table-border tr th,
table.table-border tr td {
	padding: 10px;
	width: 100%;
	display: block;
}

table.table-border tr th {
	font-weight: bold;
	padding-bottom: 5px;
	text-align: left;
}

table.table-border tr td {
	padding-top: 0;
	border-bottom: 1px solid #ccc;
}

.gmap-link span {
	position: relative;
	color: #33b9e7;
	border-bottom: 1px solid #33b9e7;
	padding-right: 2rem;
	display: inline-block;
}

.gmap-link span::before,
.gmap-link span::after {
	content: "";
	width: 12px;
	height: 12px;
	border: 1px solid #33b9e7;
	background: #fff;
	position: absolute;
	top: 4px;
	right: 0;
}

.gmap-link span::before {
	top: 7px;
	right: 3px;
}


/* CONTACT */
form#mail_form {
	-webkit-display: flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
}

form#mail_form dl{
	overflow : hidden;
	width: 100%;
	margin: 30px auto 0;
	box-sizing: border-box;
	-webkit-display: flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-content: center;
	align-content: center;
}

form#mail_form dl dt,
form#mail_form dl dd{
	width: 100%;
	/*-webkit-display: flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;*/
	text-align: left;
}
form#mail_form dl dt {
	font-weight: bold;
	width: 100%;
	display: flex;
	padding: 10px 10px 0;
}
form#mail_form dl dd {
	width: 100%;
	display: flex;
	flex-direction: column;
	border-bottom: 1px solid #ccc;
	padding: 5px 10px 10px;
}
form#mail_form dl dt i,
form#mail_form dl dt span {
	font-style: normal;
}
form#mail_form dl dt i {
	order: -1;
}
form#mail_form dl dt i span,
form#mail_form dl dt span {
	order: -1;
	color: #fff;
	padding: 3px 10px;
	font-weight: normal;
	font-size: 1.2rem;
	display: inline-block;
	line-height: 20px;
	margin-right: 8px;
}

form#mail_form dl dt i span.required,
form#mail_form dl dt span.req {
	background: #00a2d5;
}

form#mail_form dl dt i span.optional,
form#mail_form dl dt span.opt {
	/*display: none;
	visibility: hidden;*/
	background: #ccc;
}

form#mail_form dl dd span.error_blank,
form#mail_form dl dd span.error_format,
form#mail_form dl dd span.error_match,
form#mail_form span.error_check {
	display : block;
	margin-top : 3px;
	width: 100%;
	color: #FF2B65;
	font-weight: bold;
}
dt.form-policy {
	width: 100%;
	margin: 0 auto 0;
	padding: 10px;
}
dd.form-policy {
	width: 100%;
	margin: 0 auto 20px;
	padding: 0 10px 10px;
	border-bottom: 1px solid #ccc;
}
div#agreement {
	width: 100%;
	margin: 0 auto 30px;
	padding: 10px;
	border-bottom: 1px solid #ccc;
}

div#agreement h3 {
	display: flex;
}
div#agreement h3,
dt.form-policy {
	font-size: 1.5rem;
	font-weight: bold;
	background: transparent;
    padding: 0;
    margin: 0;
    text-align: left;
}

div#agreement h3 span,
dt.form-policy span {
	order: -1;
	color: #fff;
	padding: 3px 10px;
	font-weight: normal;
	font-size: 1.2rem;
	display: inline-block;
	line-height: 20px;
	margin-right: 8px;
	background: #00a2d5;
}

div#agreement div {
	height: 200px;
	margin: 10px 0;
	padding: 10px 15px;
	background: #fafafa;
	border: 1px solid #cccccc;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}
.form-policy div {
	height: 200px;
	margin: 0 0 10px;
	padding: 10px 15px;
	background: #fafafa;
	border: 1px solid #cccccc;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}

div#agreement div h4,
.form-policy div h4 {
	margin-top: 30px;
	font-weight: bold;
}

div#agreement div h4:first-child,
.form-policy div h4:first-child {
	margin-top: 0px;
}

div#agreement input[type="radio"],
.form-policy input[type="radio"] {
	margin-right: 10px;
}

div#agreement p,
div#agreement .policy-list li,
.form-policy p,
.form-policy .policy-list li {
	margin-bottom: 4px;
}

form#mail_form div#agreement span.error_check {
	display: none;
	/*color: #ff0000;*/
	margin-top: 3px;
}


/************************************
form
*************************************/

/*
reset
***********************/

button,
option,
select,
textarea,
input[type="button"],
input[type="submit"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="text"],
input[type="select"],
input[type="option"],
input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
    border: none;
    outline: 0;
    margin: 0;
    background: #fff;
}

/* デフォルトのradio、checkboxは非表示 */

input[type=radio]/*,
input[type=checkbox]*/ {
    display: none;
}

/* for firefox */

select {
    text-indent: 0.01px;
    text-overflow: '';
}

/* for ie10 ie11 ie系のプルダウンの矢印を消す ie9は非対応 */

select::-ms-expand {
    display: none;
}


textarea,
input[type="number"],
input[type="tel"],
input[type="email"],
input[type="text"] {
    width: 100%;
    padding: 8px 10px;
    font-size: 16px;
    font-size: 1.6rem;
    border: 1px solid #ccc;
	box-shadow: 3px 3px 0 0 #eee inset;
}

textarea {
    height: 100px; /* お好みの高さに */
}

/* フォーカス時の色変更 */
textarea:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="text"]:focus {
    border: 1px solid #333;
}

/* オートコンプリート機能の背景黄色を変更 */
input:-webkit-autofill {
    -webkit-box-shadow: 3px 3px 0 0 #eee inset, 0 0 0px 1000px #fff inset;
}

.form-select {
    display: block;
    position: relative;
    width: 100%;
    height: 42px;
    font-size: 16px;
    font-size: 1.6rem;
    border: 1px solid #ccc;
    overflow: hidden;
}

.form-select::after {
    position: absolute;
    display: block;
    content: '';
    width: 9px;
	height: 9px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: rgba(0,0,0,0);
	-webkit-transform: translate(0,-50%) rotate(135deg);
	-ms-transform: translate(0,-50%) rotate(135deg);
	transform: translate(0,-50%) rotate(135deg);
    top: 50%;
    right: 10px;
    margin-top: -3px;
    pointer-events: none;/* クリック出来るよう */
}

.form-select select {
    width: 100%;
    height: 42px;
    font-size: 16px;
    font-size: 1.6rem;
    padding: 8px 10px;
    border: none;
    position: relative;
	box-shadow: 3px 3px 0 0 #eee inset;
	cursor: pointer;
	color: #aaa;
}

.form-select select option {
	color: #000;
}

.form-select select option:first-child {
	color: #aaa;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: #aaa;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #aaa;
}
::placeholder{ /* Others */
	color: #aaa;
}

/* ラジオボタン+チェックボックス */
#mail_form label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    padding: 6px 5px 6px 30px;
}
#mail_form label::before,
#mail_form label::after {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

/* ラジオボタン */
.form-radio {
	margin-right: 0;
}
.form-radio li {
	display: inline-block;
	min-width: 120px;
}

#mail_form input[type=radio]+label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    padding: 9px 5px 8px 24px;
    margin-right: 0px;
}
#mail_form .col2 {
	flex-direction: row;
	flex-wrap: wrap;
}
#mail_form .col2 input[type=radio]+label {
	width: 100%;
	max-width: 120px;
}

#mail_form input[type=radio]+label::before,
#mail_form input[type=radio]+label::after {
    position: absolute;
    display: block;
    content: '';
    top: 10px;
    left: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

#mail_form input[type=radio]+label::before {
    width: 20px;
    height: 20px;
    background: #FFF;
    border: 1px solid #ccc;
}

#mail_form input[type=radio]+label::after {
    width: 10px;
    height: 10px;
    margin-top: 5px;
	margin-left: 5px;
    background: #f4f4f4;
}

#mail_form input[type=radio]:checked+label::after {
    background: #333;
}

/* チェックボックス */
#mail_form input[type=checkbox]+label::before,
#mail_form input[type=checkbox]+label::after {
    top: 8px;
}
#mail_form input[type=checkbox]+label::before {
    width: 20px;
    height: 20px;
    margin-top: 0;
    background: #FFF;
    border: 2px solid #ccc;
}
#mail_form input[type=checkbox]+label::after {
    width: 24px;
    height: 24px;
}
#mail_form input[type=checkbox]:checked+label::after {
    position: absolute;
    display: block;
    content: '';
    width: 20px;
	height: 10px;
	border-left: 3px solid #00a2d5;
	border-bottom: 3px solid #00a2d5;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
    left: 1px;
    top: 8px;
}
#mail_form .form-policy input[type=radio]+label {
	padding: 6px 5px 6px 30px;
}
#mail_form .form-policy input[type=radio]+label::before,
#mail_form .form-policy input[type=radio]+label::after {
	top: 8px;
    border-radius: 0;
}
#mail_form .form-policy input[type=radio]+label::before {
	border: 2px solid #ccc;
}
#mail_form .form-policy input[type=radio]+label::after {
    width: 24px;
    height: 24px;
	background: transparent;
}
#mail_form .form-policy input[type=radio]:checked+label::after {
    position: absolute;
    display: block;
    content: '';
    width: 20px;
	height: 10px;
	border-left: 3px solid #00a2d5;
	border-bottom: 3px solid #00a2d5;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
    left: 0;
    top: 4px;
}

#birth,
#postal,
#phone {
	max-width: 240px;
}
#address2 {
	margin-top: 10px;
}

.entry_year {
	min-width: 100px;
	max-width: 100px;
}
.entry_month,
.entry_day {
	min-width: 60px;
	max-width: 60px;
}
.dd-form-txt {
    display: flex !important;
    align-items: center !important;
    flex-direction: row !important;
}
.form-txt {
	line-height: 42px;
	padding: 0 10px 0 5px;
}

label.is-error > span {
  color: red;
}
label.is-error > input {
  border-color: red;
  background-color: rgba(200, 0, 0, 0.1);
}

.error {
  width : 100%;
  padding: 0;
  display: inline-block;
  font-size: 90%;
  color: #FF2B65;
  box-sizing: border-box;
}


span.loading{
	width : 50px;
	height : 50px;
	border-radius : 50%;
	border-top: 0.2em solid rgba(51, 185, 231, 0.2);
	border-right: 0.2em solid rgba(51, 185, 231, 0.2);
	border-bottom: 0.2em solid rgba(51, 185, 231, 0.2);
	border-left: 0.2em solid  rgba(51, 185, 231, 1.0);
	-webkit-transform : translateZ( 0 );
	-ms-transform : translateZ( 0 );
	transform : translateZ( 0 );
	-webkit-animation : load-circle 1.0s linear infinite;
	animation : load-circle 1.0s linear infinite;
	position : absolute;
	top : 50%;
	left : 50%;
	margin-top : -25px;
	margin-left : -25px;
}

#form_submit {
	text-align: center;
	margin-top: 20px;
}

form#mail_form input[type="button"],
form#mail_form input[type="submit"] {
	width: 90%;
    max-width: 400px;
    height: 50px;
	line-height: 100%;
	margin: 0 auto;
    display: block;
    position: relative;
    background: #fff;
    color: #000;
	font-weight: bold;
    text-align: center;
	box-sizing: border-box;
    border: 2px solid #000;
    cursor: pointer;
	transition: all 0.2s cubic-bezier(0.55, 0.085, 0.68, 0.53);
}

form#mail_form input[type="button"]:hover,
form#mail_form input[type="submit"]:hover {
	color: #fff;
	background: #000;
}

.form-button {
	-webkit-display: flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
}

.contact .btn,
.recruit .btn {
	width: 90%;
    max-width: 400px;
    height: 50px;
	line-height: 100%;
    position: relative;
    background: #fff;
    color: #000;
	font-weight: bold;
    text-align: center;
	box-sizing: border-box;
    border: 2px solid #000;
    cursor: pointer;
	-webkit-display: flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	transition: all 0.2s cubic-bezier(0.55, 0.085, 0.68, 0.53);
}

.contact .btn,
.recruit .btn {
	margin-top: 30px;
}

.contact .btn:hover,
.recruit .btn:hover {
	color: #fff;
	background: #000;
}

.contact .btn::after,
.recruit .btn::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: rgba(0,0,0,0);
	-webkit-transform: translateY(-50%) rotate(45deg);
	-ms-transform: translateY(-50%) rotate(45deg);
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	right: 15px;
	top: 50%;
	transition: all 0.7s ease;
}

.contact .btn:hover::after,
.recruit .btn:hover::after {
	-webkit-animation: arrow 0.7s ease 0s forwards;
	animation: arrow 0.7s ease 0s forwards;
	border-color: #fff;
}

.contact-wrap .thanks-txt {
	width: 100%;
	font-size: 2.0rem;
    text-align: center;
    line-height: 4rem;
    display: inline-block;
    margin: 1rem auto 2rem;
    font-weight: bold;
}



/* animation */

@-webkit-keyframes loader-spin {
	0%   {-webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg);}
	100% {-webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg);}
}
@keyframes loader-spin {
	0%   {-webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg);}
	100% {-webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg);}
}

@-webkit-keyframes arrow {
	0%   {-webkit-transform: translateX(0) translateY(-50%) rotate(45deg); transform: translateX(0) translateY(-50%) rotate(45deg); opacity: 1;}
	48%  {-webkit-transform: translateX(10px) translateY(-50%) rotate(45deg); transform: translateX(10px) translateY(-50%) rotate(45deg); opacity: 0;}
	52%  {-webkit-transform: translateX(-10px) translateY(-50%) rotate(45deg); transform: translateX(-10px) translateY(-50%) rotate(45deg); opacity: 0;}	
	100% {-webkit-transform: translateX(0) translateY(-50%) rotate(45deg); transform: translateX(0) translateY(-50%) rotate(45deg); opacity: 1;}		
}
@keyframes arrow {
	0%   {-webkit-transform: translateX(0) translateY(-50%) rotate(45deg); transform: translateX(0) translateY(-50%) rotate(45deg); opacity: 1;}
	48%  {-webkit-transform: translateX(10px) translateY(-50%) rotate(45deg); transform: translateX(10px) translateY(-50%) rotate(45deg); opacity: 0;}
	52%  {-webkit-transform: translateX(-10px) translateY(-50%) rotate(45deg); transform: translateX(-10px) translateY(-50%) rotate(45deg); opacity: 0;}	
	100% {-webkit-transform: translateX(0) translateY(-50%) rotate(45deg); transform: translateX(0) translateY(-50%) rotate(45deg); opacity: 1;}	
}

@-webkit-keyframes load-circle{
	0%  {-webkit-transform : rotate( 0deg ); transform : rotate( 0deg );}
	100%{-webkit-transform : rotate( 360deg ); transform : rotate( 360deg );}
}

@keyframes load-circle{
	0%  {-webkit-transform : rotate( 0deg ); transform : rotate( 0deg );}
	100%{-webkit-transform : rotate( 360deg ); transform : rotate( 360deg );}
}

/* 幅640 以下*/
@media screen and (max-width: 640px){
	/* SERVICE */
	.marketing .copy-txt {
		font-size: 1.8rem;
		line-height: 3.0rem;
	}
	
	/* NEWS */
	.news ul.news-list li .inner figure img {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		width: auto;
		height: 100%;
		transition: all .5s ease-out;
	}
	
	ul.news-list li:hover .inner figure img {
		-webkit-transform: translate(-50%, -50%) scale(1.1,1.1);
		-ms-transform: translate(-50%, -50%) scale(1.1,1.1);
		transform: translate(-50%, -50%) scale(1.1,1.1);
		opacity: 0.6;
	}
	
	
	/* SERVICE */
	.trouble-list li {
		margin-bottom: 30px;
	}
	
	/* COMPANY */
	.value-wrap dl:nth-child(2n) {
		-ms-flex-direction: row-reverse; /*IE10*/
		-webkit-box-direction: reverse; /* Android4.3以下、Safari3.1〜6.0 */
		-webkit-flex-direction: row-reverse; /* Safari6.1以降 */
	}
	
	.value-wrap dl:nth-last-child(2n+1) dt::after {
		border: 15px solid transparent;
		border-right: 15px solid #000;
		right: inherit;
		left: -30px;
	}
	
	p.message-name {
		text-align: right;
	}
	
	.history-wrap .history-inner dl::before {
		left: -30px;
	}
	
	.history-wrap .history-inner dl::after {
		left: -30px;
	}
	
	/* RECRUIT */
	.recruit-photo {
		flex-wrap: wrap;
	}
	.recruit-photo li:nth-child(1) {
		order: 2;
		width: calc(50% - 0.5px);
	}
	.recruit-photo li:nth-child(2) {
		order: 1;
		width: 100%;
		margin-bottom: 1px;
		margin-right: 0;
	}
	.recruit-photo li:nth-child(3) {
		order: 3;
		width: calc(50% - 0.5px);
		margin-right: 0;
	}
	
	ol.service-value li,
	ol.service-solution li {
		margin-bottom: 0;
		margin-left: 0;
		margin-top: 90px;
		position: relative;
		display: flex;
		flex-direction: column;
		z-index: 2;
	}
	ol.service-value li::before, 
	ol.service-solution li::before {
		-webkit-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		transform: translate(-50%,0);
		position: absolute;
		top: -70px;
		left: 50%;
	}
	ol.service-value li::after, 
	ol.service-solution li::after {
		-webkit-transform: translate(-50%,0) rotate(-135deg) skew(20deg,20deg);
		-ms-transform: translate(-50%,0) rotate(-135deg) skew(20deg,20deg);
		transform: translate(-50%,0) rotate(-135deg) skew(20deg,20deg);
		position: absolute;
		top: -8px;
		left: 50%;
	}
	ol.service-value li p {
		padding: 30px;
	}
	
	ul.marketing-list li:last-child {
		margin-bottom: 0;
	}
	
	.casting #solution,
	.creative #solution{
		margin-bottom: 0;
	}
	
	.sub-title-area {
		margin: 6rem auto 3rem;
	}
}

/* 幅641 以上*/
@media screen and (min-width: 641px){
	header {
		height: 90px;
	}
	
	header::after {
		width: 300px;
		height: 90px;
		left: -40px;
	}
	
	header #header-logo a {
		top: 22px;
		left: 18px;
	}
	
	header #header-logo a img {
		width: 200px;
    	height: auto;
	}
	
	.cd-nav-trigger {
		top:18px;
		right: 18px;
	}
	.cd-primary-nav li {
		margin: 1em 0;
	}
	.cd-primary-nav a {
		font-size: 28px;
		font-size: 1.75rem;
	}
	.cd-overlay-nav, .cd-overlay-content {
		top: 18px;
		right: 18px;
	}
	
	#common-title {
		margin: 90px auto 0;
	}
	
	#main-inner {
		width: 90%;
		margin: 0 auto;
		padding: 10% 0 0;
		max-width: 90%;
	}
	
	#common-title {
		margin: 90px auto 0;
		height: 340px;
	}
	
	#common-title h1 {
		font-size: 6.4rem;
		width: 60%;
		max-width: 400px;
		padding: 40px 0 20px 0;
		bottom: -30px;
	}
	
	.anchor-link li {
		width: 32%;
		margin-right: 2%;
	}
	.anchor-link li:nth-child(2n) {
		margin-right: 2%;
	}
	.anchor-link li:nth-child(3n) {
		margin-right: 0;
	}
	
	main > section,
	#main-inner > section {
		margin-bottom: 15%;
		padding-top: 90px;
	}
	#main-inner #content-contact {
		margin-bottom: 15%;
	}
	.casting #solution,
	.creative #solution{
		margin-bottom: 0;
	}
	
	.title-area h2 span.main-txt,
	#common-title h2 span.main-txt,
	.title-area h3 span.main-txt{
		font-size: 4.8rem;
	}
	
	.title-area h2 span.sub-txt,
	#common-title h2 span.sub-txt,
	.title-area h3 span.sub-txt {
		font-size: 1.8rem;
	}
	
	p.copy-txt {
		font-size: 2.4rem;
		text-align: center;
		line-height: 4rem;
		margin: 0 auto 2rem;
	}
	
	p.copy-txt span {
		border: none;
	}
	
	p.copy-txt span::after {
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 6px;
		background: /*rgba(51,185,231,0.4)*/#ccc;
		transform: skew(-25deg,0);
	}

	p.txt {
		text-align: center;
	}
	
	.bc-inner {
		width: 90%;
		margin: 0 auto;
		padding: 0;
		max-width: 90%;
	}
	footer {
		text-align: center;
	}
	
	footer .inner {
		padding: 60px 2%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	footer .footer-nav {
		order: 2;
		width: 64%;
		display: flex;
		justify-content: space-between;
	}
	footer .footer-nav-list {
		width: 30%;
	}
	
	footer .footer-nav-list > li > a.parent.pc,
	footer .footer-nav-list .child {
		display: block !important;
	}
	footer .footer-nav-list > li > a.parent.sp {
		display: none;
	}
	footer .footer-nav-list > li > a {
		border-bottom: none;
	}
	footer .footer-nav-list > li:not(.facebook):not(.contact) > a:hover,
	footer .footer-nav-list .child li a:hover {
		color: rgba(255,255,255,0.6);
	}
	footer .footer-nav-list > li:not(.facebook):not(.contact) > a::after,
	footer .footer-nav-list > li > a.parent::after{
		content: none;
	}
	footer .footer-nav-list > li.facebook > a,
	footer .footer-nav-list > li.contact > a {
		max-width: 100%;
		margin: 0;
	}
	footer .footer-nav-list > li.facebook > a {
		margin-bottom: 40px;
	}
	
	footer .footer-info {
		text-align: left;
		order: 1;
		width: 30%;
		margin-top: 0;
	}
	footer p.footer-logo {
		width: 100%;
		max-width: 220px;
		margin: 0 0 30px;
	}
	footer p.footer-detail {
		font-size: 1.4rem;
	}
	
	/* index */
	#logo-set-wrap {
		top: 50%;
	}
	
	.index #main-inner {
		padding: 10% 0 0;
	}
	
	.title-area h2,
	#common-title h2,
	.title-area h3 {
		display: inline-block;
		font-size: 4.8rem;
		margin: 0 auto 0;
	}
	
	#common-title h2 {
		margin: 110px auto 0;
	}
	
	.title-area a.btn-more {
		position: absolute;
		top: 0;
		right: 5px;
		padding: 7px 40px 7px 15px;
	}
	
	.title-area a.btn-more:hover {
		padding: 7px 30px 7px 25px;
	}
	
	ul.service-list-index,
	ul.media-list {
		display: -ms-flexbox; /* IE10 */
		display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
		display: -webkit-flex; /* Safari6.1以降 */
		display: flex;
		-ms-flex-wrap: wrap; /*IE10*/
		-webkit-flex-wrap: wrap; /* Safari6.1以降 */
		flex-wrap: wrap;
		-ms-flex-pack: justify; /*IE10*/
		-webkit-box-pack: justify; /* Android4.3以下、Safari3.1〜6.0 */
		-webkit-justify-content: space-between; /* Safari6.1以降 */
		justify-content: space-between;
	}
	
	ul.service-list-index li {
		width: 48%;
		margin-bottom: 5%;
	}
	
	ul.media-list li {
		width: 48%;
		margin-bottom: 0;
	}

	ul.service-list-index li:nth-last-child(-n+2),
	ul.news-list li:last-child,
	ul.recruit-list li:last-child {
		margin-bottom: 0;
	}
	
	.index ul.news-list,
	ul.recruit-list {
		width: 65%;
	}
	
	.index .news-wrap,
	.recruit-wrap {
		height: 300px;
	}
	
	.news-bg,
	.recruit-bg {
		width: 60%;
		height: 100%;
		position: absolute;
		top: -15px;
		display: block;
		visibility: visible;
		transition: all 1.5s cubic-bezier(0.075, 0.82, 0.165, 1) 1.5s;
	}
	
	.news-bg {
		right: 0;
		background: url(../img/index/news_index.jpg) no-repeat 10% center;
		background-size: cover;
	}
	
	.recruit-bg {
		left: 0;
		background: url(../img/index/recruit_index.jpg) no-repeat 10% center;
		background-size: cover;
	}

	
	ul.recruit-list{
		margin-left: 35%;
	}
	
	
	/* SERVICE */
	p.contact-txt {
		font-size: 1.8rem;
	}
	p.contact-txt br:nth-child(1) {
		display: none;
	}
	p.contact-txt span {
		font-size: 2.0rem;
	}
	/*p.contact-txt::before {
		content: "";
		-webkit-transform: skewX(30deg);
		-ms-transform: skewX(30deg);
		transform: skewX(30deg);
		top: 0;
		left: 0;
	}
	p.contact-txt::after {
		content: "";
		-webkit-transform: skewX(-30deg);
		-ms-transform: skewX(-30deg);
		transform: skewX(-30deg);
		top: 0;
		right: 0;
	}*/
	
	ul.service-list li .inner {
		background-size: 240% 100%;
		display: flex;
		display: -ms-flexbox; /* IE10 */
		display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
		display: -webkit-flex; /* Safari6.1以降 */
		align-items: center;
		-ms-flex-align: center; /*IE10*/
		-webkit-box-align: center; /* Android4.3以下、Safari3.1〜6.0 */
		-webkit-align-items: center; /* Safari6.1以降 */
		position: relative;
	}
	ul.service-list li .inner figure {
		height: 300px;
	}
	ul.service-list li:nth-child(odd) .inner {
		flex-direction: row-reverse;
	}
	ul.service-list li .inner figure,
	ul.service-list li .inner .service-list-txt {
		width: 50%;
	}
	
	.sub-title-area h3 span.main-txt {
		font-size: 4.0rem;
	}
	.sub-title-area h3 span.sub-txt {
		font-size: 1.4rem;
		line-height: 2.6rem;
	}
	
	ul.marketing-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	ul.marketing-list li {
		width: 48%;
	}
	body:not(.marketing) ul.marketing-list li:nth-last-child(-n+2) {
		margin-bottom: 0;
	}
	body.marketing ul.marketing-list li:last-child {
		margin: 0 26% 0;
	}
	ul.marketing-list li h4 {
		font-size: 1.8rem;
	}
	
	ul.trouble-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	ul.trouble-list li {
		width: 30%;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 1.8rem;
	}
		
	ol.service-value li p,
	ol.service-value li dl,
	ol.service-solution li p {
		padding: 50px;
	}
	ol.service-value li::before,
	ol.service-solution li::before {
		line-height: 70px;
		height: 70px;
		width: 70px;
		left: -90px;
	}
	
	ol.service-value li dl,
	ol.service-solution li dl {
		padding: 25px 0 40px;
	}
	ol.service-value li dl dt,
	ol.service-solution li dl dt {
		font-weight: bold;
		font-size: 1.8rem;
		background: /*#e4e4e4*/#000;
		color: #fff;
		margin-right: 40px;
		padding: 5px 20px;
		display: inline-block;
		position: relative;
		margin-bottom: 1.4rem;
	}
	ol.service-solution li dl dt span {
		font-size: 1.5rem;
		font-weight: normal;
		display: inline-block;
		margin-left: 1rem;
	}
	ol.service-value li dl dd,
	ol.service-solution li dl dd {
		padding: 0 40px;
		font-weight: normal;
		line-height: 3rem;
		display: block;
	}
	
	ol.service-value li dl dd .value-bnr {
		display: flex;
	}
	
	figure.service-img {
		max-width: 1040px;
		margin: 0 auto;
		padding: 0;
		box-shadow: 8px 8px 10px rgba(0,0,0,0.15);
	}
	
	.gallery-case-wrapper li {
		width: 30%;
		margin-bottom: 40px;
		box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
	}
	
	body.service ul.tabs li {
		width: 30%;
		margin-right: 4%;
	}
	body.service ul.tabs li:last-child {
		margin-right: 0;
	}
	
	.inhouse-support {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-content: center;
	}
	.inhouse-support figure,
	.inhouse-support ul {
		width: 100%;
	}
	.inhouse-support figure {
		margin: 0 0 20px;
		background: #f5f5f5;
		display: flex;
		justify-content: center;
		box-shadow: 8px 8px 10px rgba(0,0,0,0.15);
	}
	.inhouse-support figure img {
		align-self: center;
	}
	.inhouse-support ul {
		margin-left: 4%;
		align-self: center;
		max-width: 500px;
	}
	.inhouse-support ul li {
		line-height: 3rem;
		margin-bottom: 0.5rem;
	}
	.inhouse-support ul li::before {
		top: 10px;
		left: 0;
	}
	
	ol.inhouse-flow li {
		padding: 25px 0 40px;
	}
	ol.inhouse-flow li::before {
		top: 20px;
		left: -70px;
	}
	ol.inhouse-flow li h4::after {
		content: "";
		width: 25px;
		height: 100%;
		background: #000;
		transform: skew(-20deg);
		position: absolute;
		right: -12px;
		top: 0;
	}
	ol.inhouse-flow li h4 span {
		font-size: 1.5rem;
		font-weight: normal;
		display: inline-block;
	}
	ol.inhouse-flow li p {
		padding: 0 40px;
		line-height: 3rem;
	}
	
	.inhouse-worry {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-content: stretch;
		align-items: stretch;
	}
	.inhouse-worry figure,
	.inhouse-worry .txt-area {
		max-width: 100%;
	}
	.inhouse-worry figure {
		background: #f5f5f5;
		display: flex;
		justify-content: center;
	}
	.inhouse-worry figure img {
		max-width: 500px;
	}
	.inhouse-worry .txt-area .worry-q {
		padding: 30px;
	}
	.inhouse-worry .txt-area .worry-a {
		padding: 30px;
	}
	.price-wrap .table-border tr th {
		width: 20%;
	}
	.price-wrap .table-border tr td {
		text-align: left;
	}
	
	
	
	/* NEWS */
	.news ul.news-list li .inner figure {
		min-height: auto;
		min-width: 30%;
		max-width: 30%;
	}
	
	.news ul.news-list li .inner figure img {
		width: 100%;
    	height: auto;
		transition: all .5s ease-out;
	}
	
	ul.news-list li:hover .inner figure img {
		-webkit-transform: scale(1.1,1.1);
		-ms-transform: scale(1.1,1.1);
		transform: scale(1.1,1.1);
		opacity: 0.6;
	}
	
	.news-detail .news-title h3 {
		padding: 10px 20px 20px;
	}
	.news-detail .news-title p {
		font-family: 'Josefin Sans', sans-serif;
		padding: 5px 10px 5px 20px;
		background: #000;
		color: #fff;
		text-align: right;
		font-size: 1.8rem;
		display: inline-block;
		position: relative;
	}
	
	
	/* RECRUIT */
	body.recruit ul.tabs li {
		width: 26%;
		margin-right: 4%;
	}
	body.recruit ul.tabs li:last-child {
		margin-right: 0;
	}
	
	#entry ul.contact-list li {
		width: 80%;
	}
	
	ul.contact-list li:last-child .inner p {
		line-height: 6rem;
		font-size: 1.8rem;
	}
	
	
	/* COMPANY */
	.value-wrap dl {
		width: 50%;
		min-height: 200px;
	}
	
	.value-wrap dl:nth-last-child(-n+2) {
		-ms-flex-direction: row-reverse; /*IE10*/
		-webkit-box-direction: reverse; /* Android4.3以下、Safari3.1〜6.0 */
		-webkit-flex-direction: row-reverse; /* Safari6.1以降 */
	}
	
	.value-wrap dl dt,
	.value-wrap dl dd {
		min-height: 200px;
	}
	
	.value-wrap dl dt::after {
		border: 15px solid transparent;
		border-left: 15px solid #000;
		left: inherit;
		right: -30px;
	}
	
	.value-wrap dl:nth-last-child(-n+2) dt::after {
		border: 15px solid transparent;
		border-right: 15px solid #000;
		right: inherit;
		left: -30px;
	}
	
	.value-wrap dl dd {
		font-size: 2.0rem;
	}
	
	.history-wrap::before {
		left: 50%;
		-webkit-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		transform: translate(-50%,0);
	}
	
	.history-wrap::after {
		left: 50%;
		-webkit-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		transform: translate(-50%,0);
	}
	
	.history-wrap .history-inner:nth-child(2n+1) {
		padding-left: 50%;
	}
	
	.history-wrap .history-inner:nth-child(2n) {
		padding-right: 50%;
		text-align: right;
	}
	
	.history-wrap .history-inner:last-child {
		width: 100%;
		margin-top: 50px;
		padding: 0;
		text-align: center;
	}
	
	.history-wrap .history-inner:nth-child(2n+1) dl {
		margin-left: 30px;
	}
	
	.history-wrap .history-inner:nth-child(2n) dl {
		margin: 0 30px 0 0;
	}
	
	.history-wrap .history-inner:last-child dl {
		margin: 0 auto;
		padding: 0;
	}
	
	.history-wrap .history-inner:nth-child(2n+1) dl::before {
		left: -30px;
	}
	
	.history-wrap .history-inner:nth-child(2n+1) dl::after {
		left: -30px;
	}
	
	.history-wrap .history-inner:nth-child(2n) dl::before {
		right: -30px;
	}
	
	.history-wrap .history-inner:nth-child(2n) dl::after {
		right: -40px;
	}
	
	.history-wrap .history-inner:nth-child(2n) dl dd {
		text-align: left;
	}
	
	.history-wrap .history-inner:last-child dl dt {
		top: -30px;
		left: 50%;
	}
	
	.history-wrap .history-inner:last-child dl dd {
		padding: 35px;
		width: 100%;
	}
	
	.history-wrap .history-inner:last-child dl dd br{
		display: none;
		visibility: hidden;
	}
	
	table.table-border tr th,
	table.table-border tr td {
		padding: 15px;
		width: 50%;
		display: table-cell;
		border-bottom: 1px solid #ccc;
	}
	
	table.table-border tr th {
		width: 30%;
	}
	
	table.table-border tr td {
		width: 70%;
	}
	
	/* CONTACT */
	ul.form-list {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
	}
	ul.form-list li {
		width: 30%;
	}
	ul.form-list li .inner {
		padding: 90px 5% 20px 5%;
		max-height: 270px;
		background-size: 280% 100%;
	}
	ul.form-list li .inner a::before {
		top: 20px;
		left: 50%;
		transform: translate(-50%,0);
	}
	ul.form-list li .inner a:hover::before {
		transform: translate(-50%,0) scale(1.1,1.1);
		opacity: 0.4;
	}
	ul.form-list li .inner p br:nth-child(1) {
		display: block;
	}
	
	form#mail_form dl{
		flex-direction: row;
	}
	
	form#mail_form dl dt,
	form#mail_form dl dd{
		padding: 15px;
		width: 100%;
		display: block;
		align-items: center;
		text-align: left;
	}
	form#mail_form dl dt:not(.form-policy) {
		font-weight: bold;
		width: 30%;
		min-width: 240px;
		display: flex;
		padding-right: 5px;
		border-bottom: 1px solid #ccc;
	}
	form#mail_form dl dd:not(.form-policy) {
		width: 70%;
		max-width: calc( 100% - 240px );
		flex-direction: column;
	}
	
	form#mail_form dl dt i {
		order: 1;
	}
	form#mail_form dl dt i span,
	form#mail_form dl dt span,
	div#agreement h3 span,
	dt.form-policy span {
		order: 1;
		margin-right: 0;
	}
	
	form#mail_form dl dt i,
	form#mail_form dl dt span {
		margin-left: auto;
	}
	
	div#agreement,
	.form-policy {
		width: 100%;
		margin: 0 auto 30px;
		padding: 15px;
	}
	form#mail_form dl dd.form-policy {
		padding-top: 0;
	}
	
	div#agreement div,
	.form-policy div {
		margin: 15px 0;
		padding: 20px 30px;
	}
	.form-policy div {
		margin: 0 0 15px;
	}
	div#agreement h3 span,
	form#mail_form dl dt.form-policy span {
		margin-left: 10px;
	}
	
	#mail_form input[type=radio]+label {
		width: auto;
		margin-right: 2em;
	}
}

/* 幅801 以上*/
@media screen and (min-width: 801px){
	.anchor-link li {
		width: 15%;
		margin-right: 1.6666%;
		margin-bottom: 15px;
	}
	
	.anchor-link li:nth-child(2n),
	.anchor-link li:nth-child(3n) {
		margin-right: 1.6666%;
	}
	.anchor-link li:last-child {
		margin-right: 0;
	}
	
	/* index */
	ul.contact-list {
		display: flex;
		justify-content: space-between;
	}
	ul.contact-list li {
		width: 48%;
	}
	ul.contact-list li:first-child .inner p {
		font-size: 1.4rem;
	}
	ul.contact-list li .inner p.tel {
		font-size: 2.6rem;
	}
	ul.contact-list li:last-child .inner p {
		font-size: 1.6rem;
	}
	
	/* SERVICE */
	ol.service-value li,
	ol.service-solution li {
		margin: 0 90px 30px;
	}
	ol.service-value li:nth-child(odd),
	ol.service-solution li:nth-child(odd) {
		margin: 0 0 30px 180px;
	}
	
	ul.tabs {
		margin: 100px 0 5%;
	}
	
	.inhouse-support figure,
	.inhouse-support ul {
		width: 48%;
		max-width: 500px;
	}
	.inhouse-support figure {
		margin: 0;
	}
	
	/* RECRUIT */
	.recruit-company {
		margin: 0 auto 10%;
	}
	.recruit-company h4 {
		top: 5%;
	}
	.recruit-photo {
		display: flex;
		margin-top: 3%;
		margin-bottom: 6%;
	}
	.recruit-photo li {
		width: calc( (100% - 2px) / 3);
		margin-right: 1px;
	}
	.recruit-photo li:last-child {
		margin-right: 0;
	}
	
	.recruit-list {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-content: stretch;
		align-items: stretch;
	}
	.recruit-list dl {
		width: 48%;
		margin-bottom: 0;
	}
	.recruit-list dl:first-child {
		margin-right: 4%;
	}
	
	#entry ul.contact-list li {
		width: 60%;
	}
}

/* 幅1001 以上*/
@media screen and (min-width: 1001px){
	.cd-primary-nav li {
		margin: 1.4em 0;
	}
	.cd-primary-nav a {
		font-size: 32px;
		font-size: 2rem;
	}
	
	#main-inner {
		width: 80%;
		margin: 0 auto;
		padding: 10% 0 0;
		max-width: 80%;
	}
	
	.bc-inner {
		width: 80%;
		margin: 0 auto;
		max-width: 80%;
	}
	
	/* index */
	.index #main-inner {
		padding: 10% 0 0;
	}
	
	.index ul.news-list,
	ul.recruit-list {
		width: 48%;
	}
	
	ul.recruit-list{
		padding-bottom: 0;
	}
	
	ul.news-list li .inner figure {
		min-height: 110px;
		min-width: 120px;
		max-width: 150px;
	}
	
	ul.news-list li .inner dl dd {
		-webkit-line-clamp: 3;
	}
	
	.index .news-wrap,
	.recruit-wrap {
		height: 400px;
	}
	
	.news-bg,
	.recruit-bg {
		width: 70%;
		top: -25px;
	}
	
	.news-bg {
		background: url(../img/index/news_index.jpg) no-repeat 5% center;
		background-size: cover;
	}
	
	.recruit-bg {
		background: url(../img/index/recruit_index.jpg) no-repeat 5% center;
		background-size: cover;
	}
	
	ul.recruit-list {
		margin-left: 52%;
	}
	
	ul.contact-list li .inner {
		padding: 5% 50px 5% 80px;
	}
	ul.contact-list li:first-child .inner p {
		line-height: 1.6rem;
	}
	ul.contact-list li .inner p.tel {
		font-size: 3.0rem;
		line-height: 3.4rem;
	}
	
	ul.contact-list li:last-child .inner p {
		font-size: 1.8rem;
		line-height: 5rem;
	}
	
	
	/* COMPANY */
	.history-wrap .history-inner dl {
		display : -webkit-inline-box;
		display : -ms-inline-flexbox;
		display : -webkit-inline-flex;
		display : inline-flex;
		-ms-flex-wrap : nowrap; /*for IE10*/
		-webkit-flex-wrap : nowrap; /*for old webkit browser*/
		flex-wrap : nowrap;
		-ms-flex-align: center; /*IE10*/
		-webkit-box-align: center; /* Android4.3以下、Safari3.1〜6.0 */
		-webkit-align-items: center; /* Safari6.1以降 */
		align-items: center;
		padding: 15px 25px;
		width: auto;
	}
	
	.history-wrap .history-inner:nth-child(2n) dl {
		-ms-flex-direction:row-reverse; /*IE10*/
		-webkit-flex-direction:row-reverse; /*old webkit browser*/
		flex-direction:row-reverse;
	}
	
	.history-wrap .history-inner dl dt {
		width: 110px;
		min-width: 110px;
	}
	.history-wrap .history-inner:nth-child(2n) dl dt {
	}
	.history-wrap .history-inner:nth-child(2n) dl dt {
		text-align: right;
	}
	
	.history-wrap .history-inner dl dd {
		height: 100%;
		padding: 0;
	}
	
	.history-wrap .history-inner:nth-child(2n+1) dl dd {
		padding: 10px 0 10px 20px;
		border-left: 1px dotted #ccc;
	}
	
	.history-wrap .history-inner:nth-child(2n) dl dd {
		padding: 10px 20px 10px 0;
		border-right: 1px dotted #ccc;
	}
	
	.history-wrap .history-inner:last-child dl dt {
		min-width: 62px;
		padding: 0;
	}
	
	.history-wrap .history-inner:last-child dl dd {
		padding: 35px;
		width: 100%;
		border: none;
	}
	
	/* SERVICE */
	ul.service-list li {
		width: 100%;
		margin-bottom: 5%;
		position: relative;
		box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
		transition: all .5s linear 0s;
		overflow: hidden;
	}

	ul.service-list li .inner {
		margin: 0;
		width: 100%;
		position: relative;
		background: -webkit-linear-gradient(-30deg, #000 49.9%, #535353 50%);
		background: linear-gradient(-60deg, #000 49.9%, #535353 50%);
		background-position: right 0;
		background-size: 240% 100%;
		transition: all .5s linear 0s;
	}

	ul.service-list li .inner:hover {
		background-position: left 0;
	}

	ul.service-list li a {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		height:100%;
		width: 100%;
		text-indent: -9999px;
		z-index: 1;
	}
	
	ul.service-list li .inner {
		display: flex;
		align-items: center;
		position: relative;
	}
	
	ul.service-list li .inner figure,
	ul.service-list li .inner .service-list-txt {
		width: 50%;
	}
	
	ul.service-list li .inner .service-list-txt {
		padding: 10px 5%;
	}
	ul.service-list li .inner .service-list-txt h3 {
		color: #fff;
		text-align: center;
		margin-bottom: 1rem;
	}
	ul.service-list li .inner .service-list-txt p {
		color: #ccc;
	}
	ul.service-list li .inner .service-list-txt p.btn-more {
		margin: 2rem auto 0;
		padding: 10px;
		text-align: center;
		width: 80%;
		border: 2px solid #fff;
	}
	
	ul.service-list li:nth-child(odd) .inner {
		flex-direction: row-reverse;
	}
	
	ol.service-value li dl dt::after,
	ol.service-solution li dl dt::after {
		content: "";
		width: 25px;
		height: 100%;
		background: #000;
		transform: skew(-20deg);
		position: absolute;
		right: -12px;
		top: 0;
	}
	
	.inhouse-support ul li {
		font-size: 1.8rem;
		line-height: 3rem;
		margin-bottom: 1.6rem;
	}
	
	.inhouse-worry figure,
	.inhouse-worry .txt-area {
		width: 48%;
		max-width: 500px;
	}
	.inhouse-worry .txt-area {
		margin-right: 4%;
	}
	
	ul.form-list li .inner p br:nth-child(1) {
		display: none;
	}
	
	.recruit-company,
	.recruit-list {
		max-width: 1040px;
	}
	.recruit-company h4 {
		font-size: 1.8rem;
	}
	.recruit-slider .swiper-slide p {
		position: absolute;
		bottom: 8%;
		right: 0;
		padding: 16px;
	}
}

/* 幅1501 以上*/
@media screen and (min-width: 1501px){
	#main-inner {
		width: 100%;
		max-width: 1500px;
		padding: 10% 100px 0;
	}
	
	.bc-wrap {
		padding: 10px 25px;
	}
	.bc-inner {
		width: 100%;
		max-width: 1500px;
		padding: 0 10%;
	}
	
	/* index */
	.index #main-inner {
		padding: 10% 100px 0;
	}
	
	ul.contact-list li:first-child .inner p {
		font-size: 1.6rem;
	}
	ul.contact-list li .inner p.tel {
		font-size: 3.6rem;
		line-height: 3.4rem;
	}
	ul.contact-list li:last-child .inner p {
		font-size: 2.4rem;
		line-height: 5rem;
	}
	
	/* SERVICE */
	.service ul.service-list,
	.service .service-wrap,
	.service ol.service-value,
	.service ol.service-solution,
	.service ol.inhouse-flow,
	.service #price .price-wrap,
	.service ul.marketing-list,
	#trouble {
		width: 80%;
		margin: 0 10%;
	}
	ul.service-list li .inner figure {
		height: 340px;
	}
	ul.service-list li .inner .service-list-txt h3 {
		margin-bottom: 2rem;
	}
	ul.service-list li .inner .service-list-txt p.btn-more {
		margin: 4rem auto 0;
	}
	#main-inner #content-contact {
		width: 80%;
	}
	
	/* RECRUIT */
	body.recruit h3 {
		width: 80%;
		margin: 30px 10% 10px;
	}
	body.recruit ul.tabs li {
		width: 20%;
		margin-right: 4%;
	}
	#entry ul.contact-list li:last-child .inner p {
		font-size: 2.4rem;
    	line-height: 3.6rem;
	}
	
	/* NEWS */
	.news .news-wrap,
	.policy .policy-wrap {
		width: 80%;
		margin: 0 10%;
	}
	
	
	/* COMPANY */
	.anchor-link,
	.value-wrap,
	.history-wrap,
	.data-wrap,
	.contact-wrap {
		width: 80%;
		margin: 0 10%;
	}
	
	/* CONTACT */
	.form-list li a::before {
		width: 100px;
		height: 100px;
		padding-top: 0;
	}
}

/* iPhone5 */
@media screen and (max-width: 350px){
	.cd-nav-trigger {
		top: 5px;
		right: 0px;
	}
	.cd-overlay-nav, .cd-overlay-content {
		top: 5px;
		right: 0px;
	}
	
	#common-title h1 {
		font-size: 3.6rem;
	}
	
	#main-inner {
		padding: 15% 20px 0;
	}
	
	/* index */
	ul.contact-list li p.tel {

		font-size: 2.6rem;
	}

	ul.contact-list li:last-child p {
		font-size: 1.6rem;
	}
	
	.index #main-inner {
		padding: 10% 20px 0;
	}
	
	/* SERVICE */
	.marketing .copy-txt {
		font-size: 1.5rem;
		line-height: 2.8rem;
	}
	
	/* COMPANY */
	.value-wrap dl dt {
		font-size: 2.6rem;
	}
	
	.value-wrap dl dd {
		font-size: 1.5rem;
	}
	
	.entry_year {
		min-width: 70px;
		max-width: 70px;
	}
	.entry_month,
	.entry_day {
		min-width: 50px;
		max-width: 50px;
	}
	
	ul.form-list li .inner p br {
		display: none;
	}
}