@charset "utf-8";

@media screen and (max-width:767px){
/* Globals
=================================================== */
#mmi-header img,
#mmi-footer img,
#mmi-container img,
.mmi-big-bnrs img{max-width:100%; height:auto;}

/* page wrapper
==================================================== */
#mmi-wrapper{min-width:320px; margin-top:50px;}
#mmi-container{}
	
/* page header
==================================================== */
#mmi-header{height:50px; width:100%; position:relative; left:0; top:0; z-index:10000;}
#mmi-wrapper #mmi-header{position:fixed;}
#mmi-header .mmi-inner{width:auto; height:50px; overflow:visible;}
#mmi-header #mmi-site-id{width:145px; height:32px; left:10px; top:10px;}
#mmi-header .mmi-drawer{position:fixed; width:100%; top:50px; background:#000; display:none; border:0; opacity:0; animation: hide .5s linear 0s; z-index:100001;}
#mmi-header .mmi-toggle-check:checked + .mmi-toggle + .mmi-drawer{display:block; opacity:1; animation: show .5s linear 0s; border-top:1px #b6c7d6 solid; height:calc(100% - 50px); overflow:auto;}
@keyframes show{
 from{opacity:0;}
 to{opacity:1;}
}
@keyframes hide{
 from{opacity:1;}
 to{opacity:0;}
}

#mmi-global{width:auto; height:auto; position:relative; left:auto; bottom:auto; background:#fff;}
#mmi-global li:first-child{width:auto; border-left:0;}
#mmi-global li:nth-of-type(4){width:auto; border-left:0;} 
#mmi-head-links{width:auto; height:auto; position:relative; right:auto; top:auto; background:#fff;}
#mmi-global li{width:auto; height:auto; display:block; margin:0; text-align:left; font-size:13px; line-height:1.2; border:1px #b6c7d6 solid; float:none; clear:both; border-width:0 0 1px;}
#mmi-head-links ul{text-align:left; position:relative; top:auto;}
#mmi-head-links ul.mmi-corp{left:auto;right:auto; background:#fff;}
#mmi-head-links ul.mmi-special{right:auto;}
#mmi-head-links ul.mmi-special li{display:block; margin:0; border-bottom:1px #b6c7d6 solid;}
#mmi-head-links ul.mmi-special li.mmi-contact a,
#mmi-head-links ul.mmi-special li.mmi-tel a,
#mmi-head-links ul.mmi-special li.mmi-cm a,
#mmi-head-links ul.mmi-special li.mmi-shop a{border:0 none; height:auto; line-height:1.2; border-radius:0; padding:12px 12px 12px 40px;}
#mmi-head-links ul.mmi-special li.mmi-shop a{padding:12px 12px 12px 8px;} 
  #mmi-head-links ul.mmi-special li.mmi-shop a:before{content:"";}
  
#mmi-head-links ul li{font-size:13px;}  
#mmi-head-links ul li.mmi-tel{display:block;}
#mmi-head-links ul li.mmi-contact a:before{content:'\e901'; font-size:22px; width:22px; height:22px; position:absolute; left:12px; top:50%; margin-top:-13px; line-height:22px;}
#mmi-head-links ul li.mmi-tel a:before{content:'\e912'; font-size:26px; width:22px; height:26px; position:absolute; left:10px; top:50%; margin-top:-13px; line-height:26px;}
#mmi-head-links ul li.mmi-cm a:before{position:absolute; left:12px; top:50%; margin-top:-12px;}
#mmi-head-links ul.mmi-corp li{width:50%; height:auto; display:block; margin:0; text-align:left; font-size:13px; line-height:1.2; border:1px #b6c7d6 solid; float:left; border-width:0 0 1px; background:#fff;}
#mmi-head-links ul.mmi-corp li:nth-child(odd){border-right:1px #b6c7d6 solid;}
#mmi-head-links ul.mmi-corp li:last-child{width:100%;border-right:none;}
#mmi-head-links ul.mmi-corp li a:before{display:none; content:'';}
#mmi-global li a,
#mmi-head-links ul li a{position:relative; padding:15px; line-height:1.2;}
#mmi-global li a:after,
#mmi-head-links ul li a:after{content:'\e902'; color:#0a3066; font-size:12px; position:absolute; right:10px; top:50%; width:10px; height:10px; line-height:10px; display:block; margin-top:-5px;}
#mmi-head-links ul li a[target=_blank]:after{content:'\e90a'; right:15px;}
#mmi-header .mmi-site-search{width:40px; height:40px; position:absolute; top:5px; right:50px;}
#mmi-header .mmi-site-search label.mmi-search-trig,
#mmi-header .mmi-site-search .mmi-search-btn{width:40px; height:40px;}
#mmi-header .mmi-site-search label.mmi-search-trig:before,
#mmi-header .mmi-site-search .mmi-search-btn:before{line-height:40px; font-size:30px; width:40px; height:40px; text-align:center;}
#mmi-header .mmi-head-search-input{height:40px;}
#mmi-header #mmi-search-toggle:checked + .mmi-head-search-input{width:260px;}
#mmi-header .mmi-head-search-input input[type=text]{outline:none; width:220px; height:38px; padding:5px; font-size:16px;}
#mmi-header .mmi-toggle{display:block; width:40px; height:40px; position:absolute; right:10px; top:5px; cursor:pointer;}
#mmi-header .mmi-toggle-check{position:absolute; left:0; top:0; width:0; height:0; visibility:hidden; overflow:hidden;}
#mmi-header .mmi-toggle:before{width:40px; height:40px; position:absolute; left:0; top:0; display:block; content:'\e911'; text-align:center; line-height:40px; font-size:40px; color:#0a3066;}
#mmi-header .mmi-toggle-check:checked + .mmi-toggle:before{content:'\e90d'; color:#b6c7d6;}
#mmi-header .mmi-toggle.mmi-bottom{position:static; left:auto; top:auto; bottom:auto; right:auto; width:100%; height:40px; background:#b6c7d6; display:block; clear:both;}
#mmi-header .mmi-toggle.mmi-bottom:before{width:100%; height:40px; position:static; left:auto; top:auto; display:block; content:'\e90b'; text-align:center; line-height:40px; font-size:38px; color:#fff;}

/* big banners area
====================================================== */
.mmi-big-bnrs{padding:40px 15px 20px; min-height:320px; background:url(/common/img/bg-milk-crown-sp.png) no-repeat center bottom; background-size:100% auto;}
.mmi-big-bnrs ul{width:auto;}
.mmi-big-bnrs ul li{width:auto; float:none; margin:0 0 15px;}
.mmi-big-bnrs ul li img{margin:0 auto;}


/*ページ下部誘導バナー*/
.mmi-big-bnrs ul.top_navi{
	width:auto!important;
	padding:0;
	margin: 1em auto;
}
.mmi-big-bnrs ul.top_navi li {
    width: 49%;
    margin-right: 0px;
	margin-bottom:5vw;
}
.mmi-big-bnrs ul.top_navi li .pc_display{
	display:none;
}
.mmi-big-bnrs ul.top_navi li .sp_display{
	display:block;
}
.mmi-big-bnrs ul.top_navi li:nth-of-type(even){
	float:right;
}
.mmi-big-bnrs ul.top_navi li img{
	width:100%;
}
.mmi-big-bnrs ul.top_navi li p:nth-of-type(1) {
    font-size: 14px;
	line-height:1.4;
	margin-top:0.3em;
}
.mmi-big-bnrs ul.top_navi li p:nth-of-type(2) {
    font-size: 11px;
	padding-left:0.5em;
	padding-right:0.5em;
}
.mmi-big-bnrs ul.top_navi li:after {
    top: 7vw;
    width: 12px;
    height: 12px;
    line-height: 12px;
    font-size: 12px;
}
/*ページ下部誘導バナー*/


.mmi-big-bnrs ul.usr-communications{height:auto;width:auto!important; padding:0; margin-bottom:20px; display:block;}
.mmi-big-bnrs ul.usr-communications:after{content:"";clear:both;display:block;}

.mmi-big-bnrs ul.usr-communications li{width:100%; float:none; font-size:12px; margin-bottom:10px;}
.mmi-big-bnrs ul.usr-communications li a{height:45px; line-height:43px; text-align:left; padding:0 10px 0 45px; letter-spacing:-0.025em;}
.mmi-big-bnrs ul.usr-communications li.mm{float:none;}
.mmi-big-bnrs ul.usr-communications li a:before{width:40px; height:40px; left:1px; top:1px; line-height:38px;}
.mmi-big-bnrs ul.usr-communications li.sns a:before{font-size:28px; background-size:36px auto;background-position:center center;}
.mmi-big-bnrs ul.usr-communications li.mm a:before{font-size:22px; background-size:36px auto;background-position:center center;}
.mmi-big-bnrs ul.usr-communications li a:after{width:10px; height:10px; right:5px; margin-top:-5px; line-height:10px; font-size:10px;}





/* site footer
====================================================== */
#mmi-footer .mmi-inner{width:auto; padding:0 0 20px;}
#mmi-footer .mmi-primary{float:none; width:auto; padding:0; border-right:0; margin-bottom:0;}
#mmi-footer .mmi-primary ul{float:none; width:100%; padding-right:0;}
#mmi-footer .mmi-primary ul li{border-top:0; border-bottom:1px #b6c7d6 solid;}
#mmi-footer .mmi-primary ul li a{padding:12px 20px 12px 10px; display:block; position:relative;}
#mmi-footer .mmi-secondary{float:none; padding:0; width:auto;}
#mmi-footer .mmi-secondary ul.mmi-corp{float:none; width:100%; margin:0;}
#mmi-footer .mmi-secondary ul.mmi-special{width:auto; float:none; position:relative; top:0;}
#mmi-footer .mmi-secondary ul li{font-size:14px; margin-bottom:0; width:100%;}
#mmi-footer .mmi-secondary ul li a{padding:12px; display:block;}
#mmi-footer .mmi-secondary ul.mmi-special li a:after{content:'\e902'; display:block; position:absolute; right:10px; top:50%; width:10px; height:10px; line-height:10px; margin-top:-5px; font-size:10px; color:#224475;}  
#mmi-footer .mmi-secondary ul.mmi-special li.mmi-shop a:after{content:'\e90a'; display:block; position:absolute; right:10px; top:50%; width:10px; height:10px; line-height:10px; margin-top:-5px; font-size:10px; color:#224475;}
#mmi-footer .mmi-secondary ul.mmi-special a[target=_blank]:hover:after{color:#224475!important;}  
#mmi-footer .mmi-secondary ul.mmi-corp li{border-bottom:1px #b6c7d6 solid;width:50%;float:left;}
#mmi-footer .mmi-secondary ul.mmi-corp li:first-child{border-right:1px #b6c7d6 solid;}
#mmi-footer .mmi-secondary ul.mmi-corp + ul.mmi-corp{border-right:0;}
#mmi-footer .mmi-secondary ul li.mmi-contact,
#mmi-footer .mmi-secondary ul li.mmi-tel,
#mmi-footer .mmi-secondary ul li.mmi-cm,
#mmi-footer .mmi-secondary ul li.mmi-shop{font-weight:normal; text-align:left; margin-bottom:0;}
#mmi-footer .mmi-secondary ul li.mmi-tel{display:block;}
#mmi-footer .mmi-secondary ul li.mmi-contact a,
#mmi-footer .mmi-secondary ul li.mmi-tel a,
#mmi-footer .mmi-secondary ul li.mmi-cm a,
#mmi-footer .mmi-secondary ul li.mmi-shop a{border:none;  border-bottom:1px #b6c7d6 solid; height:auto; line-height:1.2; border-radius:0; padding:12px 20px 12px 50px; font-size:14px;}
#mmi-footer .mmi-secondary ul li.mmi-shop a{padding:12px 20px 12px 10px;} 
#mmi-footer .mmi-secondary ul li.mmi-contact a:before{left:12px; top:50%;}
#mmi-footer .mmi-secondary ul li.mmi-tel a:before{left:12px;}
#mmi-footer .mmi-secondary ul li.mmi-cm{margin-right:0;}
#mmi-footer .mmi-secondary ul li.mmi-cm a:before{}
#mmi-footer .mm-sub-link{float:none; width:auto; padding-top:0; padding:20px 0; text-align:center;}
#mmi-footer .mm-sub-link li{padding:0 10px; font-size:12px;}
#mmi-footer .mm-sub-link li:first-child{padding-left:10px;}
#mmi-footer .mmi-owner{width:auto; float:none; text-align:center;}
#mmi-footer .mmi-owner img{width:150px; height:auto;}
#mmi-footer .mmi-owner small{display:block; font-size:8px;}
.mmi-pagetop{width:40px; height:40px; border-radius:20px; right:10px; bottom:10px;}
.mmi-pagetop a{width:40px; height:40px; border-radius:20px;}
.mmi-pagetop a:before{line-height:35px; font-size:26px;}



/* learn_enjoy navi
====================================================== */


#mmi-wrapper .learn-nav{padding:10px 15px; clear:both;}
#mmi-wrapper .learn-nav:after{content:''; display:block; clear:both;}
#mmi-wrapper .learn-nav ul{height:auto; width:auto; padding:0;}
#mmi-wrapper .learn-nav li{width:calc(33% - 6px); height:90px; margin:0 10px 10px 0;}
#mmi-wrapper .learn-nav li:nth-child(3n){margin-right:0;}
#mmi-wrapper .learn-nav li a{width:9999px; height:90px; font-size:12px;}
#mmi-wrapper .learn-nav li a:after{font-size:28px;}
#mmi-wrapper .learn-nav li.top a:after{font-size:18px; margin-top:0; line-height:30px;}	
#mmi-wrapper .learn-menu.extra.regular{padding:20px 15px 0;}




/* dummy */
#lipsum{width:auto; padding:30px 15px;}




/* 2021.6.11 森永乳業のサステナビリティ（SP 1行で表示するため、brにクラス名付与）
====================================================== */
.for-sp {
	display: none;
}




}