/*-----------------------------------------------
 title
-----------------------------------------------*/
#title{
	position: relative;
	z-index: 10;
	height: 274px;
	margin-bottom: 48px;
	background:rgba(170,209,255,0.8);
}
#title .inner{
	position: relative;
	width: 1200px;
	margin: 0 auto;
}
#title .inner h1{
	overflow: hidden;
	text-align: center;
}
@media only screen and (max-width: 640px) {
	#title{
		height: auto;
		margin-bottom: 7.031vw;
		background: none;
	}
	#title .inner{
		width: auto;
	}
	#title .inner h1{
		position: static;
		background: none;
		padding-top: 0;
	}
	#title .inner h1 img{
		width: 100%;
	}
}
/*-----------------------------------------------
 content
-----------------------------------------------*/
#content{
	width: 1200px;
	margin: 0 auto;
}
#content h2 {
	font-size: 36px;
	line-height: 1.5;
}
#content p {
	font-size: 22px;
	font-weight: 400;
}
#content .read {
    width: 900px;
    margin: 0 auto 13px;
    font-size: 18px;
    line-height: 1.44;
}
@media only screen and (max-width: 640px) {
	#content{
		width: 94%;
		padding: 0;
	}
	#content h2{
		height: auto;
		background: none;
	}
	#content img {
		width: 100%;
	}
	#content .read {
    width: auto;
    margin: 0 0 5.469vw;
    font-size: 3.438vw;
    line-height: 1.27;
}
}


/*-----------------------------------------------
 .comment
-----------------------------------------------*/
.comment {
  width: 1000px;
  margin: 0 auto; }

/*-----------------------------------------------
 .tab-list
-----------------------------------------------*/
.tab-list ul {
  display: flex; }
  .tab-list ul li {
    width: 495px;
    height: 86px;
    text-indent: -9999px;
    cursor: pointer; }
    .tab-list ul li:first-child {
      background: url("../img/comment/tab_25th_02-pc.png") no-repeat bottom center; 
			margin-right: 10px;
			}
    .tab-list ul li:nth-child(2) {
      background: url("../img/comment/tab_conclusion_02-pc.png") no-repeat bottom center; }
		.tab-list ul li.active {
			position:relative;
		}
		.tab-list ul li.active::before {
			content:"";
			position:absolute;
			background:url(../img/comment/tab_active_icon.png) no-repeat;
			width:32px;
			height:24px;
			display:block;
			top: 39px;
			left: -11px;
		}
    .tab-list ul li:first-child.active {
      background: url("../img/comment/tab_25th_01-pc.png") no-repeat bottom center;
			margin-right: 10px;
      transition: all 0.2s ease-out;}
    .tab-list ul li:nth-child(2).active {
      background: url("../img/comment/tab_conclusion_01-pc.png") no-repeat bottom center;
      transition: all 0.2s ease-out;}

/*-----------------------------------------------
 .comment-area
-----------------------------------------------*/
.comment-area {
  display: none;
  width: 992px;
  margin: 0 auto 80px; }

.comment-area.show {
  display: block; }

.comment-25th {
	background-image: url(../img/comment/dot_comment.png),url(../img/comment/dot_comment.png);
	background-position:top left,right bottom;
	background-repeat: no-repeat,no-repeat;
	background-size: 8px 8px,8px 8px;
	background-color:#f7f4e8;
  display: none;
  width: 1000px;
  margin: 0 auto 47px;
	padding: 55px 50px 0;
	border:solid 2px #d0a81d;
	position:relative;
	box-sizing:border-box;
}
.comment-25th::after {
	content: '';
	width: calc(100% - 18px);
	height: calc(100% - 18px);
	position: absolute;
	top: 8px;
	left: 8px;
	border:solid 1px #d0a81d;
}
.comment-25th .box {
	background:#fff;
	border:solid 1px #d0a81d;
	padding: 0 20px 44px;
	position: relative;
	margin-bottom: 49px;
}
#content .comment-25th .illustrator_comment {
	padding-bottom:30px;
}
#content .comment-25th p.illust{
	margin: 20px auto 30px;
	padding: 0;
	line-height: 1em;
	text-align: center;
}
#content .comment-25th p.illust img{
	border: 4px solid #f4e7bd;
	box-sizing: border-box;
}
#content .comment-25th .box .num {
	margin: -22px 0 9px 2px;
}
#content .comment-25th .illustrator_comment .num {
	margin-bottom:15px;
	bottom: 40px;
}
#content .comment-25th .box .text {
	font-size:20px;
	line-height:1.5;
	font-family: YuMincho,'Yu Mincho', serif;
}
#content .comment-25th .author_comment .text,
#content .comment-25th .illustrator_comment .text{
	font-size:24px;
}
#content .comment-25th .box .name {
	text-align:right;
	margin:6px 0;
}
#content .comment-25th .box .name p {
	background:url(../img/comment/dot_name.png) no-repeat center left,#d0a81d;
	font-family: YuMincho,'Yu Mincho', serif;
	color:#fff;
	font-size:24px;
	display:inline-block;
	padding:0 11px 0 22px;
	line-height:34px;
}
#content .comment-25th .illustrator_comment .name p {
	padding-right:20px;
}
#content .comment-25th .box .name span {
	font-size:18px;
}
.comment-25th .author_illust {
	position:absolute;
	bottom:0;
	left:50%;
	transform:translateX(-31%);
}
.comment-25th .author_illust img {
	vertical-align: bottom;
}
.comment-25th .inner p {
	color: #000;
	line-height: 1.9;
}
.comment-25th .sign{
	text-align: right;
}
.comment-25th .sign img{
	width: 110px;
}
.comment-25th .author_comment .text,
.comment-25th .illustrator_comment .text,
.comment-conclusion .mb10{
	margin-bottom: 10px;
}
.comment-conclusion {
  background-image: url(../img/comment/dot_comment2.png),url(../img/comment/dot_comment2.png);
	background-position: top left,right bottom;
	background-repeat: no-repeat,no-repeat;
	background-size: 8px 8px,8px 8px;
	background-color: #deeaff;
	display: none;
	width: 1000px;
	margin: 0 auto 47px;
	padding: 55px 50px 50px;
	border: solid 2px #92b9ff;
	position: relative;
	box-sizing: border-box;
	}
	.comment-list1 {
		margin-bottom:88px;
	}
	.comment-conclusion::after {
		content: '';
    width: calc(100% - 18px);
    height: calc(100% - 18px);
    position: absolute;
    top: 8px;
    left: 8px;
		border:solid 1px #92b9ff;
	}	
	.comment-conclusion .conclusion_catch {
		text-align:center;
	}
	.comment-conclusion li {
		background:#fff;
		border-style:solid;
		border-width:1px;
		padding: 0 20px 35px;
		position: relative;
		margin:34px 0 40px;
	}
	.comment-list1 li:nth-child(1),
	.comment-list1 li:nth-child(9),
	.comment-list1 li:nth-child(17){
		border-color:#92b9ff;
	}
	.comment-list1 li:nth-child(2),
	.comment-list1 li:nth-child(10),
	.comment-list1 li:nth-child(18) {
		border-color:#55e29b;
	}
	.comment-list1 li:nth-child(3),
	.comment-list1 li:nth-child(11),
	.comment-list1 li:nth-child(19) {
		border-color:#f09add;
	}
	.comment-list1 li:nth-child(4),
	.comment-list1 li:nth-child(12),
	.comment-list1 li:nth-child(20) {
		border-color:#ff9f22;
	}
	.comment-list1 li:nth-child(5),
	.comment-list1 li:nth-child(13),
	.comment-list1 li:nth-child(21),
	.comment-list2 li:nth-child(1) {
		border-color:#52caf7;
	}
	.comment-list1 li:nth-child(5) .illust img{
		border: 4px solid #a4e6ff;
    box-sizing: border-box;
	}
	.comment-list1 li:nth-child(6),
	.comment-list1 li:nth-child(14),
	.comment-list2 li:nth-child(2) {
		border-color:#acacfd;
	}
	.comment-list1 li:nth-child(7),
	.comment-list1 li:nth-child(15),
	.comment-list2 li:nth-child(3) {
		border-color:#94d900;
	}
	.comment-list1 li:nth-child(15) .illust img{
		border: 4px solid #bfe965;
    box-sizing: border-box;
	}
	.comment-list1 li:nth-child(8),
	.comment-list1 li:nth-child(16),
	.comment-list2 li:nth-child(4) {
		border-color:#fb7c7c;
	}
	.comment-list2 li:nth-child(4) .illust img{
		border: 4px solid #f8b2b2;
    box-sizing: border-box;
	}
	.comment-list2 li:nth-child(1) {
		background:url(../img/comment/conclusion_bg_comment22.jpg) no-repeat bottom right,#fff;
	}
	.comment-list2 li:nth-child(2) {
		background:url(../img/comment/conclusion_bg_comment23.jpg) no-repeat bottom right,#fff;
	}
	.comment-conclusion li .illust {
		text-align:center;
		margin-top:25px;
	}
	.comment-conclusion li .num {
		margin: -22px 0 18px 2px;
	}
	#content .comment-conclusion .text {
		font-size:20px;
		line-height:1.5;
		font-family: YuMincho,'Yu Mincho', serif;
	}
	#content .comment-conclusion .bottom_right {
		text-align:right;
		font-family: YuMincho,'Yu Mincho', serif;
		overflow:hidden;
		margin: 16px 0 0;
	}
	#content .comment-conclusion .name {
		background-image:url(../img/comment/dot_name.png);
		background-repeat: no-repeat;
		background-position:center left;
		color:#fff;
		font-size:24px;
		display: table;
		float: right;
		padding:0 11px 0 22px;
		line-height:34px;
		margin-bottom: 5px;
	}
	.comment-list1 li:nth-child(1) .name,
	.comment-list1 li:nth-child(9) .name,
	.comment-list1 li:nth-child(17) .name {
		background-color:#92b9ff;
	}
	.comment-list1 li:nth-child(2) .name,
	.comment-list1 li:nth-child(10) .name,
	.comment-list1 li:nth-child(18) .name {
		background-color:#55e29b;
	}
	.comment-list1 li:nth-child(3) .name,
	.comment-list1 li:nth-child(11) .name,
	.comment-list1 li:nth-child(19) .name {
		background-color:#f09add;
	}
	.comment-list1 li:nth-child(4) .name,
	.comment-list1 li:nth-child(12) .name,
	.comment-list1 li:nth-child(20) .name {
		background-color:#ff9f22;
	}
	.comment-list1 li:nth-child(5) .name,
	.comment-list1 li:nth-child(13) .name,
	.comment-list1 li:nth-child(21) .name,
	.comment-list2 li:nth-child(1) .name {
		background-color:#52caf7;
	}
	.comment-list1 li:nth-child(6) .name,
	.comment-list1 li:nth-child(14) .name,
	.comment-list2 li:nth-child(2) .name {
		background-color:#acacfd;
	}
	.comment-list1 li:nth-child(7) .name,
	.comment-list1 li:nth-child(15) .name,
	.comment-list2 li:nth-child(3) .name {
		background-color:#94d900;
	}
	.comment-list1 li:nth-child(8) .name,
	.comment-list1 li:nth-child(16) .name,
	.comment-list2 li:nth-child(4) .name {
		background-color:#fb7c7c;
	}
	
	
	#content .comment-conclusion .detail {
		font-size:16px;
		background:#fff;
		display: table;
		float: right;
		clear: both;
	}
	.comment-list1 li:nth-child(1) .detail,
	.comment-list1 li:nth-child(9) .detail,
	.comment-list1 li:nth-child(17) .detail {
		color:#92b9ff;
	}
	.comment-list1 li:nth-child(2) .detail,
	.comment-list1 li:nth-child(10) .detail,
	.comment-list1 li:nth-child(18) .detail {
		color:#55e29b;
	}
	.comment-list1 li:nth-child(3) .detail,
	.comment-list1 li:nth-child(11) .detail,
	.comment-list1 li:nth-child(19) .detail {
		color:#f09add;
	}
	.comment-list1 li:nth-child(4) .detail,
	.comment-list1 li:nth-child(12) .detail,
	.comment-list1 li:nth-child(20) .detail {
		color:#ff9f22;
	}
	.comment-list1 li:nth-child(5) .detail,
	.comment-list1 li:nth-child(13) .detail,
	.comment-list1 li:nth-child(21) .detail,
	.comment-list2 li:nth-child(1) .detail {
		color:#52caf7;
	}
	.comment-list1 li:nth-child(6) .detail,
	.comment-list1 li:nth-child(14) .detail,
	.comment-list2 li:nth-child(2) .detail {
		color:#acacfd;
	}
	.comment-list1 li:nth-child(7) .detail,
	.comment-list1 li:nth-child(15) .detail,
	.comment-list2 li:nth-child(3) .detail {
		color:#94d900;
	}
	.comment-list1 li:nth-child(8) .detail,
	.comment-list1 li:nth-child(16) .detail,
	.comment-list2 li:nth-child(4) .detail {
		color:#fb7c7c;
	}
@media screen and (max-width: 640px) {
  /*-----------------------------------------------
   main
  -----------------------------------------------*/
  h2 {
    margin-bottom: 11.71875vw; }

  /*-----------------------------------------------
   comment
  -----------------------------------------------*/
  .comment {
    width: 100%; }
  /*-----------------------------------------------
   .tab-list
  -----------------------------------------------*/
  .tab-list ul li {
    width: 46.875vw;
    height: 8.125vw; }
    .tab-list ul li:first-child {
      background: url("../img/comment/tab_25th_02-sp.png") no-repeat;
      background-size: contain;
			margin-right:0.156vw;
      margin-top: 1.875vw; }
    .tab-list ul li:nth-child(2) {
      background: url("../img/comment/tab_conclusion_02-sp.png") no-repeat;
      background-size: contain;
      margin-top: 1.875vw; }
    .tab-list ul li:first-child.active {
      background: url("../img/comment/tab_25th_01-sp.png") no-repeat;
      background-size: cover;
      margin-top: 0; }
    .tab-list ul li:nth-child(2).active {
      background: url("../img/comment/tab_conclusion_01-sp.png") no-repeat;
      background-size: cover;
      margin-top: 0; }
		.tab-list ul li.active::before {
			background:url(../img/comment/tab_active_icon.png) no-repeat;
			background-size:contain;
			width:3.906vw;
			height:2.969vw;
			display:block;
			top: 2.969vw;
			left: -0.938vw;
		}

  /*-----------------------------------------------
   .comment-area
  -----------------------------------------------*/
  .comment-area {
    width: 100%;
    margin: -1.875vw auto 13.28125vw; }

  .comment-25th {
    padding: 0;
		margin-bottom:5.781vw;
		}
    .comment-25th .inner {
      background-size: contain;
      padding: 5.625vw 6.094vw 0; }
			#content .comment-25th .box {
				padding: 0 3.5vw 3vw;
				margin-bottom:6.406vw;
			}
			#content .comment-25th .box .text {
				font-size:3.125vw;
			}
			#content .comment-25th .box .num {
				margin: -2vw 0 1vw 0;
			}
			#content .comment-25th .illustrator_comment {
				margin-bottom:5.469vw;
			}
			#content .comment-25th .author_comment .num {
				width:70.938vw;
			}
			#content .comment-25th .illustrator_comment .num {
				width:73.906vw;
				margin-bottom:2.344vw;
			}
			#content .comment-25th .box .name {
				text-align:center;
				margin:2.969vw 0 0;
			}
			#content .comment-25th .box .name p {
				font-size:3.75vw;
				line-height: 2em;
			}
			#content .comment-25th .box .name span {
				font-size:2.813vw;
			}
			#content .comment-25th .illustrator_comment .name {
				margin-top:1.094vw;
			}
			#content .comment-25th .author_illust {
				width:15vw;
				height:12.5vw;
				left: 17.813vw;
			}
			#content .comment-25th .author_comment .text,
			#content .comment-25th .illustrator_comment .text{
				font-size:4vw;
			}
      #content .comment-25th .author_comment .text,
			#content .comment-25th .illustrator_comment .text,
			#content .comment-conclusion .mb10{
				margin-bottom: 2vw;
			}
			#content .comment-25th .sign{
				text-align: center;
			}
			#content .comment-25th .sign img{
				width: 30%;
			}
			#content .comment-25th p.illust{
				margin: 2vw 0 2vw;
			}
  .comment-conclusion {
    padding: 2.1875vw 0 0 0;
		margin-bottom:9.375vw;
		}
		.comment-conclusion .conclusion_catch.create,.comment-conclusion .conclusion_catch.anime {
			width:81.25vw;
			margin:3.75vw auto 0;
		}
		.comment-conclusion li{
			padding: 0 3.5vw 3vw;
			margin: 7vw 0 10vw;
		}
		#content .comment-conclusion li .text {
    font-size: 3.125vw;
}
		#content .comment-conclusion li .num {
				width:73.906vw;
				margin: -2vw 0 4vw 0;
			}
		#content .comment-conclusion .comment-list1 li:nth-child(1) .num {
				width:70.938vw;
			}
		#content .comment-conclusion .bottom_right {
			text-align:center;
		}
		#content .comment-conclusion .bottom_right .name {
			float:none;
			display:inline-block;
			font-size:3.75vw;
			line-height: 2em;
		}
		#content .comment-conclusion .bottom_right .detail {
			float:none;
			display:inline-block;
			font-size:2.5vw;
		}
    .comment-conclusion .comment-list1, .comment-conclusion .comment-list2 {
      margin: 0 auto 6.25vw; 
			padding: 0 6.094vw 0;}
		.comment-conclusion .comment-list1 {
			margin-bottom:10vw;
		}
    .comment-conclusion ul.comment-list1 li .text, .comment-conclusion ul.comment-list2 li .text {
        top: 12.8125vw;
        left: 4.21875vw;
        width: 74.0625vw;
        font-size: 3.03125vw;
        line-height: 1.75; }
	.comment-list2 li:nth-child(1) {
		background: url(../img/comment/conclusion_bg_comment22.jpg) no-repeat bottom right -3.5vw,#fff;
		background-size: auto 76%;
	}
	.comment-list2 li:nth-child(2) {
		background: url(../img/comment/conclusion_bg_comment23.jpg) no-repeat bottom right 5vw,#fff;
		background-size: auto 78%;
	}
	}