@charset "utf-8";


@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: 500;
}

.yu{
	font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, MS PGothic, sans-serif;
}

#pc_menu ul .menu1:before{
	color:#ec6d56;
	}
	
#hasei_main{
	padding-top:480px;
	}
	

#hasei_main .hasei_image{
	background:url(../image/profile_main.jpg) center center;
	background-size:cover;
	}

#hasei_main .hasei_image h1{
	width:140px;
	}
	
#hasei_main .profile_txt{
	width:100%;
	background:#fff;
	position:relative;
	box-sizing:border-box;
	
	}
#hasei_main .profile_txt:before{
	content:"";
	width:100%;
	height:154px;
	display:block;
	position:absolute;
	left:0;
	top:-154px;
	background:url(../image/profile_txt_bg.png) top center no-repeat;
	
	}
	/*
#hasei_main .profile_txt:before{
	content:"";
	display:block;
	width:100vw;
	height:1144px;
	border-radius:50vw 50vw 50vw 50vw / 650px 650px 650px 650px;
	box-sizing:border-box;
	background:#fff;
	position:absolute;
	left:0;
	right:0;
	margin:auto;
	top:-155px;
	}
	*/

#hasei_main .profile_txt_inr{
	width:calc(100% - 30px);
	margin:0 auto;
	max-width:824px;
	padding-top:150px;
	position:relative;
	height:257px;
}
#hasei_main .profile_txt_inr h2{
	width:396px;
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	top:-85px;
	}
	
#hasei_main .profile_txt_inr p{
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	top:-25px;
	text-align:center;
	font-size:14px;
	line-height:32px;
	}
	

#hasei_main .profile_txt_inr .naming{
	width:155px;
	position:absolute;
	top:165px;
	left:145px;
	}
	
#hasei_main .profile_txt_inr .catchcopy{
	width:155px;
	position:absolute;
	top:165px;
	right:145px;
	}
	
#hasei_main .profile_txt_inr .planning{
	width:155px;
	position:absolute;
	top:230px;
	left:0;
	}
	
#hasei_main .profile_txt_inr .webscript{
	width:155px;
	position:absolute;
	top:230px;
	right:10px;
	}
	
#hasei_main .profile_txt_inr .interviewarticles{
	width:231px;
	position:absolute;
	top:297px;
	left:60px;
	}
	
#hasei_main .profile_txt_inr .magazinearticles{
	width:231px;
	position:absolute;
	top:297px;
	right:69px;
	}

#hasei_main .profile_txt_inr .illust{
	width:117px;
	position:absolute;
	left:0;
	right:0;
	bottom:-10px;
	margin:auto;
	z-index:100;
	}
.fwfw{	
	-webkit-animation-name:fuwafuwa;
	-webkit-animation-duration:6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease;
	-moz-animation-name:fuwafuwa;
	-moz-animation-duration:6s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:ease;
	}
@-webkit-keyframes fuwafuwa {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(0, -10px);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes fuwafuwa {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(0, -10px);}
	100% {-moz-transform:translate(0, 0);}
}

	
.fwfw2{	
	-webkit-animation-name:fuwafuwa2;
	-webkit-animation-duration:6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease;
	-moz-animation-name:fuwafuwa2;
	-moz-animation-duration:6s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:ease;
	}
@-webkit-keyframes fuwafuwa2 {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(0, -10px);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes fuwafuwa2 {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(0, -10px);}
	100% {-moz-transform:translate(0, 0);}
}
	
.lrlr{	
	-webkit-animation-name:lrlr;
	-webkit-animation-duration:6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease;
	-moz-animation-name:lrlr;
	-moz-animation-duration:6s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:ease;
	}
@-webkit-keyframes lrlr {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(-5px, 0);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes lrlr {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(-5px, 0);}
	100% {-moz-transform:translate(0, 0);}
}

.lrlr2{	
	-webkit-animation-name:lrlr2;
	-webkit-animation-duration:6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease;
	-moz-animation-name:lrlr2;
	-moz-animation-duration:6s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:ease;
	}
@-webkit-keyframes lrlr2 {
	00% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(10px, 0);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes lrlr2 {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(10px, 0);}
	100% {-moz-transform:translate(0, 0);}
}
.tbtb{	
	-webkit-animation-name:tbtb;
	-webkit-animation-duration:6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease;
	-moz-animation-name:tbtb;
	-moz-animation-duration:6s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:ease;
	}
@-webkit-keyframes tbtb {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(0, 5px);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes tbtb {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(0, 5px);}
	100% {-moz-transform:translate(0, 0);}
}

	
.tbtb2{	
	-webkit-animation-name:tbtb2;
	-webkit-animation-duration:6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease;
	-moz-animation-name:tbtb2;
	-moz-animation-duration:6s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:ease;
	}
@-webkit-keyframes tbtb2 {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(0, 10px);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes tbtb2 {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(0, 10px);}
	100% {-moz-transform:translate(0, 0);}
}



@media screen and ( max-width: 780px ) {
	
	
#hasei_main{
	padding-top:0px;
	}

#hasei_main .hasei_image{
	background:url(../image/profile_main.jpg) center center;
	background-size:cover;
	}

#hasei_main .hasei_image h1{
	width:90px;
	}
	
#hasei_main .profile_txt{
	width:100%;
	background:#fff;
	position:relative;
	box-sizing:border-box;
	
	}
#hasei_main .profile_txt:before{
	content:"";
	width:100%;
	height:30px;
	display:block;
	position:absolute;
	left:0;
	top:-30px;
	background:url(../image/profile_txt_bg_sp.png) top center no-repeat;
	background-size:cover;
	
	}
#hasei_main .profile_txt_inr{
	padding-top:5px;
	position:relative;
	height:auto;
	padding-bottom:200px;
}
#hasei_main .profile_txt_inr h2{
	width:297px;
	margin:0 auto 15px;
	position:relative;
	left:0;
	right:0;
	top:auto;
	}
	
#hasei_main .profile_txt_inr p{
	margin:0 auto ;
	position:relative;
	left:0;
	right:0;
	top:auto;
	text-align:center;
	font-size:13px;
	line-height:2.25em;
	}
	

#hasei_main .profile_txt_inr .naming{
	width:23%;
	max-width:80px;
	top:auto;
	bottom:135px;
	left:17%;
	}
	
#hasei_main .profile_txt_inr .catchcopy{
	width:23%;
	max-width:80px;
	top:auto;
	bottom:135px;
	right:17.7%;
	}
	
#hasei_main .profile_txt_inr .planning{
	width:23%;
	max-width:80px;
	top:auto;
	bottom:95px;
	left:0;
	}
	
#hasei_main .profile_txt_inr .webscript{
	width:23%;
	max-width:80px;
	top:auto;
	bottom:95px;
	right:0;
	}
	
#hasei_main .profile_txt_inr .interviewarticles{
	width:38%;
	max-width:122px;
	top:auto;
	bottom:55px;
	left:10px;
	}
	
#hasei_main .profile_txt_inr .magazinearticles{
	width:38%;
	max-width:122px;
	top:auto;
	bottom:55px;
	right:10px;
	}

#hasei_main .profile_txt_inr .illust{
	width:80px;
	position:absolute;
	left:0;
	right:0;
	bottom:-10px;
	margin:auto;
	z-index:100;
	}

	}
/* ==========================================================================
	writer
========================================================================== */
#writer{
	width:100%;
	position:relative;
	padding:105px 0 80px;
	background:#fdf9f2;
	}
.writer_inr{
	width:calc(100% - 30px);
	max-width:1000px;
	margin:0 auto;
	background:#fff;
	padding:110px 90px 80px;
	box-sizing:border-box;
	position:relative;
	}

.writer_inr h1{
	width:400px;
	position:absolute;
	top:-25px;
	left:0;
	right:0;
	margin:auto;
	}

.profile_box{
	width:100%;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			margin:0 auto;
			
	}
.profile_box .img_box{
	width:36%;
	height:auto;
	background:url(../image/profile_img.jpg) center center no-repeat;
	background-size:cover;
	}
.profile_box .text_box{
	width:58%;
	}

.profile_box .text_box h2{
	font-size:18px;
	position:relative;
	margin-bottom:20px;
	color:#000;
	letter-spacing:0.02em;
	margin-top:10px;
	}
	
.profile_box .text_box h2:before{
	content:"Asako Iseki";
	font-size:12px;
	color:#9b9b9b;
	position:absolute;
	left:105px;
	top:2px;
}
.profile_box .text_box p{
	font-size:13px;
	line-height:26px;
	color:#111;
	letter-spacing:0.02em;
	margin-bottom:16px;
	}

.profile_box ul{
	margin-top:32px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	
	}

.profile_box ul li{
	width:150px;
	-webkit-transition: margin 0.4s ease;
    -moz-transition: margin 0.4s ease;
    -o-transition: margin 0.4s ease;
    transition: margin 0.4s ease;
	}
.profile_box ul li:hover{
	margin-top:-10px;
	}
.profile_box ul li:hover a{
filter: alpha(opacity=100);
-moz-opacity:1;
opacity:1;
	}



.profile_box .tsuyomi{
	width:100%;
	position:relative;
	padding:50px 0 40px;
	box-sizing:border-box;
	background:#fdf9f2;
	margin-top:70px;
	}
	

.profile_box .tsuyomi h2{
	font-size:32px;
	letter-spacing:0.075em;
	text-align:center;
	color:#d8ad63;
	font-weight:500;
	position:absolute;
	left:0;
	right:0;
	top:-15px;
	margin:auto;
	font-weight:bold;
	}

.profile_box .tsuyomi .tsuyomi_box{
	width:84%;
	margin:0 auto 20px;
	text-align:center;
	padding:35px 15px;
	box-sizing:border-box;
	background:#fff;
	}

.profile_box .tsuyomi .tsuyomi_box h3{
	font-size:20px;
	position:relative;
	margin:30px auto 20px;
	color:#000;
	}
.profile_box .tsuyomi .tsuyomi_box h3:before{
	content:"isekino thuyomi 01";
	font-family: 'Alegreya Sans SC', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
	font-weight:500;
	display:block;
	position:absolute;
	top:-30px;
	left:0;
	right:0;
	margin:auto;
	font-size:20px;
	color:#d8ad63;
	letter-spacing:0.075em;
	}
.profile_box .tsuyomi .box2 h3:before{
	content:"isekino thuyomi 02";
		
	}
.profile_box .tsuyomi .box3 h3:before{
	content:"isekino thuyomi 03";
		
	}
.profile_box .tsuyomi .tsuyomi_box p{
	font-size:13px;
	line-height:26px;
	}
@media screen and ( max-width: 1030px ) {

.writer_inr{
	width:calc(100% - 30px);
	max-width:1000px;
	margin:0 auto;
	background:#fff;
	padding:110px 6% 80px;
	box-sizing:border-box;
	position:relative;
	}

.profile_box ul li{
	width:31.25%;
	}
	
	}
	
	
@media screen and ( max-width: 780px ) {
#writer{
	padding:48px 0 0;
}
.writer_inr{
	width:100%;
	background:none;
	padding:0;
}

.writer_inr h1{
	width:calc(100% - 30px);
	max-width:380px;
	position:relative;
	top:0;
	left:0;
	right:0;
	margin:auto;
	}
	




.profile_box .img_box{
	width:calc(100% - 30px);
	
	height:225px;
	background:url(../image/profile_img_sp.jpg) top center no-repeat;
	background-size:cover;
	margin:22px auto 25px;
	}
.profile_box .text_box{
	width:calc(100% - 30px);
	margin-left:15px;
	}

.profile_box .text_box h2{
	font-size:16px;
	position:relative;
	margin-bottom:20px;
	margin-top:0px;
	}
	
.profile_box .text_box h2:before{
	content:"Asako Iseki";
	font-size:10px;
	color:#9b9b9b;
	position:absolute;
	left:85px;
	top:3px;
}
.profile_box .text_box p{
	font-size:12px;
	line-height:1.75em;
	margin-bottom:10px;
	}

.profile_box ul{
	margin-top:25px;
}

.profile_box ul li{
	width:31%;
}



.profile_box .tsuyomi{
	padding:40px 15px;
	box-sizing:border-box;
	background:#fff;
	margin-top:56px;
	}
	

.profile_box .tsuyomi h2{
	font-size:23px;
	top:-11px;
	}

.profile_box .tsuyomi .tsuyomi_box{
	width:100%;
	margin:0 auto 20px;
	text-align:center;
	padding:50px 15px 25px;
	background:#fdf9f2;
	border:1px solid #e2c188;
	}

.profile_box .tsuyomi .tsuyomi_box h3{
	font-size:16px;
	position:relative;
	margin:0 auto 15px;
	color:#000;
	}
.profile_box .tsuyomi .tsuyomi_box h3:before{
	top:-25px;
	font-size:14px;
	}
.profile_box .tsuyomi .tsuyomi_box p{
	font-size:12px;
	line-height:1.75em;

	}

	
	}
/* ==========================================================================
	episode
========================================================================== */
#episode{
	width:100%;
	position:relative;
	padding:95px 0 80px;
	background:#fff;
	}
#episode h1{
	width:349px;
	margin:0 auto;
	position:relative;
	}
#episode h1:before{
	content:"これを読めば、だいたい分かっちゃう";
	width:300px;
	position:absolute;
	left:0;
	right:0;
	top:-30px;
	text-align:center;
	color:#ec6d56;
	font-size:13px;
	}
#episode .episode_box{
	width:100%;
	max-width:765px;
	height:513px;
	margin:50px auto 40px;
	background:url(../image/episode_bg.png)center center;
	background-size:cover;
	padding:80px 50px 0 78px;
	box-sizing:border-box;
	}
#episode .episode_box h2{
	font-size:20px;
	padding-left:40px;
	color:#d8ad63;
	font-weight:500;
	letter-spacing:0.075em;
	position:relative;
	}
	
#episode .episode_box h2:before{
	content:"";
	display:block;
	width:24px;
	height:20px;
	position:absolute;
	left:0;
	top:0px;
	background:url(../image/episode_icon.png);
	background-size:cover;
	}
#episode .episode_box h3{
	font-size:20px;
	color:#000;
	margin:17px 0 21px;
	}
#episode .episode_box p{
	font-size:13px;
	line-height:26px;
	color:#333;
	}


#episode .episode2,
#episode .episode3{
	display:none;
	}
	
	
#episode ul{
	width:660px;
	margin:0 auto;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	}

#episode ul li{
	width:200px;
	height:45px;
	text-align:center;
	background:#dd4d3a;
	border-radius: 45px;        /* CSS3草案 */  
    -webkit-border-radius: 45px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 45px;   /* Firefox用 */
	padding-top:11px;
	box-sizing:border-box;
	font-size:20px;
	letter-spacing:0.075em;
	color:#fff;
	font-family: 'Alegreya Sans SC', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;

	-webkit-transition: opacity 0.4s ease;
    -moz-transition: opacity 0.4s ease;
    -o-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
	cursor: pointer;
	}

#episode ul .now{
	background:#cfcfcf;
	}
	
#episode ul li:hover {
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
}


	
@media screen and ( max-width: 780px ) {
#episode{
	padding:23px 0 55px;
}
#episode h1{
	width:258px;
	margin-bottom:34px;
	}
#episode h1:before{
	width:200px;
	top:-22px;
	font-size:10px;
	left:0;
	right:0;
	margin:auto;
	}


#episode .episode_box{
	width:100%;
	max-width:765px;
	height:auto;
	margin:0 auto;
	background:#fdf9f2;
	padding:20px 15px 35px 28px;
	box-sizing:border-box;
	}
#episode .episode_box h2{
	font-size:15px;
	padding-left:28px;
}
	
#episode .episode_box h2:before{
	width:18px;
	height:15px;
	}
#episode .episode_box h3{
	font-size:16px;
	color:#000;
	margin:10px 0 15px;
	}
#episode .episode_box p{
	font-size:12px;
	line-height:1.75em;
}

#episode ul{
	width:calc(100% - 30px);
	margin-top:30px;
}

#episode ul li{
	width:32%;
	height:40px;
	border-radius: 40px;        /* CSS3草案 */  
    -webkit-border-radius: 40px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 40px;   /* Firefox用 */
	padding-top:11px;
	font-size:17px;
	}
	}