@charset "utf-8";
/*/////////////////////////////////////////////////////////////////////////
local.pokemon.jp (EN)
/////////////////////////////////////////////////////////////////////////*/
.section-block h2 .jp { display:none;}
.sortby > li ul { width:120px; margin-left:-60px;}

.municipality .pokemon .profile dt { width:5.7em;}
.municipality .pokemon .profile dd { padding-left:5.7em;}

.manhole .about .inner p { text-align:left;}

.loadon #loading div:before,
#header h1:before,
#footer .otherlink li.logo a:before { background-image:url(../img/logo_en.png);}
.manhole #footer .logo a { background-image:url(../img/manhole_bn_en.png);}
.manhole.loadon #loading div:before,
#manhole-main .inner h1 { background-image:url(../img/manhole_title_en.png);}

.manhole .about .inner h2:before,
.manhole .about .inner h2:after { margin-top:22px;}
.manhole .about .inner h2 > span {
	display:block; width:100%;
	white-space:nowrap; position:absolute;
	top:0; left:50%; transform:translateX(-68%);
}
.manhole-municipality .about .inner h2 { padding:0;}
.manhole-municipality .about .inner h2:before,
.manhole-municipality .about .inner h2:after { display:none;}
.manhole-municipality .manhole-banner { margin-bottom:0;}

@media screen and (min-width:768px){
	.sortby { top:35px;}
	.section-block h2 { padding:50px 0 30px;}
	.section-block h2 .en { min-width:280px;}
	.top .section-block > p { padding-bottom:10px;}
	.manhole .section-block.goods h2 { padding-top:50px;}

	.detail-manhole .block.map { padding-top:0;}
	.detail-manhole .block.map h2 { display:none;}

	.manhole-area li a > span:nth-child(1) { width:7em; padding-left:1em;}

	#manhole-main .inner ul li a > span { font-size:28px; letter-spacing:-0.03em; padding:0 12px;}
	#manhole-main .inner ul li.area5 { left:190px;}
}

@media screen and (max-width:767.999px){
	#footer .f1 { padding:25px 0;}

	.area-item .pic,
	#mList .area-item .pic { width:35px; height:35px;}
	.area-item .name,
	#mList .area-item .name { font-size:12px;}

	.section-block h2 .en { min-width:240px;}

	.top .about .inner h2 span:nth-child(2) { font-size:16px;}
	.top .about .inner p { line-height:1.8;}
	.top .section-block > h2 { padding:45px 0 0;}
	.top .section-block > p { padding:0 10px 5px;}

	.manhole-area li a > span:nth-child(1) { width:7em;}

	.manhole .about .inner h2 { padding:0 40px;}
	.manhole .about .inner h2:before,
	.manhole .about .inner h2:after { margin-top:15px;}
	.manhole .about .inner h2 > span { transform:translateX(-64%);}
	.manhole-municipality .about .inner h2 { padding:0 5%;}

	#manhole-main .inner ul li.area1 {
		width:35%; padding-top:calc(115 / 450 * 35%);
		top:38%; left:62%;
	}
	#manhole-main .inner ul li.area2 {
		width:14%; padding-top:calc(115 / 180 * 14%);
		top:73%; left:76%;
	}
	#manhole-main .inner ul li.area3 {
		width:14%; padding-top:calc(115 / 180 * 14%);
		top:72%; left:57%;
	}
	#manhole-main .inner ul li.area4 {
		width:14%; padding-top:calc(115 / 180 * 14%);
		top:82%; left:41%;
	}
	#manhole-main .inner ul li.area5 {
		width:34%; padding-top:calc(115 / 440 * 34%);
		top:59%; left:14%;
	}
	#manhole-main .inner ul li.area6 {
		width:32%; padding-top:calc(115 / 415 * 32%);
		top:82%; left:0.5%;
	}
	#manhole-main .inner ul li.area1 a { background-image:url(../img/manhole_btn_en1.png);}
	#manhole-main .inner ul li.area2 a { background-image:url(../img/manhole_btn_en2.png);}
	#manhole-main .inner ul li.area3 a { background-image:url(../img/manhole_btn_en3.png);}
	#manhole-main .inner ul li.area4 a { background-image:url(../img/manhole_btn_en4.png);}
	#manhole-main .inner ul li.area5 a { background-image:url(../img/manhole_btn_en5.png);}
	#manhole-main .inner ul li.area6 a { background-image:url(../img/manhole_btn_en6.png);}
	#manhole-main .inner ul li.area1 a:not([href]) { background-image:url(../img/manhole_btn_en1_not.png);}
	#manhole-main .inner ul li.area2 a:not([href]) { background-image:url(../img/manhole_btn_en2_not.png);}
	#manhole-main .inner ul li.area3 a:not([href]) { background-image:url(../img/manhole_btn_en3_not.png);}
	#manhole-main .inner ul li.area4 a:not([href]) { background-image:url(../img/manhole_btn_en4_not.png);}
	#manhole-main .inner ul li.area5 a:not([href]) { background-image:url(../img/manhole_btn_en5_not.png);}
	#manhole-main .inner ul li.area6 a:not([href]) { background-image:url(../img/manhole_btn_en6_not.png);}
}

@media screen and (max-width:320px){
	.area-list { padding:30px 0 30px 5%;}
	.area-item,
	#mList .area-item { width:48%; padding: 0 1%;}
	.top #banner-area .area-list { padding:20px 0 20px 4%;}
	#mList .area-list { padding:0 0 15px 3%;}

	.top .about .inner h2 span:nth-child(2) { font-size:15px;}

	.manhole-area li a > span span:nth-child(n+4) { display:none;}
	.manhole-area li a > span span:nth-child(3):after {
		content:"…"; font-size:18px;
		position:absolute; bottom:-3px; right:-1.3em;
	}

}