/* sass */
/*tool*/
#wrap #content .menuLst:after { content: ""; display: block; clear: both; }

/* keyframe
------------------------------------------------*/
@-webkit-keyframes floating { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
  50% { -webkit-transform: translate(0, -5px); transform: translate(0, -5px); }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } }
@keyframes floating { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
  50% { -webkit-transform: translate(0, -5px); transform: translate(0, -5px); }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } }
/*layout*/
/* layout
------------------------------------------------*/
#wrap #content { width: 100%; max-width: 1000px; }
#wrap #content #contentArea { width: 100%; }
#wrap #content .pcMode { display: block; }
#wrap #content .spMode { display: none; }
#wrap #content .contentImg { font-size: 0; line-height: 0; margin: 0; }
#wrap #content .contentImg img { width: 100%; height: auto; }

@media screen and (max-width: 769px) { #wrap #content .pcMode { display: none; }
  #wrap #content .spMode { display: block; }
  #wrap #content .contentImg { background: none; padding: 0; } }
/*module*/
/* wrap
------------------------------------------------*/
#wrap #content .topMenuWrap { background: url(../image/bdr01.gif) repeat-x left top; background-size: 8px; padding: 20px 0 0; }
#wrap #content .topBottomMenu { margin: 30px auto auto; font-size: 0; line-height: 0; padding: 0; }
#wrap #content .topBottomMenu img { width: 100%; height: auto; }
#wrap #content .bottomMenuWrap { padding: 40px 35px; }
#wrap #content .bottomMenuWrap.menu_mamastyle01 { background-color: #F5C2CC; }
#wrap #content .bottomMenuWrap.menu_mamastyle01 .bottomMenuArea { background: url(../image/bg_mamastyle01.png) no-repeat center top; background-size: 100% auto; }
#wrap #content .bottomMenuWrap.menu_mamastyle02 { background-color: #c2a089; }
#wrap #content .bottomMenuWrap.menu_mamastyle02 .bottomMenuArea { background: url(../image/bg_mamastyle02.png) no-repeat center top; background-size: 100% auto; }
#wrap #content .bottomMenuWrap.menu_mamastyle03 { background-color: #ccd7a2; }
#wrap #content .bottomMenuWrap.menu_mamastyle03 .bottomMenuArea { background: url(../image/bg_mamastyle03.png) no-repeat center top; background-size: 100% auto; }
#wrap #content .bottomMenuWrap.menu_mamastyle04 { background-color: #f0c5bf; }
#wrap #content .bottomMenuWrap.menu_mamastyle04 .bottomMenuArea { background: url(../image/bg_mamastyle04.png) no-repeat center top; background-size: 100% auto; }
#wrap #content .bottomMenuArea { padding: 75px 90px; }
#wrap #content .dataArea { background: url(../image/bdr_mamastyle04.gif) left top; }
#wrap #content .dataArea .dataImg { text-align: center; padding: 0 20px 23px; font-size: 0; line-height: 0; margin-bottom: 0; position: relative; }
#wrap #content .dataArea .dataImg img { display: block; margin: 0 auto; max-width: 820px; width: 100%; height: auto; }
#wrap #content .dataArea.dataArea_typeB { background-color: #FFE5E1; background-image: none; }
#wrap #content .dataArea.dataArea_typeB .dataImg { padding: 0 20px 45px; }

@media screen and (max-width: 769px) { #wrap #content .topMenuWrap { background-size: 6px 8px; padding: 16px 0 0; }
  #wrap #content .topBottomMenu { margin: 20px 0 auto; }
  #wrap #content .bottomMenuWrap { padding: 30px 10px 35px; }
  #wrap #content .bottomMenuWrap.menu_mamastyle01 .bottomMenuArea, #wrap #content .bottomMenuWrap.menu_mamastyle02 .bottomMenuArea, #wrap #content .bottomMenuWrap.menu_mamastyle03 .bottomMenuArea, #wrap #content .bottomMenuWrap.menu_mamastyle04 .bottomMenuArea { background: none; background-size: auto; padding: 0; }
  #wrap #content .dataArea { padding: 0 10px; }
  #wrap #content .dataArea .dataImg { padding: 0 0 23px; }
  #wrap #content .dataArea.dataArea_typeB .dataImg { padding: 0 0 30px; }
  #wrap #content .dataArea.dataArea_typeB .zoom_icn { bottom: 40px; } }
/* heading
------------------------------------------------*/
#wrap #content .topMainTtl { padding: 0 42px; background: none; margin-bottom: 20px; }
#wrap #content .topMainTtl img { text-align: center; border: none; width: 100%; height: auto; }
#wrap #content .dataTtl { font-size: 0; line-height: 0; background: none; text-align: center; padding: 35px 10px 10px; }
#wrap #content .dataTtl img { max-width: 625px; width: 100%; height: auto; border: none; }
#wrap #content .dataTtl .dataSubTtl { display: block; margin-bottom: -5px; }
#wrap #content .dataTtl .dataSubTtl img { max-width: 285px; }
#wrap #content .dataTtl .pcMode { display: inline; }
#wrap #content .dataTtl .spMode { display: none; }
#wrap #content .dataArea_typeB .dataTtl { padding: 42px 10px 22px; }

@media screen and (max-width: 769px) { #wrap #content .topMainTtl { padding: 25px 10px 0; margin-bottom: 23px; }
  #wrap #content .dataTtl { text-align: left; padding: 22px 20px 10px 10px; }
  #wrap #content .dataTtl img { max-width: 268px; }
  #wrap #content .dataTtl .dataSubTtl { padding-left: 10px; margin-bottom: 10px; }
  #wrap #content .dataTtl .dataSubTtl img { margin: 0; max-width: 229px; }
  #wrap #content .dataTtl .pcMode { display: none; }
  #wrap #content .dataTtl .spMode { display: inline; }
  #wrap #content .dataArea_typeB .dataTtl { padding: 26px 10px 20px; } }
/* text
------------------------------------------------*/
/* list
------------------------------------------------*/
#wrap #content .topMenu { background: url(../image/bdr01.gif) repeat-x left bottom; background-size: 8px; padding-bottom: 20px; display: table; width: 100%; text-align: center; margin-left: -4px; }
#wrap #content .topMenu li { display: table-cell; vertical-align: top; padding-left: 4px; }
#wrap #content .topMenu li img { width: 100%; height: auto; }
#wrap #content .bottomMenu { padding-bottom: 30px; border-bottom: 1px dashed #5c302e; }
#wrap #content .bottomMenu li:not(:first-child) { margin-top: 10px; }
#wrap #content .bottomMenu li img { width: 100%; height: auto; }
#wrap #content .menuLst { margin-top: 25px; }
#wrap #content .menuLst li { box-sizing: border-box; }
#wrap #content .menuLst .linkNutrition { width: 54%; float: right; text-align: right; padding-left: 10px; }
#wrap #content .menuLst .linkNutrition img { max-width: 350px; width: 100%; height: auto; }
#wrap #content .menuLst .linkTop { width: 46%; margin-top: 20px; float: left; padding-right: 10px; }
#wrap #content .menuLst .linkTop img { max-width: 320px; width: 100%; height: auto; }
#wrap #content .menu_mamastyle04 .menuLst { text-align: center; }
#wrap #content .menu_mamastyle04 .menuLst .linkTop { width: 100%; margin-top: 35px; float: none; padding-right: 0; }

@media screen and (max-width: 769px) { #wrap #content .topMenu { background-size: 6px 8px; padding-bottom: 16px; display: block; }
  #wrap #content .topMenu li { display: block; }
  #wrap #content .topMenu li:not(:first-child) { padding-left: 0; padding-top: 5px; }
  #wrap #content .bottomMenu { padding-bottom: 20px; }
  #wrap #content .menuLst { padding: 0 10px; }
  #wrap #content .menuLst .linkNutrition { width: 100%; float: none; padding: 0; }
  #wrap #content .menuLst .linkTop { width: 100%; margin-top: 32px; padding: 0 40px; float: none; }
  #wrap #content .menu_mamastyle04 .menuLst { text-align: center; }
  #wrap #content .menu_mamastyle04 .menuLst .linkTop { margin-top: 32px; padding: 0 40px; } }
/* js_style
------------------------------------------------*/
body.layout_zoom_image > * { display: none; }
body.layout_zoom_image > .copy_zoom_image_wrap { display: block; }

.copy_zoom_image_wrap { margin-top: 50px; }
.copy_zoom_image_wrap img { max-width: 800px !important; }
.copy_zoom_image_wrap .close { background: url(../image/btn_close.png) no-repeat left top; background-size: 31px 30px; width: 31px; height: 30px; position: fixed; left: 10px; top: 10px; }
.copy_zoom_image_wrap .close:hover { cursor: pointer; }

.zoom_icn { display: none; }

@media screen and (max-width: 769px) { .zoom_icn { text-indent: -9999px; background: transparent url(../image/btn_zoom.png) no-repeat left top; background-size: 40px 40px; bottom: 30px; display: inline-block; height: 40px; position: absolute; right: 10px; width: 40px; z-index: 10; -webkit-animation-name: floating; animation-name: floating; -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; /*animation-direction:alternate;*/ -webkit-animation-timing-function: ease; animation-timing-function: ease; -webkit-transition: all 0.5s ease-in-out 0s; transition: all 0.5s ease-in-out 0s; } }


/* #BottomItemdetail
------------------------------------------------------------ */

#wrap #content .BottomItemdetail { width: 100%; margin-top: 30px; }
#wrap #content .BottomItemdetail img { margin: auto; border: none; }

@media screen and (max-width: 769px) 
#wrap #content .BottomItemdetail { padding: 0px !important; }