@charset "utf-8";
/*=====================================================
 * Style URL: detail.css
 * Version: 1.0
 * Last Up Date: 2019/2/14
=====================================================*/
/**----- contents -------
	1: html & body & other
	2: wrapper
	3: header
	5: tab
	5: main
	6: footer
 7: #comic
----------------------*/
/*=== 1: html & body & other =====================================*/
img {
	max-width: 100%;
}
figure {
	margin: 0;
}
.sp {
	display: none !important;
}

/*---sp-------------*/
@media screen and (max-width: 640px) {
body {
	background: url(/meiji-eiyoucare/img/common/bg_top.jpg) repeat center top;
 overflow: hidden;
}
.pc {
	display: none!important;
}
.sp {
	display: block !important;
}
}
/*================================================================*/
/*=== 2: wrapper =================================================*/
.wrapper {
 margin: auto;
}
/*================================================================*/
/*=== 3: header ==================================================*/
header.eiyoucareHeader .bgMenu {
 background: none;
}
header.eiyoucareHeader .headerMenu2 {
 background: none;
}

@media screen and (max-width: 640px){
.headerMenuCnt2SP li span.care+ul {
 display: block;
}
}
/*================================================================*/
/*=== 4: tab =====================================================*/
.tab {
	width: 1024px;
 margin: auto;
 border-bottom: #fff 16px solid;
}

/*---sp-------------*/
@media screen and (max-width: 640px) {
.tab {
 display: none;
 }
}
/*================================================================*/
/*=== 5: main ====================================================*/
main {
 display: block;
	width: 1024px;
 padding: 40px 0 0;
	margin: 0 auto 0;
 background:url("../images/main_bg.png") left top repeat;
 border-top: #eb6b66 1px solid;
}
main h1 {
 margin-bottom: 35px;
 background:rgba(255,255,255,0.00);
	box-sizing: border-box;
}
main h1 img,
main .character img{
 display: block;
 margin: auto;
}
main .flex_inner {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;
}

/*---sp-------------*/
@media screen and (max-width: 640px) {
main {
	width: 100%;
 padding: 20px 0 0;
	margin: 0 auto; 
 border-top: none;
}
main h1 {
 width: 92.53%;
 margin:0 auto 20px;
}
main .character{
 width: 92%;
 margin: auto;
}
main .flex_inner {
	display: block;
}
}
/*================================================================*/
/*=== 6: footer ==================================================*/
footer {
	margin-top: auto;
}
/*================================================================*/
/*=== 7: #comic ==================================================*/
#comic main .sec01{
 padding: 40px 0;
 margin-top: 40px;
 background: #fff;
}
#comic main ul.thum{
 width: 825px;
 margin: auto;
}
#comic main ul.thum li{
 width: 380px;
 margin-bottom: 40px;
}
#comic .knowledge_link a{
 display: block;
 width: 940px;
 margin:auto;
}
#comic .knowledge_link a{
	-webkit-transition: all .3s;
	transition: all .3s;
}
#comic .knowledge_link a:hover{
 opacity: 0.8;
}
#comic ul:after {
 display: none;
}

/*---sp-------------*/
@media screen and (max-width: 640px) {
#comic main ul.thum{
 width: 92%;
 margin: auto;
}
#comic main ul.thum li{
 width: 100%;
}
#comic .product_link{
 padding: 20px 0 25px;
 background:#eb726d url("../images/product_link_bg_sp.png") center bottom no-repeat;
 background-size: 100%;
}
#comic .knowledge_link a{
 width: 66.66%;
}
}
/*================================================================*/