@charset "UTF-8";
/****************************************
ユーザー入力エリア
*****************************************/
.entry-content *{
	margin:0 auto 20px;
}
.entry-content *:last-child{
	margin-bottom:0;
}
.entry-content a{
	color: #01a0c6;
	text-decoration: underline;
}
.entry-content a:hover{
	text-decoration: none;
}
.entry-content address{
	background: #f1f1f1;
	padding: 20px;
}
.entry-content blockquote{
	background: #f1f1f1;
	font-style: italic;
	padding: 20px;
}
.entry-content blockquote p:last-child{
	margin-bottom: 0;
}
.entry-content code{
	background: #f1f1f1;
	font-style: italic;
}
.entry-content em{
	background: #ecf0f4;
	font-style: italic;
}
.entry-content pre{
	background: #f1f1f1;
	font-size: 14px;
	line-height: 1.4;
	overflow:scroll;
	padding: 1em;
}
/*ul ol*/
.entry-content ul,
.entry-content ol{
	margin-left:1em;
}
.entry-content ul:last-child,
.entry-content ol:last-child{
	margin-bottom:0;
}
/*ul*/
.entry-content ul li{
	list-style:disc;
}
.entry-content ul li:last-child{
	margin-bottom:0;
}
/*ol*/
.entry-content ol li{
	list-style:decimal;
}
.entry-content ol li:last-child{
	margin-bottom:0;
}
.entry-content ul ol li{
	list-style:decimal;
}
.entry-content ol ul li{
	list-style:disc;
}
.entry-content li{
	margin:0 0 10px 10px;
}
.entry-content li ul,
.entry-content li ol{
	margin-top: 10px;
}
.entry-content dt{
	font-weight: bold;
}
.entry-content dd{
	margin-bottom: 20px;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6{
	line-height: 1.2;
}
.entry-content h1:first-child,
.entry-content h2:first-child,
.entry-content h3:first-child,
.entry-content h4:first-child,
.entry-content h5:first-child,
.entry-content h6:first-child{
	margin-top:0;
}

.entry-content h1{
	xfont-size: 30px;
	margin-top: 80px;
}
@media screen and (max-width:768px){
	.entry-content h1{
		margin-top: 60px;
	}
}
.entry-content h2{
	xfont-size: 30px;
	margin-top: 70px;
}
@media screen and (max-width:768px){
	.entry-content h2{
		margin-top: 50px;
	}
}
.entry-content h3{
	xfont-size: 24px;
	margin-top: 60px;
}
@media screen and (max-width:768px){
	.entry-content h3{
		margin-top: 40px;
	}
}
.entry-content h4{
	xfont-size: 24px;
	margin-top: 50px;
}
@media screen and (max-width:768px){
	.entry-content h4{
		margin-top: 30px;
	}
}
.entry-content h5{
	margin-top: 40px;
}
@media screen and (max-width:768px){
	.entry-content h5{
		margin-top: 20px;
	}
}
.entry-content h6{
	margin-top: 20px;
}

/*table*/
.entry-content table{
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	width: 100%;
}
.entry-content th,
.entry-content td{
	border-bottom: 1px solid #ccc;	
	border-right: 1px solid #ccc;
	padding: 10px;
	vertical-align: top;
}
.entry-content th{
	background: #f1f1f1;
	font-weight: 700;
	text-align: left;
}
/****************************************
common
*****************************************/
/*bottom_copy*/
.bottom_copy{
	font-family: 'Zen Old Mincho', serif;
	font-size:36px;
	text-align:center;
}
@media screen and (max-width:768px){
	.bottom_copy{
		font-size:30px;
	}
}
/*btn*/
.btn_common_wrap{
	display:flex;
	justify-content:center;
}
@media screen and (max-width:768px){
	.btn_common_wrap_sponly{
		display:flex;
		justify-content:center;
	}
}
.btn_common{
	color:#222;
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
}
.btn_common_line{
	margin-left:20px;
}
.btn_common_line span{
	background:#222;
	height:2px;
	transition:.3s;
	width:100px;
}
.btn_common:hover .btn_common_line span{
	width:150px;
}
.btn_new_window{
	color:#222;
	display:inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
}
.btn_new_window img{
	height:16px;
	margin-left:10px;
}
/*font*/
.font_mont{
	font-family: 'Montserrat', sans-serif;
}
.font_zen{
	font-family: 'Zen Old Mincho', serif;
}
/*key_visual*/
.key_visual{
	padding:0 40px;
	position:relative;
}
@media screen and (max-width:768px){
	.key_visual{
		margin-left:auto;
		margin-right:auto;
		padding:0;
		width:90%;
	}	
}
.key_visual video,
.key_visual img{
	border-radius:4px;
	overflow:hidden;
}
/*sec*/
.sec{
	margin-top:160px;
	position:relative;
}
@media screen and (max-width:768px){
	.sec{
		margin-top:80px;
	}
}
.sec_gray{
	background:#eee;
	padding:120px 0;
}
@media screen and (max-width:768px){
	.sec_gray{
		background:#eee;
		padding:60px 0;
	}
}
.sec_title{
	font-family: 'Montserrat', sans-serif;
	font-size:24px;
	font-weight:700;
	text-align:center;
}
.sec_subtitle{
	color:#666;
	font-weight:700;
	text-align:center;
}
.sec_logo{
	left:50%;
	position:absolute;
	top:0%;
	transform:translate(-50%,-15%);
	width:25%;
	z-index:-1;
}
@media screen and (max-width:768px){
	.sec_logo{
		top:-40px;
		transform: translate(-50%,0);
		width:200px;
	}
}
/****************************************
header
*****************************************/
.header{
	left:0;
	padding:80px 40px;
	position:fixed;
	top:0;
	transition:.3s;
	max-width:1600px;
	width:100%;
	z-index:99;
}
@media screen and (min-width:769px){
	.header{
		min-width:1000px;
	}
}
@media screen and (max-width:768px){
	.header{
		padding:20px;
	}
}
.header.on{
	background:rgba(255,255,255,0.8);
	padding:20px;
}
/*logo*/
.header_logo{
	width:20%;
}
.header_logo img{
	display:block;
	height:60px;
}
@media screen and (max-width:768px){
	.header_logo img{
		height:30px;
		width:auto;
	}
}
/*nav*/
@media screen and (min-width:769px){
	.header_nav{
		width:50%;
	}
	.header_nav li:nth-child(n+2){
		margin-left:20px;
	}
}
.header_nav a{
	color:#222;
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
	width:30%;
}
/*sns*/
@media screen and (min-width:769px){
	.header_sns{
		width:20%;
	}
}
.header_sns li{
	margin-left:20px;
}
.header_sns img{
	height:30px;
}
/*icon-humburger*/
.icon-hamburger {
	cursor: pointer;
	height: 25px;
	margin: 0 auto;
	position: absolute;
	right: 20px;
	transition: .3s;
	top: 20px;
	width: 30px;
	z-index: 99;
}
.icon-hamburger .bar {
	display: inline-block;
	width: 30px;
	height: 2px;
	background-color: #000;
	position: absolute;
	left: 0;
	transition: .25s ease-in-out;
}
#bar01 {top: 0;}
#bar02 {top: 10px;}
#bar03 {top: 20px;}
.active#bar01 {
	top: 10px;
	transform: rotate(45deg);
}
.active#bar02 {width: 0;}
.active#bar03 {
	top: 10px;
	transform: rotate(135deg);
}
/*fullscreen_nav*/
.fullscreen_nav{
	background:#fff;
	height:100vh;
	left:0;
	opacity:0;
	position:fixed;
	top:0;
	transition:.3s;
	visibility:hidden;
	width:100%;
	z-index:99;
}
.fullscreen_nav.on{
	opacity:1;
	visibility:visible;
}
.fullscreen_nav_inner{
	width:100%;
}
.fullscreen_nav .header_nav{
	text-align:center;
}
.fullscreen_nav .header_nav li:nth-child(n+2){
	margin-top:20px;
}
.fullscreen_nav .header_nav a{
	font-size:24px;
}
.fullscreen_nav .header_nav .privacy a{
	color:#999;
	font-size:14px;
}
.fullscreen_nav .header_sns{
	margin-top:40px;
}
.fullscreen_nav .header_sns li:first-child{
	margin-left:0;
}
/****************************************
main
*****************************************/
.main{
	margin:0 auto;
	max-width:1600px;
}
@media screen and (min-width:769px){
	.main{
		min-width:1000px;
	}
}
/****************************************
footer
*****************************************/
.footer{
	margin: 120px auto 0;
	max-width:1600px;
}
@media screen and (min-width:769px){
	.footer{
		min-width:1000px;
	}
}
@media screen and (max-width:768px){
	.footer{
		margin: 80px auto 0;
	}
}
@media screen and (min-width:769px){
	.footer_left,
	.footer_right{
		width:50%;
	}
}
/*footer_right*/
.footer_right{
	position:relative;
}
.footer_right_copy{
	color:#999;
	font-family: 'Zen Old Mincho', serif;
	font-size:30px;
	padding:10%;
	text-align:center;
}
@media screen and (max-width:768px){
	.footer_right_copy{
		padding:40px 0;
	}
}
.footer_right_navs{
	background:#222;
	padding:14% 20%;
}
@media screen and (max-width:768px){
	.footer_right_navs{
		padding:40px 20px;
		text-align:center;
	}
}
.footer_right_navs_nav li:nth-child(n+2){
	margin-top:10px;
}
.footer_right_navs_nav a{
	color:#fff;
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
}
.footer_right_navs_nav .privacy a{
	font-size:14px;
	font-weight:400;
}
@media screen and (min-width:769px){
	.footer_right_navs_sns{
		margin-left:40px;
	}
}
@media screen and (max-width:768px){
	.footer_right_navs_sns{
		margin-top:30px;
	}
	.footer_right_navs_sns .flex{
		justify-content:center;
	}
}
.footer_right_navs_sns li:nth-child(n+2){
	margin-left:20px;
}
.footer_right_navs_sns img{
	height:30px;
}
.footer_right_logo_bg{
	left:50%;
	position:absolute;
	top:0;
	transform:translatex(-50%);
	width:34%;
	z-index:-1;
}
@media screen and (max-width:414px){
	.footer_right_logo_bg{
		width:275px;
	}
}
/*footer_left*/
.footer_left{
	background:url(../img/footer_left_bg.webp) no-repeat center center / cover;
	position:relative;
}
@media screen and (max-width:768px){
	.footer_left{
		padding:80px 0;
	}
}
@media screen and (min-width:769px){
	.footer_left_cnt{
		left:20%;
		position:absolute;
		top:60%;
	}
}
@media screen and (max-width:768px){
	.footer_left_cnt{
		text-align:center;
	}
}
.footer_left_cnt_logo img{
	height:40px;
}
.footer_left_cnt_copyright{
	color:#fff;
	font-family: 'Montserrat', sans-serif;
	font-size:12px;
	margin-top:30px;
}
/****************************************
loader
*****************************************/
.loader{
	background:#eee;
	height:100vh;
	position:fixed;
	top:0;
	width:100%;
	z-index:99;
}
.loader_cnt_logo{
	height:60px;
}
.loader_cnt_line{
	background:#222;
	height:3px;
	margin-top:20px;
	transition: .7s .4s cubic-bezier(0.230, 1.000, 0.320, 1.000);
	width:0;
}
.loader_cnt_line.on{
	width:100%;
}
/****************************************
top page
*****************************************/
/*fv*/
.kv_top{
	position:relative;
}
.kv_top_scroll {
	bottom: 0;
	cursor: pointer;
	left: 50%;
	position: absolute;
	transform:translatex(-50%);
	z-index: 2;
}
.kv_top_scroll a{
	color:#222;
	font-size:14px;
	font-weight:700;
}
.kv_top_scroll_base_line,
.kv_top_scroll_anima_line {
	background: #222;
	height: 80px;
	width: 1px;
}
.kv_top_scroll_base_line {
	margin:0 auto;
	opacity: .5;
}
.kv_top_scroll_anima_line {
	animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite;
	bottom: 0;
	left: 49%;
	position: absolute;
	transform:translatex(-50%);
}
@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}
/*about*/
.top_about .inner-l{
	position:relative;
}
@media screen and (min-width:769px){
	.top_about_title{
		margin-right:40px;
		padding-top:1.2%;
		text-align:left;
	}
}
@media screen and (min-width:769px){
	.top_about_cnt{
		width:37.5%;
	}
}
.top_about_cnt_copy{
	font-family: 'Zen Old Mincho', serif;
	font-size:3vw;
}
@media screen and (min-width:1601px){
	.top_about_cnt_copy{
		font-size:48px;
	}
}
@media screen and (max-width:768px){
	.top_about_cnt_copy{
		font-size:30px;
		text-align:center;
	}
}
.top_about_img{
	position:absolute;
	right:0;
	top:50%;
	transform:translatey(-50%);
	width:50%;
	z-index:-1;
}
@media screen and (max-width:768px){
	.top_about_img{
		height:auto;
		right:50%;
		transform:translate(50%,-50%);
		width:90%;
	}
}
/*experience*/
@media screen and (min-width:769px){
	.top_experience_logo{
		width:20%;
	}	
}
@media screen and (max-width:768px){
	.top_experience_logo{
		text-align:center;
	}
}
@media screen and (max-width:768px){
	.top_experience_logo img{
		height:14px;
		width:auto;
	}
}
@media screen and (min-width:769px){
	.top_experience_cnt{
		width:67%;
	}	
}
/****************************************
page common
*****************************************/
.page_title{
	color:#fff;
	font-family: 'Montserrat', sans-serif;
	font-size:48px;
	font-weight:700;
	left:50%;
	position:absolute;
	top:50%;
	transform:translate(-50%,-50%);
}
@media screen and (max-width:768px){
	.page_title{
		font-size:36px;
		line-height:1.4;
		text-align:center;
	}
}
/****************************************
about
*****************************************/
/*purpose*/
.about_purpose_copy{
	font-family: 'Zen Old Mincho', serif;
	font-size:48px;
	text-align:center;
}
@media screen and (max-width:768px){
	.about_purpose_copy{
		font-size:30px;
	}
}
.about_purpose_bg{
	left:50%;
	position:absolute;
	top:50%;
	transform:translate(-50%,-50%);
	width:640px;
	z-index:-1;
}
@media screen and (max-width:768px){
	.about_purpose_bg{
		height:auto;
		width:90%;
	}
}
/*company*/
.about_company_table{
	border-top:1px solid #ccc;
	width:100%;
}
.about_company_table tr{
	border-bottom:1px solid #ccc;
}
.about_company_table th,
.about_company_table td{
	padding:40px;
}
@media screen and (max-width:768px){
	.about_company_table th,
	.about_company_table td{
		padding:20px;
	}
}
.about_company_table th{
	font-weight:700;
	text-align:left;
}
.about_company_table td{
	color:#666;
}
/****************************************
creative
*****************************************/
/*copy*/
.creative_copy{
	font-family: 'Zen Old Mincho', serif;
	font-size:24px;
	text-align:center;
}
@media screen and (max-width:768px){
	.creative_copy{
		font-size:18px;
	}
}
/*page_nav*/
@media screen and (min-width:769px){
	.creative_page_nav li:nth-child(n+2){
		margin-left:40px;
	}
}
@media screen and (max-width:768px){
	.creative_page_nav li:nth-child(n+2){
		margin-top:10px;
	}
}
.creative_page_nav a{
	color:#222;
	font-family: 'Montserrat', sans-serif;
	font-size:14px;
	font-weight:700;
}
/*workflow*/
.creative_workflow_item{
	position:relative;
}
@media screen and (min-width:769px){
	.creative_workflow_item{
		width:19%;
	}
	.creative_workflow_item:nth-child(n+2):before{
		border-style: solid;
		border-width: 5px 0 5px 10px;
		border-color: transparent transparent transparent #222;
		content:"";
		display:block;
		height: 0;
		left:-22%;
		position:absolute;
		top:50%;
		transform:translatey(-50%);
		width: 0;
	}
}
@media screen and (max-width:768px){
	.creative_workflow_item:nth-child(n+2){
		margin-top:60px;
	}
	.creative_workflow_item:nth-child(n+2):before{
		border-style: solid;
		border-width: 10px 5px 0 5px;
		border-color: #222 transparent transparent transparent;
		content:"";
		display:block;
		height: 0;
		left:50%;
		position:absolute;
		top:-12%;
		transform:translatx(-50%);
		width: 0;
	}
}
.creative_workflow_item_num{
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
}
.creative_workflow_item_icon{
	margin-right:10px;
}
.creative_workflow_item_icon img{
	height:30px;
}
.creative_workflow_item_title_en{
	font-family: 'Montserrat', sans-serif;
	font-size:24px;
}
.creative_workflow_item_title_jp{
	color:#666;
	font-weight:700;
	margin-top:10px;
}
.creative_workflow_item_text{
	margin-top:20px;
}
/*service*/
@media screen and (max-width:768px){
	.creative_service_inner{
		width:100%;
	}
}
.creative_service_item:nth-child(n+2){
	margin-top:100px;
}
@media screen and (max-width:768px){
	.creative_service_item:nth-child(n+2){
		margin-top:80px;
	}
}
.creative_service_item_cnt{
	width:46%;
}
@media screen and (max-width:768px){
	.creative_service_item_cnt{
		margin:20px auto 0;
		width:80%;
	}
}
.creative_service_item_cnt_num{
	font-family: 'Montserrat', sans-serif;
	font-size:18px;
	font-weight:700;
}
.creative_service_item_cnt_title_icon{
	margin-right:40px;
}
@media screen and (max-width:768px){
	.creative_service_item_cnt_title_icon{
		margin-right:20px;
	}
}
.creative_service_item_cnt_title_icon img{
	width:72px;
}
@media screen and (max-width:768px){
	.creative_service_item_cnt_title_icon img{
		width:47px;
	}
}
.creative_service_item_cnt_title_text_main{
	font-family: 'Montserrat', sans-serif;
	font-size:36px;
	font-weight:700;
	line-height:1.4;
}
@media screen and (max-width:768px){
	.creative_service_item_cnt_title_text_main{
		font-size:18px;
		line-height:1.2;
	}
}
.creative_service_item_cnt_title_text_sub{
	color:#666;
	font-size:14px;
}
@media screen and (max-width:768px){
	.creative_service_item_cnt_title_text_sub{
		font-size:12px;
		margin-top:10px;
	}
}
.creative_service_item_img{
	width:45%;
}
@media screen and (max-width:768px){
	.creative_service_item_img{
		margin:0 auto;
		width:90%;
	}
}
.creative_service_btn{
	background:#222;
	border-radius:99em;
	color:#fff;
	font-size:18px;
	font-weight:bold;
	display:inline-block;
	padding:20px 0;
	position:relative;
	text-align:center;
	width:610px
}
@media screen and (max-width:768px){
	.creative_service_btn{
		font-size:15px;
		line-height:1.4;
		width:90%;
	}
}
.creative_service_btn i{
	position:absolute;
	right:20px;
	top:50%;
	transform:translatey(-50%);
}
/****************************************
experience
*****************************************/
/*about*/
.experience_about_logo{
	height:46px;
}
@media screen and (max-width:768px){
	.experience_about_logo{
		height:30px;
	}
}
.experience_about_title{
	font-size:24px;
}
@media screen and (max-width:768px){
	.experience_about_title{
		font-size:18px;
	}
}
/*service*/
@media screen and (max-width:768px){
	.experience_service{
		width:100%;
	}
}
.experience_service_item_img{
	border-radius:4px;
	overflow:hidden;
}
@media screen and (max-width:768px){
	.experience_service_item_img{
		margin:0 auto;
		width:90%;
	}
}
.experience_service_item_img img{
	display:block;
}
.experience_service_item_cnt{
	margin-top:20px;
}
@media screen and (max-width:768px){
	.experience_service_item_cnt{
		margin:20px auto 0;
		width:80%;
	}
}
.experience_service_item_cnt_logo{
	height:60px;
}
@media screen and (max-width:768px){
	.experience_service_item_cnt_logo{
		height:30px;
	}
}