@charset "utf-8";
/* CSS Document */

/* ==========================
.top_visual
============================= */
.mainvisual{
	background: url(../img/mainvisual_bg.png) no-repeat center;
	background-size: cover;
}
.arrow_midashi{
	background: rgba(110, 185, 46,0.75);
}
.arrow_midashi:before {
	border-top: 15px solid rgba(110, 185, 46,0.75);
	}
.article-img-list{
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}
/* ==========================
.co_wrap
============================= */
.co_wrap{
	overflow: hidden;
	margin: 50px 0 0 0;
}
.box h3{
	color: #6eb92e;
}
.co_list{
	display: flex;
	justify-content:flex-start;
	flex-wrap: wrap;
	align-items: center;
}
.co_list li{
	overflow: hidden;
	width: 166px;
	display: block;
	text-align: center;
	margin:10px 0;
}
/* ==========================
.work_wrap
============================= */
.work_wrap{
	overflow: hidden;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.article{
	width: 425px;
	padding: 60px  30px 30px 30px;
	overflow: hidden;
	background-color: #fff;
	position: relative;
	margin-bottom: 30px;
	display: block;
	
}
.article.none{
	background-color: transparent;
	margin-bottom: 0px;
    padding: 0 0 0 0;
}

.article h1{
	font-size: 160%;
	font-weight: bold;
	margin-bottom: 30px;
	line-height: 2;
}
.article-inner p{
	line-height: 2;
	margin-bottom: 30px;
}
.article-inner .achievement_items .contents .site_name {
	font-size: min(5.4vw,1.1rem);
	font-weight: 600;
	padding-bottom: 0.5em;
	margin-bottom: 0;
}
.article-inner .achievement_items .contents {
	border-top: solid 1px #666666;
	padding: 1em 3%;
}
.article-inner .achievement_items .contents:first-child {
	border-top: none;
	padding: 1em 3em 2em;
}
.article-inner .achievement_items .contents ul .cx::before {
	content: "";
	background: #b85873;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	display: inline-block;
	margin-right: 0.2em;
    margin-bottom: 0.2em;
    vertical-align: middle;
}
.article-inner .achievement_items .contents ul .web::before {
	content: "";
	background: #4e7ab0;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	display: inline-block;
	margin-right: 0.2em;
    margin-bottom: 0.2em;
    vertical-align: middle;
}


.article-category{
	display: flex;
	justify-content: flex-start;
	position: absolute;
	top: 0;
	left: 0;
	
}
.article-category li{
	padding: 3px 15px;
	font-size: 90%;
	
}
.article-category li.dtp{
	background-color:#ea5549;
	color: #fff;
}
.article-category li.web{
	background-color:#009fe7;
	color: #fff;
}
.article-category li.movie{
	background-color:#01b091;
	color: #fff;
}
.article-category li.comic{
	background-color:#f39806;
	color: #fff;
}
.article-category li.shop{
	background-color:#fdd000;
	color: #000;
}
.article-category li.crossmedia{
	background-color:#767cba;
	color: #fff;
}
.link_arrow{
	background: url(../../../common/img/arrow_icon01.png) no-repeat left;
	padding-left: 25px;
}
.link_arrow a{
	text-decoration: underline;
	color: #0c105d;
}

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

/* ==========================
.lead_box
============================= */
.co_list li {
    width: 50%;
	}
.article {
    width:90%;
    padding: 40px 5% 30px 5%;
	margin-bottom: 50px;
	}
.article:last-of-type{
	margin-bottom: 0px;
	}
.article h1{
	margin-bottom: 20px;
	}
	
}
@media print {
.article-img-list,.work_wrap {
    display: block;
	}
.article{
	float: left;
	height: 530px;
	
	}
.article.right_none{
	clear: left;
	}
	
.article.none{
	float: right;
	width: 400px;
	height: 530px;
	}
.article.left{
	float: right;
	}
.article.right{
	float: right;
	}

.article-img-list {
	overflow: hidden;
	}
.article-img-list li{
	display: inline-block;
	float: left;
	}
.article-img-list li:nth-of-type(even){
	float: right;
	}
.article.left{
	float: left;
	}
.article-inner .achievement_items .contents:first-child {
	padding: 1em 1em 2em;
}
	
}
.co_list li {
	opacity: 0;
	transform: translateY(40px);
	transition: all 0.8s ease;
}

.co_list li.inview {
	opacity: 1;
	transform: translateY(0);
}
.achievement_items li {
	opacity: 0;
	transform: translateY(40px);
	transition: all 0.8s ease;
  }

.achievement_items li.inview {
	opacity: 1;
	transform: translateY(0);
}