@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{left:0px; top:10px; width:100%; text-align:center;}
#mmi-header #mmi-site-id img{width:170px; display:inline; }
#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 ul{margin-left:0px;}



#mmi-global li:first-child{width:auto; border-left:0;}
#mmi-global li.contact,
#mmi-global li.japanese_s{
	position:relative;
	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;
	clear:none;
	}
#mmi-global li.contact{border-right:1px #b6c7d6 solid;}
#mmi-global li:nth-of-type(6) {float:none;}
#mmi-global li.contact a{border:none; padding:15px;}
#mmi-global li.contact a:before{vertical-align:top;font-size:13px;}
#mmi-head-links{width:auto; height:auto; position:relative; right:auto; top:auto; background:#fff;}
#mmi-global ul li{width:auto; height:auto; display:block; margin:0; text-align:left; font-size:15px; line-height:1.2; border:1px #b6c7d6 solid; float:none; clear:both; border-width:0 0 1px;}
#mmi-global ul li.japanese_s a:after{
    content: '\e90a';
	margin-right:3px;
}
#mmi-head-links ul{text-align:left; position:relative; top:auto;}
#mmi-head-links ul.ex{left: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{border:0 none; height:auto; line-height:1.2; border-radius:0; padding:12px 12px 12px 40px;}
#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 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:3px; top:5px; cursor:pointer; z-index:100;}
#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:90px 15px 40px; 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;}
/* 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:left; width:50%; 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-corp li{border-bottom:1px #b6c7d6 solid;}
#mmi-footer .mmi-secondary ul.mmi-corp{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{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{border:none;  border-bottom:1px #b6c7d6 solid; height:auto; line-height:1.2; border-radius:0; padding:12px 20px 12px 50px; font-size:15px;}
#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;}

#mmi-footer ul.link {
    float: none;
	text-align:center;
	padding-top:30px;
	border-left:none;
	clear:both;
}
#mmi-footer ul.link li:first-child{
	border-left:1px solid;
}
#mmi-footer .logo {
    text-align: center;
}
#mmi-footer .copy {
    float: none;
    font-size: 10px;
	text-align:center;
	margin-top:15px;
	margin-bottom:35px;
}

#mmi-footer ul.global li{width:auto; height:auto; display:block; margin:0; text-align:left; font-size:15px; line-height:1.2; border:1px #b6c7d6 solid; float:none; clear:both; border-width:0 0 1px;position: relative;
    line-height: 1.2;
	}
#mmi-footer ul.global li a{
	display:block;
    padding: 15px;
	font-family:notoE;
}
#mmi-footer ul.global 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-footer ul.global li.contact,
#mmi-footer ul.global li.japanese_s{
	
	position:relative;
	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;
	clear:none;
	}
#mmi-footer ul.global li.contact{border-right:1px #b6c7d6 solid;}

#mmi-footer ul.global li.contact a{border:none; padding:15px;}
#mmi-footer ul.global li.contact a:before{vertical-align:top;font-size:13px;}

#mmi-footer ul.global li.contact a:before {
    content: '\e901';
    color: #f63140;
    font-size: 14px;
    vertical-align: middle;
    margin-right: 5px;
    position: relative;
    top: -1px;
}

#mmi-footer ul.global li.japanese_s a{
	padding:16px;
}
#mmi-footer ul.global li.japanese_s a:after {
	content: '\e90a';
    margin-right: 3px;
	    color: #0a3066;
    font-size: 12px;
    position: absolute;
    right: 10px;
    top: 50%;
    width: 10px;
    height: 10px;
    line-height: 10px;
    display: block;
    margin-top: -5px;
}

/*#mmi-footer ul.global li.contact a {
    color: #f73644;
}
#mmi-footer ul.global li:last-child a:after {
    content: '\e90a';
	margin-right:3px;
}*/

/* dummy */
#lipsum{width:auto; padding:30px 15px;}
}


