@charset "utf-8";
@charset "utf-8";
/*==========================

	common

============================*/
#main2 {
	font-size: 14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#main2 h2#eyecatch {
	line-height: 0;
	margin: 0 auto;
}
#main p {
	color: #333333;
	line-height: 18px;
	letter-spacing: 0;
}
#socialArea {
	padding: 15px 0 25px;
}
#socialArea ul {
	float: left;
}
#socialArea ul li {
	float: left;
	margin: 0 10px 0 0;
}
.days {
	float: right;
	font-size: 10px;
	text-align: right;
	letter-spacing: 0.1em!important;
/*	width: 116px;*/
}
#eyecatch img {
  width: 100%;
}
/*==========================

	#subNavi

============================*/
#subNavi img {
    position: relative;
    top: -6px;
    left: -1px;
}
#subNavi ul {
	width: 720px;
	margin: 0 auto 60px;
	height: 78px;
}
#subNavi ul li {
	float: left;
	display: block;
}

#subNavi ul li.navi01 ,#subNavi ul li.navi02{
	width: 32.5%;
	margin-right: 1%;
}
#subNavi ul li.navi03{
	width: 33%;
}

.navi01 span,.navi02 span,.navi03 span{
	font-size: 12px;
}
#subNavi ul li a {
	background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #ff88b5 0%, #fb4b8e 100%) repeat scroll 0 0;
	border-radius: 5px;
	color: #ffffff;
	display: block;
	font-size: 20px;
	font-weight: bold;
	height: 60px;
	line-height: 1.2;
	margin: 0 0 3%;
	text-align: center;
	text-decoration: none;
	text-shadow: 1px 1px 0 #ff287b;
	padding: 5px 0 0;
	border: 1px solid #fd5a93;
}
/*==========================

	.sectionNavi

============================*/
.sectionNavi {
	width: 670px;
	margin: 0 auto;
}
.sectionNavi li {
	width: 330px;
}
.sectionNavi li.navi01 {
	float: left;

}
.sectionNavi li.navi02 {
	float: right;
}

.sectionNavi a{
	color: #ffffff;
	text-decoration: none;
	height: 48px;
	background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #ff88b5 0%, #fb4b8e 100%) repeat scroll 0 0;
	border: 1px solid #fd5a93;
	border-radius: 5px;
	font-size: 16px;
	line-height: 3;
	margin: 0 0 3%;
	text-align: center;
	text-shadow: 1px 1px 0 #ff287b;
	display: block;
}

.spaceNavi {
	margin: 0 auto 50px;
}

.figureimg {
    left: -1px;
    position: relative;
    top: -1px;
}

/*==========================

	#layout

============================*/
h3 img{
	display: block;
	line-height: 0;
}

.imgheight img{
	height: auto!important;
}

.sectionBody {
	width: 720px;
	margin: 0 auto 35px;
}
.sectionBody h3 img{
	display: inline;
	line-height: 0;
}
.sectionBody h3 {
	text-align: center;
}
.ttlBottom {
	margin: 0 0 10px;
	font-weight: bold;
	color: #FE5E8E;
}
.ttlBottom p{
	margin: 10px 0 0;
	font-weight: bold;
}
strong {
	font-weight: bold;
	display: block;
}
.bgLine {
	border-left: 5px solid #ff3d98;
	font-size: 18px;
	line-height: 1.4;
	padding: 5px 0 3px 10px;
}
.bgLine span, .bgShopLine span {
	display: block;
	font-size: 12px;
}
.bgBox {
	background: #ffffff;
	border: 1px solid #eeeee1;
	padding: 30px;
}
.shopBox_L,.interBox_L {
	float: left;
	width: 360px;
}
.shopBox_R,.interBox_R {
	float: right;
	width: 360px;
}
.figcaption_L {
	float: left;
	width: 270px;
}
.figcaption_R{
	float: right;
	width: 270px;
}
.figcaption_L img{
	float: left;
	width: 270px;
}
.figcaption_R img{
	float: right;
	width: 270px;
}
.figcaption,
.figcaption_R,
.figcaption_L,
#interview {
	line-height: 0;
}
ul#shopIcon {
	margin: 0 auto 5px;
	line-height: 0;
}
ul#shopIcon .area02 {
	margin: 0 0 0 5px;
}

ul#shopIcon li {
	float: left;
	width: 62px;
}
ul#shopNavi li {
	width: 220px;
	float: left;
}
ul#shopNavi li.navi02 {
	margin: 0 6px;
}

.figcaption img {
	width: 100%;
}

#interview {
	display: flex;
    flex-wrap: wrap;
    align-items: center;
	margin-bottom: 30px;
}

#interview .interviewImg {
	width: 36%;
	margin-right: 4%;
}

#interview .interviewImg img {
	width: 100%;
}

#interview .interviewTxt {
	width: 60%;
}

.interviewTtl {
	text-align: center;
	margin-bottom: 30px;
	font-weight: bold;
	color: #fafbf6!important;
	-webkit-text-stroke: 0.8px #333;
	font-size: 29px;
	position: relative;
}

.interviewTtl::before, .interviewTtl::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 30px;
	height: 1px;
	background-color: #333;
}

.interviewTtl::before {
	-webkit-transform: rotate(60deg);
	transform: rotate(60deg);
	left: 40px;
}

.interviewTtl::after {
	-webkit-transform: rotate(-60deg);
	transform: rotate(-60deg);
	right: 40px;
}

/*==========================

	#section0

============================*/
#section0 {
	margin: 0 auto 20px;
	padding: 25px;
}
#section0 .shopBox {
	float: right;
	width: 365px;
}
#section0 .shopBox p {
	width: 355px;
}
#section0 .figcaption {
	float: left;
	width: 285px;
	border: 1px solid #cccccc;
}

#section0 .figcaption img{
	width: 100%;
}

#section0 .shopBox strong {
	font-size: 18px;
}
#section0 .shopBox p {
	font-size: 12px;
	padding: 20px 0 0;
	color: #111111 !important;
	line-height: 16px !important;
}
/*==========================

	#section1

============================*/
#section1 {
	display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    align-items: center;
	margin-bottom: 30px;
}
#section1 .shopBox {
	width: 70%;
}
#section1 .figcaption {
	width: 27%;
	margin-right: 3%;
}
#section1 h3 {
  color: #FF9702;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.3;
}

/*==========================

	#section2

============================*/
#section2, #section3 {
	margin: 0 auto 20px;
}


#section4 {
	margin: 0 auto 35px;
}


/*==========================

	#section5

============================*/
#section5 {
	margin: 0 auto 35px;
	background: #ffffff;
	border: 5px solid #eeeee1;
	min-height: 200px;
	padding: 10px;
	position: relative;
}
#section5 .shopBox {
	float: right;
	position: relative;
	width: 476px;
	z-index: 1;
}
#section5 .shopBox h3 {
	font-size: 14px;
	margin: 5px 0 30px;
	padding: 10px 0 6px 15px;
}
#section5 .shopBox h3 strong {
	color: #333333;
	display: inline-block;
	font-size: 18px;
	padding: 0 5px 0 0;
}
#section5 .shopBox h3 span {
	display: inline-block;
	font-size: 12px;
}
#section5 .shopBox h3 span.block {
	display: block;
	padding: 0 5px 0 0;
}
#section5 .shopBox h3 span.space {
	padding: 0 10px 0 0;
}
#section5 .figcaption img{
	float: left;
	position: relative;
	width: 200px;
	z-index: 3;
}
#section5 .shopBox p {
	padding: 0 0 0 15px;
}
#section5 .line {
	border-bottom: 2px solid #ff89bb;
	position: absolute;
	top:30%;
	left:196px;
	width: 500px;
	z-index: 2;
}

#section5 .line_sp {
    border-bottom: 2px solid #ff89bb;
    left: 222px;
    position: absolute;
    top: 56%;
    width: 478px;
    z-index: 2;
}

.sp_nm{
	line-height: 1.5!important;
	padding-top: 45px!important;
}


.sp_nm.id33{
	padding-top: 10px!important;
}



/*==========================

	#section6, #section7, #section8

============================*/
#section6 {
	margin: 0 auto 10px;
}
.shopBox_L img, .shopBox_R img, .interBox_L img, .interBox_R img {
  height: 15px;
}
#section7 {
	margin: 0 auto 15px;
}


/*==========================

	#section8

============================*/
#section8,#sectionQa {
	margin-bottom: 20px;
}
#section8 .shopBox,#sectionQa .shopBox {
	display: flex;
    flex-wrap: wrap;
    align-items: center;
	margin-bottom: 20px;
}

#section8 .interviewImg {
	width: 36%;
	margin-right: 4%;
}

#section8 .interviewImg img {
	width: 100%;
}

#section8 .interviewTxt {
	width: 60%;
}

#section8 table,#sectionQa table {
	width: 680px;
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 6px 8px;
	border-bottom: 1px solid #efeddb;
	font-size: 13px;
}
#section8 table th, #section8 table td,#sectionQa table th, #sectionQa table td {
	vertical-align: middle;
}
#section8 table th,#sectionQa table th {
	width: 33px;
}




/*==========================

	#section9

============================*/
#section9 {
	margin: 0 auto 76px;
	width: 716px;
}
#section9 .shopBox {
	width: 680px;
	margin: 0 auto 50px;
}
#section9 .shopBox h3 {
	float: left;
	width: 250px;
}
#section9 .shopBox p {
	float: right;
	width: 397px;
}
#section9 table {
	width: 680px;
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 6px 8px;
	border-bottom: 1px solid #efeddb;
	font-size: 13px;
}
#section9 table th, #section9 table td {
	vertical-align: middle;
}
#section9 table th {
	width: 26px;
}
/*==========================

	#section10

============================*/
#section10 {
	margin: 0 auto;
	padding: 23px;
}
#section10 h3.bgShopLine {
	margin: 0 0 15px;
}



/*==========================

	#sectionCastRecommend

============================*/

#sectionCastRecommend{
	margin: 0 auto 35px;
    background: #ffc5e0 none repeat scroll 0 0;
    border: 1px solid #ff8bc1;
    padding: 25px;
}

#sectionCastRecommend .ttlCast {
	font-size: 20px;
	text-shadow: 1px 1px 0px #fff, -1px -1px 0px #fff, -1px 1px 0px #fff, 1px -1px 0px #fff, 1px 0px 0px #fff, -1px 0px 0px #fff, 0px 1px 0px #fff, 0px -1px 0px #fff;
	border-bottom: 1px solid #fe5e8e;
    padding-bottom: 4px;
}


.shopBoxFull{width: 100%;}
.bgLine {
	border-left: 5px solid #33c8ff;
	padding: 0 0 0 10px;
	line-height: 1.4;
}

.bgShopLine {
	border-left: 5px solid #33c8ff;
	padding: 0 0 0 10px;
	line-height: 1.4;
}
.color {
	color: #ff3d98;
}

@media screen and (max-width: 896px) {

	#socialArea {
		width: 96%;
		margin: 0 auto;
	}

	.bgBox {
		width: 87%;
		padding: 4%!important;
		margin: 0 auto 10px!important;
		display: flex;
		flex-wrap: wrap;
		flex-direction: column-reverse;
	}

	#section0 .shopBox {
		width: 100%;
		display: block;
	}

	#section0 .shopBox p {
		width: 100%;
	}

	#section0 .figcaption {
		width: 45%;
		margin: 0 auto 20px;
	}

	#subNavi ul {
		width: 96%;
		margin: 20px auto 0;
	}

	.navi01 span, .navi02 span, .navi03 span {
		display: none;
	}

	#subNavi ul li a {
		font-size: 12px;
	}

	#subNavi ul li a::after {
		content: '▼';
		display: block;
		color: #ffffff;
		margin-top: 3px;
	}
	#section1 {
		width: 96%;
		flex-direction: column-reverse;
		margin: 15px auto;
	}

	#section1 .shopBox {
		float: none;
		width: 94%;
		background: #ffedf0;
		padding: 3%;
	}

	#section1 .shopBox h3 {
		font-size: 12px;
		color: #333;
		padding: 0;
	}

	#section1 .figcaption {
		float: none;
		width: 40%;
		margin: 0 auto 10px;
	}

	#section1 .figcaption img {
		width: 100%;
	}

	.sectionBody {
		width: 100%;
	}

	.sectionBody video {
		width: 96%!important;
		height: auto!important;
		display: block;
		margin: 0 auto;
	}

	.shopBox_L, .interBox_L,.shopBox_R, .interBox_R {
		float: none;
		width: 100%;
	}

	.figcaption_R, .figcaption_L {
		float: none;
		width: 50%;
		margin: 0 auto 15px;
	}

	.figcaption_R img, .figcaption_L img {
		width: 100%;
		float: none;
	}

	.sectionNavi {
		width: 80%;
	}

	.sectionNavi li.navi01, .sectionNavi li.navi02 {
		float: none;
		width: 100%;
	}

	#interview {
		display: block;
	}

	#interview .interviewImg {
		width: 50%;
		margin-right: 0;
		margin: 0 auto 20px;
	}

	#interview .interviewTxt {
		width: 96%;
		margin: 0 auto;
	}

	.interviewTtl::before, .interviewTtl::after {
		width: 24px;
	}

	.interviewTtl::before {
		left: 5px;
	}

	.interviewTtl::after {
		right: 5px;
	}

	.interviewTtl {
		-webkit-text-stroke: 0px;
		color: #333!important;
		font-size: 17px;
	}

	#section5 {
		width: 88%;
		display: flex;
		flex-direction: column-reverse;
		flex-wrap: wrap;
	}

	#section5 .shopBox {
		float: none;
		width: 100%;
	}

	#section5 .shopBox h3 {
		padding: 0 0 10px;
		margin: 5px 0 20px;
		border-bottom: 2px solid #ff89bb;
	}

	#section5 .shopBox p {
		padding: 0;
	}

	#section5 .line {
		display: none;
	}

	#section5 .figcaption {
		display: block;
		width: 50%;
		margin: 0 auto 10px;
	}

	#section5 .figcaption img {
		float: none;
		width: 100%;
	}

	#sectionCastRecommend {
		width: 86%;
		padding: 15px;
	}

	.shopBox_L {
		margin-bottom: 20px;
	}

	#section8 .shopBox {
		display: block;
	}

	#section8 .interviewImg {
		width: 50%;
		margin-right: 0;
		margin: 0 auto 20px;
	}

	#section8 .interviewTxt {
		width: 96%;
		margin: 0 auto;
	}

	#section8 table {
		width: 96%;
	}

	#section10 {
		flex-direction: column;
	}

	ul#shopIcon {
		margin: 0 0 10px;
	}

	#section10 .sectionNavi {
		width: 96%!important;
	}

	.pagetop {
		width: 40px;
		height: 40px;
		right: 10px;
		bottom: 20px;
	}
}