body {
    margin: 0;
    padding: 0;
    background-color:#f0fafe;
    font-family: 'Noto Sans JP','ヒラギノ角ゴ Pro W3',Arial,'ＭＳ Ｐゴシック','MS P Gothic','メイリオ',Meiryo,'Hiragino Kaku Gothic Pro',sans-serif,Helvetica;
}

html{ 

} 

a:link, a:visited {
    text-decoration: none;    
}

.header {
    width: 100%;
    background-color: #0bbebe;
    position: fixed;
    z-index:9999;
	box-shadow: 0px 0px 10px -2px #6a7678;
}

.header__wrap {
    display:flex;
    padding: 5px 0;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    margin:0 auto;
    width: 1000px;
    height:56px;
}



.header__nav {
    
}

.header__navsp {
    display: none;
}

.header__nav ul {
    display:flex;
}

.header__nav ul li {
    position: relative;
}

.header__nav ul li a {
   padding: 0 15px 0 15px;
}
/*
.header_ttl_sp {
	display: none;
}
*/

.header_ttl_sp img {
    width: 120px;
}

.header__nav ul li:after {
    content:"";
    display: block;
    width:2px;
    height:46px;
    background-image:url(../img/menu_line.png);
    background-size: contain;
    position: absolute;
    top: 18px;
    left: 0;
}

.header__nav ul li:first-child:after {
    background-image:none;
}

#mv {
    margin: 0 auto;
    padding-top: 56px;
    text-align: center;
	height: auto;
    z-index:-9999;
}

#mv .mv__body {
    position: relative;
    margin: 0 auto -3px;
    text-align: center;
}
#mv .mv__body img {
    width: 100%;
	}

#mv .mv__banner_body {
    width: 970px;
    position: relative;    
}

#mv .banner {
    position: absolute;
    top: 860px;
    right: 10px;
}

#mv .banner img {
    width: 270px;
}
.youtube {
	width: 46%;
	border: 5px solid #fff;
	border-bottom: 3.5px solid #fff;
	background-color: #fff;
	aspect-ratio: 16 / 9;
	margin-bottom: 30px;
	position: absolute;
	top: 57%;
	left: 11.6%;
}

.youtube iframe {
  width: 100%;
  height: 100%;
}



.slider{
	width: 100%;
	height: auto;
	display: flex;
	margin: auto;
}

.slider {
    width: 100%;
    height: auto;
    padding: 20px 0 0;
    position: relative;
	object-fit: contain;
}

.slider-item {
    margin-right: 5px;
    margin-left: 5px;
	list-style: none;
	
}

.slider-item img {
    height: auto;
    width: 100%;
	width: calc(100% - 10px);
}
.bn_link{
	background-color: #10bdbe;
	    padding-bottom: 2.90625vw;
}


@media all and (max-width:768px) {
    .youtube {
    width: 88%;
    border: 3px solid #fff;
    border-bottom: 0.5px solid #fff;
    background-color: #fff;
    aspect-ratio: 16 / 9;
    margin-bottom: 30px;
    position: absolute;
    top: 67.5%;
    left: 4.6%;
}

.youtube iframe {
  width: 100%;
  height: 100%;
}




.slider{
	width: 100%;
	height: auto;
	display: flex;
	margin: auto;
}

.slider {
    width: 100%;
    height: auto;
    padding: 20px 0 0;
    position: relative;
	object-fit: contain;
}

.slider-item {
    margin-right: 5px;
    margin-left: 5px;
	list-style: none;
	
}

.slider-item img {
    height: auto;
    width: 100%;
	width: calc(100% - 10px);
}
.bn_link{
	background-color: #10bdbe;
	padding-bottom: 5.90625vw;
}


.badge {
    position: absolute;
	right: 161px;
	bottom: 12px;
}

.container {
}

}

/* 以下ボタンスタイル */
button {
  background: none;
  border: none;
  cursor: pointer;
	padding: 0;
}
.btn_store{
	text-align: left;
	margin: 0 9px 0 0;
}
.btn_store img{
	width: 286px!important;
}
.btn_store:nth-child(3){
	margin-right: 0;
}

#openModal {
 
}

.container.cast {
    padding-top:81px;
}

.tweet_btn {
    display:none;
}


.outline {
    text-align: left;
/*	background: #fffada url("../img/bg_outline.gif") repeat left top;*/
	background-position: left top;
	border-radius: 16px;
	position: relative;
	max-width: 880px;
	margin: 0 auto;
}

.outline h4 {
    color: #ac2426;
    font-size: 16px;
    margin: 20px 0 8px;
    font-weight: bold;
}

.sectionbox {
	padding: 32px 0 60px;
}

.sectionbox_mid {
	padding: 32px 0 50px;
}

.sectionbox_bottom {
	padding: 32px 0 41px;
}

	.number{
		float: left;
    margin-bottom: 3px;
    width: calc(100% / 9);
	}

.menu {
    margin: 0 auto;
    padding-top:35px;
    max-width: 1100px;
    text-align: center;
}

.menu {
    margin: 0 auto;
    max-width: 1100px;
    text-align: center;
}

.menu__body {
    margin: 0 auto;
    max-width: 900px;
}

.menu_ttl {
    text-align: left;
    padding-bottom: 10px;
}

.menu_pc li {
    margin-bottom:5px;    
}

.menu_sp {
    display: none;    
}

.btn_area{
	display: flex;
    justify-content: flex-start;
	margin: 18px 0 22px;
	font-family: 'Noto Sans JP', sans-serif,Arial,'ＭＳ Ｐゴシック','MS P Gothic','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif,Helvetica;
	font-weight: 500;
	flex-wrap: wrap;
}



.btn_comic {
    width: 160px;
	background-color: #f5a418;
	text-align: center;
	margin: 22px 0 13px 27px;
}
.btn_comic:hover {
    opacity: 0.9 ;
    color: #fff;
    cursor: pointer;
}

.btn_comic a:link {
    color: #fff;
}

.btn_comic a:visited {
    color: #fff;
}
.btn_comic span {
    display: none;
}

.btn_comic ul li {
    list-style-type: none;
}

.btn{
	display: block;
	margin: 0 auto;
	background-size: 100%;
	padding: 15px 0px;
	color: #fff!important;
	font-size: 16px;
}

.twitter {
    flex-basis: 400px;
    box-sizing: border-box;
}
.twitter_sp {
    display: none;
}

h2 {
/*	margin: 0px auto 25px;*/
    text-align: center;
}

/*----------------------------------------------------------
contents_intro
----------------------------------------------------------*/

#intro{
	display: block;
	background-image: url(../img/bg_intro.jpg);
	background-size: cover;
	background-position: center;
	padding: 43px 0 64px 0;
}

.contents_intro{
	margin: 0 auto;
    max-width: 1000px;
}

.flex-box_intro{
	display: flex;
	align-items: flex-start;
	margin-top: 45px;
	position: relative;
}

.contents_intro p{
	text-align: center;
	font-size: 24px;
	font-weight: bold;
}

.txt_intro{
	text-align: center;
	margin: 30px 0 26px 0;
}
.box_intro{
	background-color: #feedd3;
	padding: 40px;
}
.box_intro h4{
	margin-bottom: 17px;
}
p.txt_intro{
	margin-top: 17px;
	margin-bottom: 18px;
}
.line_intro{
	background-color: #f6cb8a;
	height: 2px;
}

.img_intro img{
	position: absolute;
    bottom: -110px;
    right: -13px;
}

	

	@media all and (max-width:768px) {
	h2 {
		margin: 0px auto 2.15vw;
		text-align: center;
	}
	
	#intro{
		padding: 8vw 0 7.66vw 0;
}
	#intro h2 img{
		max-width: 584px;
		width: 78vw;
}

.contents_intro{
	margin: 0 auto;
    width: 100vw;
}
	.btn_intro img{
		width: 65vw;
	}

.flex-box_intro{
	display: flex;
	align-items: flex-start;
	margin-top: 3.46vw;
	position: relative;
	justify-content: center;
}

.contents_intro p{
	text-align: center;
	font-size: 20px;
	font-weight: bold;
     line-height: 1.5em; 
}
.txt_intro img {
	max-width: 665px;
	width: 88vw;
}

.txt_intro{
	text-align: center;
	margin: 0;
}
.box_intro{
	background-color: #feedd3;
	padding: 7.14vw 10.71vw;
	text-align: center;
}
.box_intro h4{
	margin-bottom: 1.38vw;
}
.box_intro h4 img{
	width: 65vw;
}
p.txt_intro{
	margin-top: 1.38vw;
	margin-bottom: 1.41vw;
}
p.txt_intro img{
	width: 65vw;
}
.line_intro{
	background-color: #f6cb8a;
	height: 2px;
}

.img_intro img{
	position: absolute;
    bottom: -8.46vw;
	right: -3vw;
	width: 41.9vw;
}
	
}
/*----------------------------------------------------------
interview
----------------------------------------------------------*/

#interview{
	position: static;
}
.interview_header{
	display: block;
	background-image: url("../img/bg_header_interview.png");
	background-size: 65%;
	background-position: center;
	padding: 24px 0 0px;
	height: 615px;
}
.interview_header_img_01 img{
	margin: -52px 0 0px 1px;
	max-width: 1150px;
}
h2.interview_header_img_02{
	text-align: center!important;
	
}

.interview_header_img_02 img{
	margin: -24px 151px 0px 0;	
}
.interview_header_img_03 img{
	margin: -24px 0 0px 1px;
	max-width: 1150px;
}
@media all and (max-width:1300px) {/*1300~768pxの間で画像を右寄せになるよう設定*/
h2.interview_header_img_02{
	text-align: left!important;
	
}
.interview_header_img_02 img{
	margin: -24px 151px 0px 0;	
}
	
}
.interview_question{
/*
	background-image: url("../img/bg_contents_interview_illust.jpg");
	background-attachment: fixed;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
	background-color: #00aee8;
*/
	padding: 100px 0 100px;
	
}
	
	.interview_question::before {
		content:"";
		display:block;
		position:fixed;
		top:0;
		left:0;
		z-index:-1;
		width:100%;
		height:100vh;
		background-repeat:no-repeat;
		background-position: 50% -3%;
		background-image: url(../img/bg_contents_interview_illust.jpg);
		background-size:cover;
		background-color: #00aee8;
}
.interview_bg_area{
	width: calc(100% - 80px);
	background-image: url("../img/bg_contents_interview_line.png");
	background-position: top center;
	text-align: center;
	background-size: 80%;
	margin: 0 auto;
	border-radius: 45px;
	padding-bottom: 55px;
}
.interview_contents{
	width: 82%;
	max-width: 1000px;
	margin: 0 auto;
	padding-top: 222px;
}
.interview_dialogue{
	display: flex;
    text-align: left;
    align-items: center;
	margin-bottom: 18px;
}
.interview_question_ttl_01{
	margin: 0 20px 24px 0;
	position: relative;
}
.interview_question_ttl_01 img{
	position: absolute;
	top: 99%;
	left: 49%;
    transform: translate(-50%, -101%);
	
}
.interview_question_ttl_02{
	margin: 0 20px 24px 0;
	position: relative;
}
.interview_question_ttl_02 img{
	position: absolute;
	top: 100%;
    left: 50%;
    transform: translate(-46.5%, -106%);
	
}
.interview_question_ttl_03{
	margin: 0 20px 24px 0;
	position: relative;
}
.interview_question_ttl_03 img{
	position: absolute;
	top: 99%;
    left: 50%;
    transform: translate(-50%, -94%);
	
}
.interview_dialogue_icon{
	margin-right: 30px;
}
.interview_dialogue_text{
	background-color: #fff;
	padding: 18px 20px 15px;
	font-size: 20px;
	line-height: 1.7em;
	font-weight: bold;
	color: #00549f;
	border-radius: 20px;
	position: relative;
	width: 100%;
}

.interview_dialogue_text::after{
	content: '';
	background-image: url(../img/parts_dialogue.png);
    background-position: center;
    background-size: contain;
	background-repeat: no-repeat;
    padding: 18px 20px 20px;
    font-size: 19px;
    line-height: 1.7em;
    font-weight: bold;
    color: #00549f;
    border-radius: 20px;
    position: absolute;
	top: 20%;
    left: -26px;
}
.interview_dialogue_text span{
	background-color: #f9f802;
	
}

.interview_img{
	padding: 35px 0 45px 0;
	display: flex;
	justify-content: center;
}
.interview_img img{
	margin: 0 10px 0;
}
.box_cover_text_area{
	display: flex;
    justify-content: flex-start;
	padding-left: 8px;
}

 .contents_txt_comic,.box_corner_l .contents_txt_comic_info{
    max-width: 475px;
	margin: 0 0  0 33px;
	 color: #00549f;
}
.contents_txt_comic,.box_corner_r .contents_txt_comic_info{
    max-width: 1000px;
	margin: 0 48px 0 0;
}
.box_corner_r {
    padding: 75px;
    display: flex;
    justify-content: flex-start;
    max-width: 910px;
    margin: 0 auto;
    position: relative;
    flex-direction: row-reverse;
}
.box_corner_l{
    padding: 55px 62px 45px;
    max-width: 925px;
    margin: 55px auto 0;
	position: relative;
	background-image: url("../img/bg_work_introduction.png");
    background-position: center;
    background-size: auto;
}
.contents_txt_comic h4,.contents_txt_comic_info h4{
	font-size: 40px;
	margin: 0 0 3px 0;
	line-height: 1.22em;
	text-align: left;
}
.box_corner_r img,
.box_corner_l img{
	width: 363px;
}
p.txt_description_comic,p.txt_description_comic_info{
	margin: 25px 0 20px 0;
	font-size: 18px;
	text-align: left;
	line-height: 1.6em;
	font-weight: 600;
}


.contents_txt_comic_info h4 span{
	font-size: 25px;
}

.contents_txt_comic_info h4 span.sbttl {
	line-height: 1.5em;
	display: block;
}

.txt_comic_info{
	font-size: 20px;
	margin: 5px 0 0;
	padding-bottom: 9px;
	font-weight: bold;
	text-align: left;
	line-height: 1.4em;
	letter-spacing: 0.04em;
	border-bottom: 1px dotted #467295;
	width: 100%;

}

.link_zenpen{
	background-image: url("../img/bg_work_introduction.png")!important;
    background-position: center;
	background-color: transparent!important;
    background-size: auto;
	text-align: center;
	display: block;
	padding: 50px 0 53px;
	
	
}

.link_zenpen h2{
	padding: 0 0 30px;
}

@media all and (max-width:1299px) {
	.interview_header{
		height: 47.344vw;
	}
	
	.interview_header_img_01 img{
		margin: -4.04vw 0 0 0;
		width: 82%;
/*		max-width: 1042px;*/
	}
	h2.interview_header_img_02{
		text-align: right;

	}
	.interview_header_img_02 img{
		margin: -24px 0 0;
		width: 87%;
		max-width: 1150px;
	}
	
	.interview_header_img_03 img{
		margin: -24px 0 0px 1px;
		max-width: 1150px;
		width: 85%;
	}
	
	.interview_question::before {
		background-position: 50% -4%;
}
	.interview_question_ttl_01{
		margin: 0 20px 24px 0;
	}
	.interview_question_ttl_02{
		margin: 0 20px 24px 0;
	}
	
	.interview_question_ttl_03{
		margin: 0 20px 24px 0;
	}
	.interview_question_ttl_01 img{
		width: 80%;
		max-width: 748px;
		top: 110%;
		left: 50%;
		transform: translate(-50%, -110%);

	}
	.interview_question_ttl_02 img{
		width: 80%;
		max-width: 748px;
		top: 120%;
		left: 50%;
		transform: translate(-45%, -113%);

	}
	.interview_question_ttl_03 img{
		width: 80%;
		max-width: 748px;
		top: 112%;
		left: 50%;
		transform: translate(-50%, -112%);

	}
	
	.interview_img img {
		width: 95%;
		max-width: 443px;
		
	}
	
	 .contents_txt_comic,.box_corner_l .contents_txt_comic_info{
		max-width: 475px;
		width: 70%;
	}
	.box_corner_l {
	padding: 4.76vw;
	max-width: 71.15vw;
	margin: 3.76vw auto 0;
	background-image: url("../img/bg_work_introduction.png");
    background-position: center;
    background-size: auto;
	}
	.contents_txt_comic p {
    font-size: 1.84vw;
	margin-bottom: 3.38vw;
}
	.box_corner_l img {
		max-width: 363px ;
		width: 100%;
		
	}
	
	.btn_area {
		justify-content: space-around;
	}
	.btn_store{
		width: 32%;
	}
	.btn_store img {
		max-width: 286px ;
		width: 100%!important;
}

.contents_txt_comic,.contents_txt_comic_info{
    max-width: 35.7vw;
	margin: 0 0 0 2.57vw;
}
	.contents_txt_comic h4,.contents_txt_comic_info h4{
	font-size: 3.076vw;
	margin: 0 0 0.75vw 0;
	line-height: 1.2em;
}
	#comic{
	display: block;
	background-image: url("../img/bg_type_a.jpg");
	background-size: contain;
    background-repeat: repeat-y;
	background-position: center;
	padding: 128px 0 20px 0;
	position: relative;
	text-align: center;
	
}

.box_corner img{
	width: 28.46vw;
}
p.txt_info_comic{
	font-size: 1.846vw;
	text-align: left;
	margin: 1.846vw 0 0 0;
	line-height: 1.2em;
}
.txt_info_comic span{
	color: #d12d26;
}
p.txt_description_comic,p.txt_description_comic_info{
	margin: 1.92vw 0 2.30vw 0;
	font-size: 1.4vw;
	text-align: left;
	line-height: 1.6em;
	font-weight: 600;
}
p.txt_description_comic span{
	font-size: 0.923vw;
	text-align: left;
}

.contents_txt_comic_info h4 span{
	font-size: 1.9vw;
}

.txt_comic_info{
	font-size: 1.53vw;
	margin: 0.5vw 0  0;
	padding-bottom: 0.5vw;
	font-weight: bold;
	border-bottom: 1px dotted #467295;
}

.txt_comic_info span{
	font-size: 1vw;
}

.btn_website{
	margin: 0 0 1.15vw 0;
	text-align: center;
}
	
}

	@media all and (max-width:768px) {
	
	.interview_header{
		display: block;
		background-image: url("../img/bg_header_interview.png");
		background-position: center;
		background-size: 183%;
		padding: 0;
		height: 77.5vw;
	}
	
	h2.interview_header_img_01{
		text-align: left;
		

	}
	
	.interview_header_img_01 img{
		margin: 0;
		width: 100%;
	}
	.interview_header_img_01.h_ryo img {
        margin: 0px 0 -1px 0;
        width: 100%;
        max-width: 748px;
        margin-top: -33px;
    }
	.interview_header_img_02 img {
		margin: -5.4vw 0 0;
		width: 100%;
    }
	.interview_header_img_03 img{
		margin: -2px 0 0 0px;
		width: 100%;
	}
	
	.interview_bg_area {
		width: calc(100% - 8.45vw);
		background-image: url("../img/bg_contents_interview_line.png");
		background-position: top center;
		background-size: 185%;
		text-align: center;
		margin: 0 auto;
		border-radius: 4.58vw;
		padding-bottom: 14.26vw;
	}
	.interview_contents {
		width: 92%;
		margin: 0 auto;
		padding-top: 33.9vw;
	}
		
	.interview_question_ttl_01,.interview_question_ttl_02,.interview_question_ttl_03 {
		margin: 0 20px 61px 0;
    }
		
		
	.interview_question_ttl_01 img {
		width: 100%;
		max-width: 748px;
		top: 110%;
		left: 50%;
		transform: translate(-48%, -95%);
    }
	.interview_question_ttl_02 img {
		width: 100%;
		max-width: 748px;
		top: 120%;
		left: 50%;
		transform: translate(-47%, -97%);
    }
	.interview_question_ttl_03 img {
		width: 96%;
		max-width: 748px;
		top: 112%;
		left: 50%;
		transform: translate(-50%, -97%);
    }
		.interview_question {
		padding: 110px 0 37px;
		}
	
	.interview_question::before {
		content:"";
		display:block;
		position:fixed;
		top:0;
		left:0;
		z-index:-1;
		width:100%;
		height:100vh;
		background-repeat:no-repeat;
		background-position: 50% -13%;
		background-image: url(../img/bg_contents_interview_illust_sp.jpg);
		background-size:cover;
		background-color: #00aee8;
}
	.interview_dialogue_icon img{
		width: 100%;
		max-width: 80px;
			
		}
	.interview_dialogue {
		display: flex;
		text-align: left;
		align-items: flex-start;
		margin-bottom: 2.89vw;
}
	.interview_dialogue_text {
		padding: 2.41vw 4.83vw 3.62vw;
		font-size: 3.50vw;
		line-height: 1.7em;
		font-weight: bold;
		border-radius: 2.41vw;
		position: relative;
		width: 100%;
}
	.interview_dialogue_icon {
		margin-right: 4.14vw;
	}
	.interview_dialogue_text::after {
		content: '';
		background-image: url(../img/parts_dialogue.png);
		background-position: center;
		background-size: 50%;
		background-repeat: no-repeat;
		padding: 4.34vw 4.83vw 4.83vw;
		font-size: 19px;
		position: absolute;
		top: 7%;
		left: -5.55vw;
	}
	.interview_img {
		padding: 6.03vw 0 2.86vw 0;
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	.interview_img img {
        width: 100%;
        max-width: 630px;
		margin: 0 0 5.83vw 0;
			
}
	.box_cover_text_area {
		display: flex;
		justify-content: flex-start;
		 padding-left: 0; 
		flex-direction: column;
	}
		
	.box_corner_r img, .box_corner_l img {
		max-width: 490px;
		width: 65vw
}
		
	.box_corner_l {
		padding: 7.76vw 5.76vw  12.76vw;
		max-width: 80vw;
		margin: 7.76vw auto 0;
		flex-direction: column;
		align-items: center;
	}
	.box_corner_l .contents_txt_comic_info{
    	width: 90%;
		margin: 0 auto 0;
}
	.contents_txt_comic h4,.contents_txt_comic_info h4{
		font-size: 6.66vw;
		margin: 6.55vw 0 0.55vw 0;
		line-height: 1.15em;
		text-align: left;
}
	
	.contents_txt_comic_info h4 span{
		font-size: 4.83vw;
	}
	.contents_txt_comic_info h4 span.sbttl {
		font-size: 4.83vw;
		line-height: 1.3em;
		display: block;
		}
	.txt_comic_info{
		font-size: 3.26vw;
		margin: 0 0 0.8vw;
		font-weight: bold;
		line-height: 1.6em;
		padding-bottom: 1.5vw;
}
		
	p.txt_description_comic,p.txt_description_comic_info{
		margin: 4.92vw 0 4.3vw 0;
		font-size: 3.46vw;
		text-align: left;
		line-height: 1.5em;
		font-weight: 600;
}
	.btn_area{
		align-items: center;
		margin: 0;
	}
	.btn_store {
        width: 90%;
		margin: 0 auto 2.06vw;
		text-align: center;
    }
	.btn_store:nth-child(3) {
		margin: 0 auto 0;
	}
	

	.link_zenpen{
		background-image: url("../img/bg_work_introduction.png")!important;
		background-position: center;
		background-color: transparent!important;
		background-size: auto;
		text-align: center;
		display: block;
		padding: 50px 0 53px;


	}
		
	.link_zenpen img{
		max-width: 602px;
		width: 85%;


	}

	.link_zenpen h2 img{
		max-width: 455px;
		width: 63%;
	}
	.link_zenpen h2 {
		padding: 0 0 20px;
	}
	
}

@media all and (max-width:414px) {
	
	.interview_question::before {
		background-position: 50% 10vw;
}
	
	.interview_header{
		display: block;
		background-image: url("../img/bg_header_interview.png");
		background-position: center;
		background-size: 183%;
		padding: 0;
		height: 76.344vw;
	}
	
	h2.interview_header_img_01{
		text-align: left;

	}
	
	
	.interview_header_img_01 img{
		margin: -5px 0 0 0px;
		width: 100%;
		max-width: 748px;
	}
	.interview_header_img_01.h_ryo img {
        margin: 0px 0 -1px 0;
        width: 100%;
        max-width: 748px;
        margin-top: -33px;
    }
	.interview_header_img_02 img {
		margin: -6.7vw 0 -1px;
        width: 100%;
        max-width: 715px;
    }
	.interview_header_img_03 img{
		margin: -5px 0 0 0px;
		width: 100%;
		max-width: 748px;
	}
	
	.interview_bg_area {
		width: calc(100% - 8.45vw);
		background-image: url("../img/bg_contents_interview_line.png");
		background-position: top center;
		background-size: 185%;
		text-align: center;
		margin: 0 auto;
		border-radius: 4.58vw;
		padding-bottom: 14.26vw;
	}
	.interview_contents {
		width: 92%;
		margin: 0 auto;
		padding-top: 33.9vw;
	}
	.interview_question_ttl_01, .interview_question_ttl_02, .interview_question_ttl_03 {
	margin: 0 20px 25px 0;
    }
		
	.interview_question_ttl_01 img {
		width: 113%;
		max-width: 748px;
		top: 110%;
		left: 50%;
		transform: translate(-48%, -95%);
    }
	.interview_question_ttl_02 img {
		width: 101%;
		max-width: 748px;
		top: 120%;
		left: 50%;
		transform: translate(-47%, -97%);
    }
	.interview_question_ttl_03 img {
		width: 97%;
		max-width: 748px;
		top: 112%;
		left: 50%;
		transform: translate(-50%, -97%);
    }
		.interview_question {
		padding: 50px 0 37px;
		}
	
	.interview_question::before {
		content:"";
		display:block;
		position:fixed;
		top:0;
		left:0;
		z-index:-1;
		width:100%;
		height:100vh;
		background-repeat:no-repeat;
		background-position: 50% -13%;
		background-image: url(../img/bg_contents_interview_illust_sp.jpg);
		background-size:cover;
		background-color: #00aee8;
}
	.interview_dialogue_icon img{
		width: 100%;
		max-width: 80px;
			
		}
	.interview_dialogue {
		display: flex;
		text-align: left;
		align-items: flex-start;
		margin-bottom: 2.89vw;
}
	.interview_dialogue_text {
		padding: 2.41vw 4.83vw 3.62vw;
		font-size: 3.50vw;
		line-height: 1.7em;
		font-weight: bold;
		border-radius: 2.41vw;
		position: relative;
		width: 100%;
}
	.interview_dialogue_icon {
		margin-right: 4.14vw;
	}
	.interview_dialogue_text::after {
		content: '';
		background-image: url(../img/parts_dialogue.png);
		background-position: center;
		background-size: 50%;
		background-repeat: no-repeat;
		padding: 4.34vw 4.83vw 4.83vw;
		font-size: 19px;
		position: absolute;
		top: 7%;
		left: -5.55vw;
	}
	.interview_img {
		padding: 6.03vw 0 2.86vw 0;
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	.interview_img img {
        width: 100%;
        max-width: 630px;
		margin: 0 0 5.83vw 0;
			
}
	.box_cover_text_area {
		display: flex;
		justify-content: flex-start;
		 padding-left: 0; 
		flex-direction: column;
	}
		
	.box_corner_r img, .box_corner_l img {
		max-width: 490px;
		width: 65vw
}
		
	.box_corner_l {
		padding: 7.76vw 5.76vw  12.76vw;
		max-width: 80vw;
		margin: 7.76vw auto 0;
		flex-direction: column;
		align-items: center;
	}
	.box_corner_l .contents_txt_comic_info{
    	width: 92%;
		margin: 0 auto 0;
}
	.contents_txt_comic h4,.contents_txt_comic_info h4{
		font-size: 6.46vw;
		margin: 6.55vw 0 0.55vw 0;
		line-height: 1.15em;
		text-align: left;
}
	
	.contents_txt_comic_info h4 span{
		font-size: 4.83vw;
	}
	.txt_comic_info{
		font-size: 3.26vw;
		margin: 0 0 0.8vw;
		font-weight: bold;
		line-height: 1.6em;
		padding-bottom: 1.5vw;
}
	p.txt_description_comic,p.txt_description_comic_info{
		margin: 4.92vw 0 4.3vw 0;
		font-size: 3.46vw;
		text-align: left;
		line-height: 1.5em;
		font-weight: 600;
}
	.btn_area{
		align-items: center;
		margin: 0;
	}
	.btn_store {
        width: 90%;
		margin: 0 auto 2.06vw;
		text-align: center;
    }
	.btn_store:nth-child(3) {
		margin: 0 auto 0;
	}
	

	.link_zenpen{
		background-image: url("../img/bg_work_introduction.png")!important;
		background-position: center;
		background-color: transparent!important;
		background-size: auto;
		text-align: center;
		display: block;
		padding: 50px 0 53px;


	}
		
	.link_zenpen img{
		max-width: 602px;
		width: 85%;


	}

	.link_zenpen h2 img{
		max-width: 455px;
		width: 63%;
	}
	.link_zenpen h2 {
		padding: 0 0 20px;
	}
}

/*----------------------------------------------------------
diagnosis
----------------------------------------------------------*/

#diagnosis{
	display: block;
	background-image: url("../img/bg_diagnosis.gif");
	background-position: center;
	padding: 95px 0 128px 0;
}
.img_chart{
	text-align: center;
	margin: 37px 0 12px 0;
}
.list_result_type{
	text-align: center;
    margin: 0 auto;
    width: 995px;
}
.list_result_type ul{
	display: flex;
    list-style: none;
    justify-content: space-between;
}

.diagnosis h3{
	text-align: center;
	margin-bottom: 45px
	
}

.diagnosis h3 img{
	width: 305px;
}


.diagnosis{
	display: block;
	background-image: url(../img/bg_present.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 45px 0 35px;
	margin: 50px auto 0;
	max-width: 1000px;
}

.box_diagnosis {
    padding-top: 0;
    display: flex;
    justify-content: flex-start;
    max-width: 870px;
    margin: 0 auto;
	position: relative;
}


.diagnosis .box_diagnosis p {
	margin: 0 45px 10px 0px;
	font-size: 20px;
	line-height: 1.5em;
	font-weight: bold;
}


.diagnosis .box_diagnosis p span {
	font-size: 14px;
}

.content_guideline_diagnosis{
	margin: 50px auto 0;
	max-width: 1000px;
	
}
	.btn_oogiri_intro{
		text-align: center;
		margin: 0 auto;
	}

.btn_diagnosis{
	margin-top: 20px;
	text-align: center;
}

	.txt_diagnosis_period {
    text-align: center;
   margin-bottom: 35px;
}
/*
.txt_diagnosis_period img {
    width: 70vw;
}
*/


	@media all and (max-width:768px) {
	#diagnosis{
	padding: 10.86vw 0 15.45vw 0;
}
	#diagnosis h2 img {
        max-width: 688px;
		width: 92vw;
    }
	.list_result_type{
		text-align: center;
		margin: 0 auto;
		width: 90vw;
	}
	.list_result_type img{
		width: 21vw;
	}
	.img_chart {
		text-align: center;
		margin: 0.72vw 0 1.20vw 0;
	}
		
	.img_chart img{
		width: 92vw;
	}
	.txt_diagnosis_period{
		margin-bottom: 3.76vw;
	}
	.bn_diagnosis img{
	text-align: center;
	width: 90vw;
}
	.rabel_type {
    position: absolute;
    text-align: center;
    width: 100%;
    top: -29px;
}
	.rabel_type img {
        max-width: 135px;
		width: 18vw;
}
			
.diagnosis h3{
	text-align: center;
	margin-bottom: 3.46vw
	
}

.diagnosis h3 img{
	width: 48.46vw;
	}
	.txt_memopad img{
		width: 75vw;
		margin-left: 6px;
;
	}
	
	
	.diagnosis {
	display: block;
	background-image: url(../img/bg_present.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 9.2vw 6.53vw 13.38vw;
	margin: 6.84vw auto 0;
	max-width: 75vw;
	}
	.box_diagnosis {
    padding-top: 0;
    display: flex;
    justify-content: flex-start;
    max-width: 75vw;
    margin: 0 auto;
	position: relative;
	flex-direction: column;
		
	}

	.diagnosis .box_diagnosis p {
		margin: 3.53vw 0 0 0;
		font-size: 16px;
		line-height: 1.5em;
		text-align: center;
	}

	.diagnosis .box_diagnosis p span {
		font-size: 12px;
	}

	.content_guideline_diagnosis{
		margin: 50px auto 0;
		max-width: 1000px;

	}
	
	.badge_diagnosis{
		position: absolute;
		top: -4.28vw;
		right: -22.38vw;
	}
	
	.img_diagnosis .badge_diagnosis{
		width: 18vw;
	}
	.img_diagnosis{
		width: 56vw;
		margin: 3.15vw 0 0;
		position: relative;

	}
	.img_diagnosis img{
		width: 75vw;

	}
	.diagnosis .box_diagnosis p img {
    width: 70vw;
}
	.btn_diagnosis img {
    width: 70vw;
}
}
/*----------------------------------------------------------
announcement
----------------------------------------------------------*/
#announcement img{
	width: 100%;
	margin-bottom: -1px;
}


/*----------------------------------------------------------
contents_comic
----------------------------------------------------------*/

#comic{
	display: block;
	background-image: url("../img/bg_type_a_l.jpg");
	background-size: contain;
    background-repeat: repeat-y;
	background-position: center;
	padding: 128px 0 20px 0;
	position: relative;
	text-align: center;
	
}


.rabel_type{
	position: absolute;
    text-align: center;
    width: 100%;
    top: -29px;
	
}

.rabel_type_b{
	position: absolute;
    text-align: center;
    right: 44.9%;
    top: -29px;
	
}


h2 {
/*    margin: 0px auto 25px;*/
    text-align: center;
}
#comic h2{

    margin: 0 0 27px 51px;
	
}
.contents_txt_comic p {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
     line-height: 1.5em; 
	margin-bottom: 44px;
}

p.txt_info_comic{
	font-size: 24px;
	text-align: left;
	margin: 24px 0 0 0;
	line-height: 1.2em;
}
.txt_info_comic span{
	color: #d12d26;
}
p.txt_description_comic span{
	font-size: 12px;
	text-align: left;
}


.txt_comic_info span{
	font-size: 13px;
}

.btn_website{
	margin: 0 0 15px 0;
	text-align: center;
}
	.indention_pc{
		display: block;
	}


	

@media all and (max-width:768px) {
	#comic {
    display: block;
    background-image: url("../img/bg_type_a_sp.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 0 0 10.14vw 0;
}

	.contents_txt_comic p {
    font-size: 1.84vw;
	margin-bottom: 3.38vw;
}
	.indention_pc{
		display: inline;
	}
	
.box_corner_r .contents_txt_comic_info {
    max-width: 1000px;
    margin: 0 0 0 0;
}
	.img_type img{
		width: 92vw;
	}

.box_corner img{
	width: 70vw;
}
p.txt_info_comic{
	font-size: 18px;
	margin: 3.15vw 0 3.55vw 0;
	line-height: 1.2em;
		text-align: center;
}
.txt_info_comic span{
	color: #d12d26;
}
p.txt_description_comic span{
	font-size: 12px;
	text-align: left;
}


.txt_comic_info span{
	font-size: 12px;
}

.btn_website{
	margin: 0 0 1.15vw 0;
	text-align: center;
}

}

/*----------------------------------------------------------
contents_comic
----------------------------------------------------------*/
#comic_info{
	display: block;
	background-image: url("../img/bg_info_comic.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 0 0 99px 0;
	
}

#novel_info{
	display: block;
	background-image: url("../img/bg_info_novel.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 0 0 99px 0;
	
}

/*----------------------------------------------------------
----------------------------------------------------------*/

.comic {
    flex-basis: 640px;
}

.item_box {
    display: flex;    
}

.item_img_wrap {
    margin-right: 15px;    
}

.item_img_wrap img {
    width:145px;    
}

.item_box {
    padding: 20px 0;
}

.title_sp {
    display: none;
}


.youtube {
    margin-bottom: 30px;    
}

.staff_sp{
	display: none;
}

/*おすすめ商品リスト ここから*/
.list_recommend {
    overflow: hidden;
    max-width: 750px;
	width: 97%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    font-size: 14px;
	list-style: none;
}


.list_recommend p {
    line-height: 150%!important;
}
.recommend_book_l {
    float: left;
    margin-bottom: 5px;
  width: calc(100% / 4);
}

.sp{
	display: none;
}
.pc{
	display: block;
}

.footer {
    margin: 0 auto;
    margin-top: 0;
    padding: 19px 0 14px 0;
    
    color: #fff;
    background-color: #0bbebe;
}

.footer__body {
    padding:0 20px;
    display: flex;
	max-width:1000px;
    text-align:center;
	margin: 0 auto;
    justify-content: space-between;
}

.footer_menu  {
    display: inline-block;
    margin-bottom: 5px;
    font-size: 12px;
}
.footer_menu li {
    float:left;
    list-style-type: none;
    vertical-align:top;
}
.footer_menu li img {
    margin-top:-5px;
    margin-right:10px;
}
.copyright {
    clear: both;
    font-size:13px;
    color:#fff;
}
/*------------------------------------------------------------------------------
その他コンテンツ　スマートフォン用の記述
 -------------------------------------------------------------------------------*/
@media all and (max-width:768px) {
    body {
        background-image: none;
    }
    
    .header {
        border-bottom: none;
        background-color: #0bbebe;
       height: 10vw;
    }
    
    .header__wrap {
        height: 100%;
		max-width: 100%;
		background: url("../img/header_dottedline_sp.png") no-repeat center bottom;
    }
    
    .header_news {
        width: 100%;
        height:100%;
    }
    
    .header__news_wrap img {
        width: 100%;
        height:100%;
        vertical-align: bottom;
        line-height: 1.0em;
    }

    .header__nav {
        display: none;    
    }
    
    .header__navsp {
        display: block;
    }
    
    .header__navsp .menubar{
        background-color: transparent;
        width: 100%;
        height: 66px;
        top: 0;
        left:0;
        position: fixed;
        z-index: 99;
    }

    .menu_botan{
        width: 35px;
        height: 29px;
        position: relative;
        float: right;
        margin-top: 15px;
        margin-right: 3%;
    }
    .menu_botan span{
        width: 35px;
        height: 4px;
        border-radius: 3px;
        position: absolute;
        background-color: #f7c978;
        transition: all 0.5s ease-out;
    }
    .menu_botan span:first-child{
        top: 0;
    }
    .menu_botan span:nth-child(2){
        top: 45%;
	}
    .menu_botan span:last-child{
        bottom: 0;
    }
	.header_ttl_sp{
		display: block;
        position: relative;
        float: left;
		padding: 2px 0 0 3.24%;
        z-index: 9;
    }
	.header_ttl_sp img{
		width: 22.2vw;
    }
    
    .act_menu{
        background-color: #5d1d0d;
        position: fixed;
        width: 100%;
        transition: all 0.4s ease-out;
        top: -435px;
        left:0;
        z-index: 10;
    }
    .act_menu.active{
        top: 0;
        left:0;
        width:100%;
        background-color:#5d1d0d;
    }
    .act_menu.active ul{
        margin: 60px 0 30px;
    }
    .menubar.active span:first-child{
        top: 10px;
        transform: rotate(405deg);
    }
    .menubar.active span:nth-child(2){
        opacity: 0;
    }
    .menubar.active span:last-child{
        top: 10px;
        transform: rotate(-405deg);
    }
    .act_menu li{
        list-style: none;
    }
    .act_menu li a{
        display: block;
        padding: 13px 0;
        color: #f7c978;
        text-decoration: none;
        text-align: center;	
        font-size: 17px;
    }
    
    #mv {
        padding-top: 10vw;
        width: 100%;
        height: auto;
    }
    #mv .mv__body {
        width: 100%;
		box-shadow: none;
	}
	
    #mv .badge {
        display: none;
    }
    .concept {
        width: 100%;    
    }
    
    #mv .banner {
        position: relative;
        margin: 10px 0;
        top:0;
        right:0;
    }

    #mv .banner img {
        width: 80%;
    }
	
	/* 以下ボタンスタイル */
	button {
	  background: none;
	  border: none;
	  cursor: pointer;
		padding: 0;
	}

	#openModal {

	}

	
	.container{
		background: none;
	}
	.information__body {
		background-color: #fff;
		width: 86.5%;
	}
	.information__body__gray {
		box-sizing: border-box;
		width: 86.5%;
		margin: 0 auto;
		margin-top: 10px;
		max-width: 1150px;
	}
	
	h2 {
	margin: 0;
	}
	h2 img {
    width: 100%;
	}
	
    .container {
        width: 100%;
		box-shadow: none;
    }
    .concept__body {
        width: 100%;
    }
    .tweet_btn {
        margin:0 auto;
        padding: 10px 0 15px 0;
        display: inline-block;
        text-align: center;
        width: 100%;
    }
	
	
	.btn_website {
/*		width: 84%;*/
		margin: 2vw auto 1.733vw;
	}
	
	.btn_comic {
		width: 84%;
		margin: 0px auto 1.733vw;
	}
	
	.btn {
		display: block;
		padding: 3.25vw 0px;
		font-size: 2.75vw;
	}
	
	.badge {
		position: absolute;
		right: 8.066vw;
		top: -2.64vw;
		width: 25.1%!important;
	}
	
    .information {
       margin: 0 auto;
    }
    .title_pc {
        display: none;
    }

    .title_sp {
        display: block;
        padding:10px;
        margin: 8px 20px 10px 20px;
        border-top:1px solid #ddd;
        border-bottom:1px solid #ddd;
        background-color:#eee;
        color:#333;
        font-size:14px;
    }
    .title_sp h2 {
        line-height: 150%;    
    }
    .title_sp p {
        margin: 5px 0;
        font-size: 12px;
        font-weight: bold;
        line-height: 150%;
    }
    
    .twitter {
        display: none;    
    }
	
	.twitter_sp {
		display: block;
		box-sizing: border-box;
		margin: 7.2% 0 10.08%;
	}
	.contents_box {
    padding-top: 0;
    display: flex;
    justify-content: flex-start;
    max-width: 900px;
    margin:0 auto;
    flex-wrap: wrap;
}
    
    .footer {
        text-align:center;
        padding: 0;
		max-width:100%;
        padding-top: 20px;
   		 padding-bottom: 0px;
    }
        
    .footer__body {
        display:block;
        height: 50px;
        padding:0;
    }

    .copyright {
        font-size:11px;
        color:#fff;
        background-color: #121212;
        padding: 30px 0 30px 0;
    }
    
    .footer_menu li img {
        margin:0;
        padding-bottom:0px;
    }
    .container_news {
        width: 100%;
    }
    
    .footer_menu li {
        float:none;
    }
    
    .logo {
        display:none;
    }
	
	.contents_box {
    padding-top: 0;
    display: flex;
    justify-content: flex-start;
    max-width: 900px;
    margin:0 auto;
    flex-wrap: wrap;
}
	#btn_pagetop {
		display: none;
	}
	.sp{
		display: block;
	}
	.pc{
		display: none;
	}
    .footer {
        text-align:center;
        padding: 0;
		max-width:100%;
        padding-top: 20px;
   		 padding-bottom: 0px;
    }
        
    .footer__body {
        display:block;
        height: 50px;
        padding:0;
    }

    .copyright {
        font-size:11px;
        color:#fff;
        background-color: #121212;
        padding: 30px 0 30px 0;
    }
    
    .footer_menu li img {
        margin:0;
        padding-bottom:0px;
    }
    .container_news {
        width: 100%;
    }
    
    .footer_menu li {
        float:none;
    }
}