/*
|--------------------------------------------------------------------------
| 1. TOP main visual
|--------------------------------------------------------------------------
*/	


.main-image-1 {
  background-image: url('../images/index/main-image-1.jpg');
}

.main-image-2 {
  background-image: url('../images/recruit/main-image-2.jpg');
}


/*
|--------------------------------------------------------------------------
| 2. Bloc images
|--------------------------------------------------------------------------
*/	

.news-1 {
	background-image:url(../images/index/news-1.jpg);
}

.news-2 {
	background-image:url(../images/index/news-2.jpg);
}

.news-3 {
	background-image:url(../images/index/news-3.jpg);
}


/*
|--------------------------------------------------------------------------
| 3. Manga Production Dept.
|--------------------------------------------------------------------------
*/	


#mpdHeader .mask:before {
	background-color: #FFF;
	opacity: 0;
}

header#mpdHeader {margin: 0 0 -160px;}
	header#mpdHeader h1 {
		display: block;
		overflow: hidden;
		background: url(../images/products/title_manga_prod01.png) 0 0 no-repeat;
		height: 0px;
		width: 1000px;
		padding: 270px 0 0;
		margin: 0 auto 0;
	}

#mpdWrap {
	background: url(../images/products/bg_manga_cont01.gif) 0 0;
	height: auto;
	width: auto;
	padding: 170px 0 157px;
}

section#mpdAbout .aboutText01 {padding: 0 0 55px;}
section#mpdAbout .aboutText01 p {
	color: #ff40af;
	font-size: 28px;
	font-weight: bold;
	line-height: 1.67;
	text-align: center;
	letter-spacing: -0.03em;
}

section#mpdAbout .aboutText02 {
	background-color: #FFF;
	border: 6px solid #ff40af; 
	color: #ff40af;
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	width: 726px;
	margin: 0 auto 0;
}
	section#mpdAbout .aboutText02 .aboutImage01 {
		overflow: hidden;
		background: url(../images/products/text_youbeijyu01.png) 0 0 no-repeat;
		height: 0px;
		width: 520px;
		padding: 241px 0 0;
		margin: 0 auto 0;
	}

	section#mpdAbout .aboutText02 ul.aboutImage02 {
		display: block;
		list-style: none;
		width: 390px;
		padding: 0 0 35px;
		margin: 0 auto 0;
	}
		/* ▽floatさせたボックスが親ボックスの外にはみ出す現象を回避（ここから）▽ */
		section#mpdAbout .aboutText02 ul.aboutImage02:after {
			clear: both;
			overflow: hidden;
			content: "";
			display: block;
			height: 0px;
		}
		/* △floatさせたボックスが親ボックスの外にはみ出す現象を回避（ここまで）△ */

	section#mpdAbout .aboutText02 ul.aboutImage02 li {
		float: left;
		display: block;
		overflow: hidden;
		height: 0px;
		width: 115px;
		padding: 191px 0 0;
	}

	section#mpdAbout .aboutText02 ul.aboutImage02 li.a01 {
		background:url(../images/products/icon_asha01.png) center center no-repeat;
		margin: 0 23px 0 0;
	}

	section#mpdAbout .aboutText02 ul.aboutImage02 li.b01 {
		background:url(../images/products/icon_bsha01.png) center center no-repeat;
		margin: 0 22px 0 0;
	}
	section#mpdAbout .aboutText02 ul.aboutImage02 li.c01 {background:url(../images/products/icon_csha01.png) center center no-repeat;}

section#mpdAbout .iconSet01 {
	position: relative;
	width: 982px;
	margin: 0 auto;
}
	section#mpdAbout .iconSet01 div {
		position: absolute;
		display: block;
		overflow: hidden;
		height: 0;
		z-index: 100;
	}

	section#mpdAbout .iconSet01 .pen01 {
		background: url(../images/products/icon_pen01.png) center center no-repeat;
		width: 129px;
		padding: 143px 0 0;
		bottom: 88px;
		left: -69px;
	}

	section#mpdAbout .iconSet01 .eraser01 {
		background: url(../images/products/icon_eraser01.png) center center no-repeat;
		width: 69px;
		padding: 63px 0 0;
		top: 186px;
		right: 6px;
	}

	section#mpdAbout .iconSet01 .ink01 {
		background: url(../images/products/icon_ink01.png) center center no-repeat;
		width: 78px;
		padding: 100px 0 0;
		bottom: -456px;
		left: -32px;
	}

	section#mpdAbout .iconSet01 .quill01 {
		background: url(../images/products/icon_quill01.png) center center no-repeat;
		width: 140px;
		padding: 175px 0 0;
		bottom: -689px;
		right: -52px;
	}

section#mpdStaff {
	position: relative;
	border-top: 6px solid #ff40af;
	border-left: 6px solid #ff40af;
	width: 982px;
	padding: 0 0 56px;
	margin: 45px auto 0;
}
	section#mpdStaff .container h2 {
		background: url(../images/products/bg_fukidashi01.png) 0 0 no-repeat;
		color: #ff40af;
		font-size: 52px;
		font-family: 'Open Sans', sans-serif;
		font-weight: bold;
		line-height: 1.72;
		letter-spacing: -0.03em;
		height: 113px;
		width: 333px;
		padding: 0 0 0 28px;
		margin: 0 0 13px;
	}

	section#mpdStaff .container .staff01 {
		position: absolute;
		overflow: hidden;
		background: url(../images/products/icon_staff01.png) center center no-repeat;
		height: 0px;
		width: 139px;
		padding: 121px 0 0;
		top: 24px;
		right : -75px;
	}

    section#mpdStaff .staffText01 {
		float: left;
        position: relative;
        border-radius: 45px;
		background-color: #ff40af;
		color: #FFF;
		font-size: 20px;
		font-weight: bold;
		min-height: 247px;
		width: 424px;
		padding: 25px 29px;
		margin: 20px -4px 25px 44px;
    }

	section#mpdStaff .staffText01::before {
        position: absolute;
        content: "";
        border: 15px solid transparent;
		border-bottom: 25px solid transparent;
        border-top: 25px solid #ff40af;
        bottom: -50px;
        left: 196px;
    }

	section#mpdStaff .staffText01:nth-child(odd) {clear: both;}
	section#mpdStaff .staffText01 p {line-height: 1.4;}
	section#mpdStaff .staffText01 span {
		display: block;
		position: absolute;
		bottom: 10px;
		right: 32px;
	}

section#mpdWorks {
	position: relative;
	border-top: 6px solid #ff40af;
	border-right: 6px solid #ff40af;
	width: 982px;
	padding: 0 0 65px;
	margin: 0 auto 0;
}
	section#mpdWorks .container h2 {
		float: right;
		background: url(../images/products/bg_fukidashi02.png) 0 0 no-repeat;
		color: #ff40af;
		font-size: 52px;
		font-family: 'Open Sans', sans-serif;
		font-weight: bold;
		line-height: 1.72;
		letter-spacing: -0.03em;
		text-align: right;
		height: 109px;
		width: 300px;
		padding: 0 30px 0 0;
		margin: 0 194px 13px 0;
	}

	section#mpdWorks .container .works01 {
		position: absolute;
		overflow: hidden;
		background: url(../images/products/icon_works01.png) center center no-repeat;
		height: 0px;
		width: 131px;
		padding: 132px 0 0;
		top: 8px;
		left: -85px;
	}

	section#mpdWorks .container .worksList01 {
		clear: both;
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		max-width: 1170px;
		padding: 0 0 0 31px;
	}

	section#mpdWorks .container .worksList01 figure {
		display: block;
		color: #ff40af;
		font-weight: bold;
		line-height: 1.2;
		text-align: center;
		width: 282px;
		margin: 21px 36px 0 0;
	}

	section#mpdWorks .container .worksList01 figure img {
		border: none; /** 6px solid #ffffff **/
		height: 277px;
		width: 282px;
	}

	section#mpdWorks .container .worksList01 figure figcaption {margin: 0 0 0;}
	section#mpdWorks .container .worksList01 figure figcaption b {
		display: block;
		font-size: 26px;
		padding: 26px 0 5px;
	}

	section#mpdWorks .container .worksList01 figure figcaption span {
		display: block;
		font-size: 15px;
	}

section#mpdApply {
	position: relative;
	border-top: 6px solid #ff40af;
	border-left: 6px solid #ff40af;
	width: 982px;
	padding: 0 0 64px;
	margin: 0 auto 0;
}
	section#mpdApply .container h2 {
		float: left;
		background: url(../images/products/bg_fukidashi03.png) 0 0 no-repeat;
		color: #ff40af;
		font-size: 51px;
		font-family: 'Open Sans', sans-serif;
		font-weight: bold;
		line-height: 1.1;
		letter-spacing: 0.02em;
		-ms-writing-mode: tb-rl;
  		writing-mode: vertical-rl;
		height: 252px;
		width: 173px;
		padding: 17px 40px 0 0;
		margin: 0 0 0;
	}

	section#mpdApply .container h2 span {
		display: inline;
		font-size: 40px;
		font-family: 'Open Sans', sans-serif;
		font-weight: bold;
		letter-spacing: normal;
		margin: 0;
	}

	section#mpdApply .container .applyText01 {
		float: left;
		width: 774px;
		padding: 30px 0 0 50px;
	}

	section#mpdApply .container .applyText01 p {
		color: #ff40af;
		font-size: 28px;
		font-weight: bold;
		line-height: 1.65;
		letter-spacing: -0.03em;
	}

	section#mpdApply .container .applyWrap01 {
		clear: both;
		padding: 44px 0 0 40px;
	}

	section#mpdApply .container .applyText02 {
		clear: both;
		display: block;
		border: 6px solid #ff40af;
		background-color: #FFF;
		color: #ff40af;
		width: 890px;
	}

	section#mpdApply .container .applyText02 h3 {
		color: #ff40af;
		font-size: 40px;
		font-family: 'Open Sans', sans-serif;
		font-weight: bold;
		line-height: 1.1;
		text-align: center;
		padding: 5px 0 0;
	}

	section#mpdApply .container .applyText02 ul {
		list-style: inside;
		font-size: 22px;
		font-weight: bold;
		line-height: 1.45;
		padding: 29px 62px 59px;
	}

	section#mpdApply .container .applyToForm01 {
		background:url(../images/products/icon_triangle01.png) 50% 43px  no-repeat;
		width: 890px;
		padding: 124px 0 0 0;
		margin: 0 0 0 40px;
	}

	section#mpdApply .container .applyToForm01 .button01 {
		background-color: #FF40AF;
		color: #FFF;
		font-size: 64px;
		font-weight: bold;
		line-height: 148px;
		letter-spacing: -0.03em;
		text-align: center;
		vertical-align: middle;
		height: 148px;
		width: 884px;
		margin: 0 auto;
	}

	section#mpdApply .container .applyToForm01 a:hover {color: #FFF;}	

section#nekoToTop {
	position: relative;
	width: 982px;
	margin: 0 auto;
}
	section#nekoToTop div {
		position: absolute;
		overflow: hidden;
		background: url(../images/products/icon_totop01.png) center center no-repeat;
		height: 0;
		width:123px;
		padding: 130px 0 0;
		bottom: -18px;
		right: -26px;
		z-index: 1000;
	}

footer#main-footer,
footer#main-footer #footer-rights {
	background-color: #FFF;
	color: #FF40AF;
	font-weight: bold;
}


@media all and (max-width: 1199.98px) {
header#mpdHeader .container {padding: 30px 0;}
section#mpdStaff .container {margin: 0 6px 0 0;}
section#mpdWorks .container {margin: 0 0 0 6px;}
section#mpdWorks .container h2 {margin: 0 0 13px 0;}
section#mpdWorks .container .worksList01 {padding: 21px 0 0 25px;}
section#mpdApply .container {margin: 0 6px 0 0;}
section#nekoToTop {width: auto;}
section#nekoToTop div {right: 82px;}
}

@media all and (max-width: 991.98px) {
header#mpdHeader {
	height: auto;
	margin-bottom: -215px;
}
	header#mpdHeader h1 {
		background: url(../images/products/title_manga_prod02.png) center center no-repeat;
		background-size: contain;
		width: auto;
		padding-top: 49.5%;
	}

#mpdWrap {padding: 226px 0 186px;}
section#mpdAbout .aboutText01 {padding-bottom: 50px;}
	section#mpdAbout .aboutText01 p {
		font-size: 23px;
		font-weight: bold;
		line-height: 1.7;
	}

section#mpdAbout .aboutText02 {
	border: 4px solid #ff40af; 
	font-size: 39px;
	width: 584px;
}
	section#mpdAbout .aboutText02 .aboutImage01 {
		background-size: contain;
		width: 501px;
		padding-top: 233px;
		margin: -2px auto;
	}

	section#mpdAbout .aboutText02 ul.aboutImage02 {
		width: 374px;
		padding: 0 0 46px;
		margin: 0 auto 0;
	}

	section#mpdAbout .aboutText02 ul.aboutImage02 li {
		width: 109px;
		padding-top: 183px;
	}

	section#mpdAbout .aboutText02 ul.aboutImage02 li.a01,
	section#mpdAbout .aboutText02 ul.aboutImage02 li.b01,
	section#mpdAbout .aboutText02 ul.aboutImage02 li.c01 {background-size: contain;}
	section#mpdAbout .aboutText02 ul.aboutImage02 li.a01 {margin: 0 24px 0 0;}
	section#mpdAbout .aboutText02 ul.aboutImage02 li.b01 {margin: 0 23px 0 0;}

section#mpdAbout .iconSet01 {width: 584px;}
	section#mpdAbout .iconSet01 .pen01,
	section#mpdAbout .iconSet01 .eraser01,
	section#mpdAbout .iconSet01 .quill01 {background-size: contain;}
	section#mpdAbout .iconSet01 .pen01 {
		width: 99px;
		padding: 110px 0 0;
		bottom: -22px;
		left: -12px;
	}

	section#mpdAbout .iconSet01 .eraser01 {
		width: 54px;
		padding: 49px 0 0;
		top: -80px;
		right: 7px;
	}

	section#mpdAbout .iconSet01 .ink01 {display: none;}
	section#mpdAbout .iconSet01 .quill01 {
		width: 99px;
		padding: 124px 0 0;
		bottom: -28px;
		right: -17px;
	}

section#mpdStaff {
	border-top: 4px solid #ff40af;
	border-left: 4px solid #ff40af;
	width: auto;
	padding: 0 0 121px;
	margin: 65px 30px 0;
}
	section#mpdStaff .container {width: auto;}
	section#mpdStaff .container h2 {
		background: url(../images/products/bg_fukidashi01s.png) 0 0 no-repeat;
		font-size: 39px;
		letter-spacing: normal;
		height: 87px;
		width: 257px;
		padding: 2px 0 0 20px;
		margin: 0 0 41px;
	}

	section#mpdStaff .container .staff01 {
		background-size: contain;
		width: 123px;
		padding: 108px 0 0;
		top: 20px;
		right : -41px;
	}

    section#mpdStaff .staffText01 {
		clear: both;
        border-radius: 30px;
		font-size: 22px;
		font-weight: bold;
		height: auto;
		width: auto;
		padding: 28px 32px 45px;
		margin: 20px 48px 28px 52px;
    }

	section#mpdStaff .staffText01::before {left: 50%;}
	section#mpdStaff .staffText01 span {
		font-size: 24px;
		right: 35px;
	}

section#mpdWorks {
	border-top: 4px solid #ff40af;
	border-right: 4px solid #ff40af;
	width: auto;
	padding: 0 0 98px;
	margin: 0 30px 0;
}
	section#mpdWorks .container {width: auto;}
	section#mpdWorks .container h2 {
		background: url(../images/products/bg_fukidashi02s.png) 0 0 no-repeat;
		font-size: 39px;
		letter-spacing: normal;
		height: 84px;
		width: 231px;
		padding: 1px 23px 0 0;
		margin: 0 0 13px 0;
	}

	section#mpdWorks .container .works01 {
		background-size: contain;
		width: 116px;
		padding-top: 117px;
		top: 8px;
		left: -37px;
	}

	section#mpdWorks .container .worksList01 {padding: 0 29px 0 45px;}
	section#mpdWorks .container .worksList01 figure {
		width: 31%;
		margin: 29px 3.5% 0 0;
	}

	section#mpdWorks .container .worksList01 figure:nth-child(3n) {margin-right: 0;}
	section#mpdWorks .container .worksList01 figure img {
		border: none; /** 4px solid #ff40af **/
		height: auto;
		width: 100%;
	}

	section#mpdWorks .container .worksList01 figure figcaption b {
		font-size: 25px;
		padding: 21px 0 4px;
	}

	section#mpdWorks .container .worksList01 figure figcaption span {font-size: 16px;}

section#mpdApply {
	border-top: 4px solid #ff40af;
	border-left: 4px solid #ff40af;
	width: auto;
	padding: 0 0 14px;
	margin: 0 30px 0;
}
	section#mpdApply .container {width: auto;}
	section#mpdApply .container h2 {
		background: url(../images/products/bg_fukidashi03s.png) 0 0 no-repeat;
		font-size: 39px;
		height: 194px;
		width: 133px;
		padding: 13px 27px 0 0;
	}

	section#mpdApply .container h2 span {font-size: 30px;}
	section#mpdApply .container .applyText01 {
		width: auto;
		padding: 33px 22px 0 22px;
		margin: -194px 0 0 133px;
	}

	section#mpdApply .container .applyText01 p {
		font-size: 21px;
		line-height: 1.55;
		letter-spacing: -0.03em;
	}

	section#mpdApply .container .applyWrap01 {padding: 55px 19px 0 25px;}
	section#mpdApply .container .applyText02 {
		border: 4px solid #ff40af;
		width: auto;
	}

	section#mpdApply .container .applyText02 h3 {
		font-size: 31px;
		margin: 20px 0 0;
	}

	section#mpdApply .container .applyText02 ul {
		list-style: inside;
		font-size: 16px;
		font-weight: bold;
		line-height: 1.45;
		padding: 19px 17px 12px;
	}

	section#mpdApply .container .applyToForm01 {
		background:url(../images/products/icon_triangle02.png) 50% 37px  no-repeat;
		width: auto;
		padding: 98px 0 0 0;
		margin: 0 27px;
	}

	section#mpdApply .container .applyToForm01 .button01 {
		font-size: 39px;
		line-height: 1;
		height: auto;
		width: auto;
		padding: 28px 28px 27px;
		margin-right: -6px;
	}

section#nekoToTop {width: auto;}
	section#nekoToTop div {
		background-size: contain;
		width: 95px;
		padding-top: 100px;
		bottom: 5px;
		right: 31px;
		z-index: 1000;
	}
}

@media all and (max-width: 767.98px) {
header#mpdHeader {margin-bottom: -160px;}
#mpdWrap {padding: 172px 0 186px;}
section#mpdWorks .container .worksList01 {padding: 0 22px 0 42px;}
	section#mpdWorks .container .worksList01 figure {
		width: 46%;
		margin: 28px 4% 0 0;
	}

	section#mpdWorks .container .worksList01 figure:nth-child(3n) {margin-right: 4%;}

}

@media all and (max-width: 641.98px) {
section#mpdAbout .aboutText01 {padding-bottom: 50px;}
section#mpdAbout .aboutText02 {
	width: auto;
	margin: 0 29px 0;
}
	section#mpdAbout .aboutText02 .aboutImage01 {
		width: auto;
		padding-top: 40.5%;
		margin: -2px 38px;
	}

section#mpdAbout .iconSet01 {
	width: auto;
	margin: 0 29px;
}

	section#mpdAbout .iconSet01 .pen01 {
		width: 16.97%;
		padding-top: 18.85%;
		bottom: -22px;
		left: -12px;
	}

	section#mpdAbout .iconSet01 .eraser01 {
		width: 9.25%;
		padding-top: 8.4%;
		top: -80px;
		right: 7px;
	}

	section#mpdAbout .iconSet01 .ink01 {display: none;}
	section#mpdAbout .iconSet01 .quill01 {
		width: 16.97%;
		padding-top: 21.25%;
		bottom: -28px;
		right: -17px;
	}
}

@media all and (max-width: 516.98px) {
section#mpdAbout .aboutText02 ul.aboutImage02 {
	width: auto;
	padding: 0 38px 46px;
}
	section#mpdAbout .aboutText02 ul.aboutImage02 li {
		width: 29.14%;
		padding-top: 48.9%;
	}

	section#mpdAbout .aboutText02 ul.aboutImage02 li.a01,
	section#mpdAbout .aboutText02 ul.aboutImage02 li.b01,
	section#mpdAbout .aboutText02 ul.aboutImage02 li.c01 {background-size: contain;}
	section#mpdAbout .aboutText02 ul.aboutImage02 li.a01 {margin: 0 6.41% 0 0;}
	section#mpdAbout .aboutText02 ul.aboutImage02 li.b01 {margin: 0 6.14% 0 0;}
}

@media all and (max-width: 480.98px) {
section#mpdAbout .aboutText01 p {font-size: 18px;}
section#mpdAbout .aboutText02 {font-size: 25px;}
section#mpdStaff .container .staff01 {
	width: 29.56%;
	padding-top: 28.36%;
}

section#mpdStaff .staffText01 {
		font-size: 18px;
		margin: 20px 0px 28px 26px;
    }

section#mpdStaff .staffText01 span {font-size: 20px;}
section#mpdWorks .container .works01 {
	width: 27.88%;
	padding-top: 28.12%;
}

section#mpdWorks .container .worksList01 {padding: 29px 15px 0 0;}
section#mpdWorks .container .worksList01 figure figcaption b {font-size: 20px;}
section#mpdWorks .container .worksList01 figure figcaption span {font-size: 14px;}
section#mpdApply .container .applyText01 {
	float: none;
	padding: 10px 0 0 26px;
	margin: 194px 0 0 0;
}

section#mpdApply .container .applyText01 p {font-size: 18px;}
section#mpdApply .container .applyText02 h3 {font-size: 25px;}
section#mpdApply .container .applyText02 ul {font-size: 14px;}
section#mpdApply .container .applyToForm01 .button01 {font-size: 31px;}
}


/*PCで無効*/
.pc_hid{
    display: none;
}

/*スマートフォンで有効*/
@media screen and (max-width:768px) {
    .pc_hid{
        display: block;
    }
}
