@charset "UTF-8";

/*cmn*/

.ttl_header{
    background: #222;
}
.ttl_header .content_inner{
    max-width: 1000px;
}


/*pc*/
@media screen and (min-width: 640.1px){
	.intro,
	.intro_list,
	.recruit_info{margin: 2em 0 4em; display: block !important;}
}


@media screen and (max-width: 1000px){
    .content_inner{width: 100%;}
	.intro,
	.intro_list,
	.recruit_info{margin-left: 2.5%; margin-right: 2.5%;}
}

/*sp*/
@media screen and (max-width: 640px){
	.assistant_wrap{margin-top: 2em;}
	.content.content_inner{padding-bottom: 3em;}
	.intro,
	.intro_list,
	.recruit_info{margin-bottom: 2em;}
}

/*作品一覧--------------------------------------------------------------*/


/*タイトル・作者*/

.page_sub{text-align: right;}
.page_ttl{font-size: 2em; font-weight: 500;}

.page_artist{font-size: 1.1em;}
.page_ttl,
.page_sub{width: 50%; color: #FFF;}
/*pc*/
@media screen and (min-width: 640.1px){
    .ttl_header{padding:.8em;}
    .ttl_header .content_inner{padding: 0 1em;}
}

/*sp*/
@media screen and (max-width: 640px){
    .ttl_header{background: #222; color: #FFF;}
	.ttl_header .content_inner {padding-right: 2.5%; padding-left: 2.5%;}
    .page_ttl h2{margin: 0 auto; padding: 2.5% 0; font-size: 6.1vw;}
    .page_sub{padding:2.5%;}
    .page_sub{width: 40%;}
    .page_ttl{width: 60%;}
}

/*タイトル*/
.ttl_wrap h3{color: #f40c6e; background-color: #222; background-image: url(../../common/images/bg_dot.png); background-position: 480px center; background-repeat: no-repeat;}
.ttl_wrap h3{font-size: 3.6rem; font-weight: 900; line-height: 1; padding: 1.4rem .4em; max-width: 1000px; margin:0 auto;}

/*pc*/
@media screen and (min-width: 640.1px){
}

/*sp*/
@media screen and (max-width: 640px){
	.ttl_wrap h3{background-position: right center; -webkit-background-size:50% ; background-size: 50%;}
	.ttl_wrap h3{font-size: 5.7vw; padding: 2.5%;}
}

.btn{background-color: #f40c6e;}
.btn.middle{max-width:497.78px;}
.btn.middle img{width: 85%; margin: 0 auto;}

/*イントロ*/
.intro{padding: 2em 0 1em;}
.intro h5{font-size: 1.7em; margin-bottom: 1em; font-weight: 500;}

/*コミックスリスト*/
.intro_list > li{
	background: #fff;
	padding: 1.5%;
	-webkit-box-shadow: 0 0 8px 0 #bec0c3;
	box-shadow: 0 0 8px 0 #bec0c3;
	margin-top: 2em;
}
.intro_list > li:first-of-type{
	margin-top: 0;
}

.intro_icon {width:11.856%;}
.intro_body{width: 88.144%; padding-left: 2%;}
.intro_body .ttl{font-weight: 700; margin-bottom: 1em; font-size: 1.1em;}
.intro_body .attention{font-size: .9em; margin-bottom: 2em;}
.intro_body .ttl span{display: block;}
.intro_body .ttl span,
.intro_body .attention li{text-indent: -1em; padding-left: 1em;}


/*sp*/
@media screen and (max-width: 640px){
	.intro_icon{width: 25%;}
	.intro_body{width: 75%;}
	.intro_list > li{padding: 3.5%;}
	.intro_body .ttl{font-size: 1.2em;}
}


/*sp*/
@media screen and (max-width: 640px){
}
	.btn.middle{border-radius: 40px 40px 0;}

/*pc*/
@media screen and (min-width: 640.1px){

}
/*pc l*/
@media screen and (min-width: 1000px){
	.intro{padding-left:4%; padding-right: 4%;}
}


/*募集中の作家さん*/


.recruit_info > li{
	background: #fff;
	padding: 1.5%;
	-webkit-box-shadow: 0 0 8px 0 #bec0c3;
	box-shadow: 0 0 8px 0 #bec0c3;
	margin-top: 2em;
}

.recruit_info
.recruit_dtl{padding-left: 2%;}
.recruit_dtl .ttl{font-weight: 900; margin-bottom: 1.5em;}
.recruit_dtl .ttl h5{font-size: 1.4em;}
.recruit_dtl .ttl p{font-size: 1.1em;}

.recruit_img img{width: 100%;}

.dtl_wrap{margin-bottom: .3em;}

.dtl_head{background: #222; color: #fff; text-align: center; padding: .4em 0;}

.btn.small{font-size: 1.1em; padding: 0.5em 0; width: 100%;}

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

/*sp*/
@media screen and (max-width: 640px){
	.recruit_img{width: 40%;}
	.recruit_dtl{width: 60%;}
	.dtl_info{padding: .2em 0 1em .5em;}
	.btn.small{padding: 0.5em 1.5em !important; width: auto;}
}


/*sp*/
@media screen and (max-width: 640px){
	.recruit_info li{padding: 3.5%;}
	.dtl_head{width: 10em;}
}

/*pc*/
@media screen and (min-width: 640.1px){
	.recruit_dtl{width:calc(100% - 230px);}
	.dtl_head,.dtl_info{display: table-cell; vertical-align: middle;}
	.dtl_head{width: 9.5em;}
	.dtl_info{padding-left: 1em;}
	.recruit_dtl .btn_wrap{text-align: right;}
	.dtl_wrap:last-of-type{margin-bottom: 1em;}
}
/*pc l*/
@media screen and (min-width: 1000px){
	.intro{padding: 0 4%;}
	.dtl_wrap{padding-right: 200px;}
	.dtl_wrap:last-of-type{margin-bottom: 0;}
	.btn.small{position: absolute; bottom: 0; right: 0;}
}