Commit 02b3c538 by o.kimura

4言語流し込み

parent 5039012a
Showing with 891 additions and 10 deletions
<!DOCTYPE html>
<html lang="ja" prefix="og: http://ogp.me/ns#">
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta charset="UTF-8">
<meta name="keywords" content="">
<meta name="description" content="">
<title>施厕所相关的游览用符号的种类与含义 - JAPAN TOILET INFORMATION -NIPPON UTSUKUSHI TOILET-</title>
<link rel="stylesheet" href="/utsukushitoilet/shared/css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="/utsukushitoilet/shared/css/common_jp.css" type="text/css" media="all">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all">
<script type="text/javascript" src="/utsukushitoilet/shared/js/jquery.js"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/jquery.plugin.js"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/common.js?ver=191024"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/common_parts.js?ver=191024"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".latest_menu li").autoHeight();
});
</script>
</head>
<body class="second">
<!-- google analytics -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-560401-9']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<!-- //google analytics -->
<script type="text/javascript" >
<!--
includeHead_Ja('div');
//-->
</script>
<noscript>
<p>当サイトはJavaScriptをonにしてご覧ください。</p>
</noscript>
<section class="first owner_menu">
<div class="block" id="breadcrumbs_area">
<p class="breadcrumbs"><a href="/utsukushitoilet/">TOP</a> &gt; <em>厕所相关的游览用符号的种类与含义</em></p>
</div>
</section>
<section id="_02">
<div class="block">
<h2 class="line">厕所相关的游览用符号的<br class="sp">种类与含义</h2>
<p>日本的厕所为了以易于了解的方式引导使用者,标识各种游览符号来指示厕所的用途和设备。<br>
这里将介绍这些主要游览符号的类型及其含义。</p>
<h3>游览用图符号与标识的含义</h3>
<dl id="kigou">
<dt><img src="images/kigou01.jpg" alt=""></dt><dd><strong>厕所</strong>标识厕所的位置及设备。</dd>
<dt><img src="images/kigou02.jpg" alt=""></dt><dd><strong>男子厕所</strong>标识男性用厕所的位置及设备。<br>※不限于厕所,它也可能标识男性用的设施。</dd>
<dt><img src="images/kigou03.jpg" alt=""></dt><dd><strong>女子厕所</strong>标识女性用厕所的位置及设备。<br>※不限于厕所,它也可能标识女性用的设施。</dd>
<dt><img src="images/kigou04.jpg" alt=""></dt><dd><strong>男女共用厕所</strong>标识无论性别为何均可使用,或可与看护者共同使用的厕所。</dd>
<dt><img src="images/kigou05.jpg" alt=""></dt>
<dd><strong>儿童厕所</strong>标识独立的儿童使用的厕所。<br>
※不限于厕所,它也可能标识儿童用的设施。</dd>
<dt><img src="images/kigou06.jpg" alt=""></dt><dd><strong>残障人士可使用的设备</strong>标识残障人士(例如轮椅使用者等)可以使用的设备位置和存在。</dd>
<dt><img src="images/kigou07.jpg" alt=""></dt><dd><strong>电脑马桶</strong>标识电脑马桶的设置位置及设备。<br>这个图形符号也表示它是一个西式厕所。</dd>
<dt><img src="images/kigou08.jpg" alt=""></dt><dd><strong>西式厕所(坐式马桶)</strong>标识设置了西式厕所(坐式马桶)。</dd>
<dt><img src="images/kigou09.jpg" alt=""></dt><dd><strong>日式厕所(蹲式马桶)</strong>标识设置了日式厕所(蹲式马桶)。</dd>
<dt><img src="images/kigou10.jpg" alt=""></dt><dd><strong>婴幼儿用设备</strong>标识用于婴幼儿的设施位置和设备,例如母乳喂养和更换尿布等。</dd>
<dt><img src="images/kigou11.jpg" alt=""></dt><dd><strong>换尿布台</strong>标识可以给婴儿换尿布的设备位置和设备。</dd>
<dt><img src="images/kigou12.jpg" alt=""></dt><dd><strong>婴儿椅</strong>标识厕所内设置的婴幼儿固定设备。</dd>
<dt><img src="images/kigou13.jpg" alt=""></dt><dd><strong>更衣台</strong>标识厕所内的更衣设备。</dd>
<dt><img src="images/kigou14.jpg" alt=""></dt><dd><strong>人工肛门用厕所设备</strong>标识装置人工肛门及人工膀胱者的清洗人工肛门袋等位置和设备。</dd>
<dt><img src="images/kigou15.jpg" alt=""></dt><dd><strong>简易型人工肛门用设备</strong>标识带有用于装置人工肛门和人工膀胱者的清洗人工肛门袋的抽水马桶位置和设备。</dd>
<dt><img src="images/kigou16.jpg" alt=""></dt>
<dd><strong>看护用床</strong>标识可用于多种用途的设备,例如更换尿布和提供护理等。</dd>
</dl>
<p>出处:<a href="http://www.ecomo.or.jp/barrierfree/pictogram/picto_top2020.html" target="_blank">出自公益财团法人 交通生态与机动性财团(Foundation for Promoting Personal Mobility and Ecological Transportation)</a>网页</p>
</div>
</section>
<script type="text/javascript">
<!--
includeFoot();
//-->
</script>
</body>
</html>
\ No newline at end of file
@charset "UTF-8";
h3 {
font-weight: bold;
font-size: 20px;
text-align: left;
}
p, .second .block > p {
text-align: left;
margin-top: 20px;
margin-bottom: 20px;
}
.owner_menu p {
margin-bottom: 50px;
}
.owner_menu ul{
text-align: center;
width: 29.5em;
margin: 0 auto;
}
.owner_menu li {
display: block;
float: left;
width: 14em;
border: solid 2px #f5b5aa;
line-height: 1.4;
margin-left: 1em;
margin-top: 30px;
white-space: nowrap;
}
.owner_menu li a {
display: block;
padding: 8px;
font-weight: bold;
}
.owner_menu li a, .owner_menu li span {
color: #e9573e;
font-family: Arial, Helvetica Verdana;
font-stretch: condensed;
}
.owner_menu li:first-child {
margin-left: 0;
}
.owner_menu li span {
position: absolute;
left: 4px;
top: -25px;
font-size: 28px;
}
.label{
overflow: hidden;
display: flex;
margin-bottom: 1em;
border-bottom: 1px solid #ccc;
}
.label li{
width: 49.9%;
padding-bottom: 10px;
border-right: 1px solid #ccc;
border-top: 1px solid #ccc;
}
.label li:nth-child(1),
.label li:nth-child(3){
border-left: 1px solid #ccc;
}
.label li strong{
display: block;
width: 100%;
background: #666;
color: #fff;
padding: .5em 0;
margin-bottom: 1em;
}
.label li p{
width: 90%;
margin: 5px auto;
text-align: left;
}
.label li span{
display: block;
font-size: 85%;
}
.label li a{
display: block;
text-align: left;
margin: 5px 0 0 15px;
color: #e9573e;
font-weight: bold;
}
.label li a:hover{
text-decoration: underline;
}
.label div{
margin-top: 10px;
}
.mb40{
margin-bottom: 40px;
border-bottom: 1px solid #ccc;
}
#kigou{
width: 100%;
overflow: hidden;
margin: 20px 0 40px 20px;
}
#kigou dt{
width: 180px;
float: left;
box-sizing: border-box;
}
#kigou dd{
margin-left: auto;
text-align: left;
}
#kigou dd:after{
display: block;
content: "";
clear: both;
}
#kigou strong{
display: block;
}
@media screen and (max-width: 640px) {
h3{
margin-left: .75em;
}
#kigou{
margin: 1em 0 0 0;
}
#kigou dt{
max-width: 120px;
width: 30%;
float: left;
}
#kigou dt img{
width: 80%;
height: auto;
}
#kigou dd{
width: 68%;
margin-left: auto;
border-left: none;
margin-bottom: 1em;
}
}
/* 0-640px ----------------------------------------*/
@media screen and (max-width:640px){
.owner_menu ul {
margin: 0 auto 0 2%;
}
.owner_menu li {
width: 36%;
margin-bottom: 4px;
margin-left: 1%;
white-space: inherit;
font-size: 13px;
line-height: 1.2;
padding: 8px 0 5px 0;
}
.owner_menu li:first-child {
margin-left: 1%;
}
.owner_menu li span {
top: -21px;
font-size: 26px;
}
.owner_menu.foot_menu {
margin-bottom: 50px;
}
}
#use ul {
margin-bottom: 20px;
}
#use li {
display: block;
width: 31.3%;
float: left;
text-align: left;
margin-left: 3%;
margin-bottom: 40px;
}
#use li:first-child {
margin-left: 0;
}
#use li img {
width: 100%;
}
br.sp{
display: none;
}
@media screen and (max-width:640px){
.label{
display: block;
border: none;
}
.label li{
float: none;
display: block;
clear: both;
width: 92%;
margin: 1px auto 30px auto;
border: none;
}
.label li:nth-child(1),
.label li:nth-child(3){
border-left: none;
}
.label li img{
width: 100%;
height: auto;
}
#use li {
float: none;
display: block;
clear: both;
width: 92%;
margin: 1px auto 30px auto;
}
#use li p {
margin: 10px 0;
}
#use li:first-child {
margin-left: auto;
}
#use li h3 {
margin: 0;
}
br.sp{
display: block;
}
}
\ No newline at end of file
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
......@@ -3,26 +3,32 @@
#facility ul {
padding: 50px 0;
}
#facility ul:after {
content: "";
display: block;
clear: both;
}
#facility li {
display: inline-block;
width: 16.6%;
float: left;
text-align: center;
}
#facility li div {
width: 99%;
}
#facility li strong {
display: block;
}
#facility li img {
width: 100%;
}
#cleaning {
border: solid 1px #ec6b55;
position: relative;
......@@ -33,24 +39,28 @@
margin-top: 50px;
margin-bottom: 50px;
}
#cleaning:after {
content: "";
display: block;
position: absolute;
z-index:-1;
z-index: -1;
top: 3px;
left: 3px;
right: -5px;
bottom: -5px;
border: 1px solid #dcdcdc;
}
#cleaning h2 {
font-size: 20px;
font-weight: bold;
}
#cleaning p {
width: 66%;
}
#guide h2 {
background-color: #7f7f7f;
color: #fff;
......@@ -58,31 +68,37 @@
margin-bottom: 0;
margin-top: 20px;
}
#guide .guide_eg {
border: solid 1px #ccc;
padding: 30px 10px 20px 10px;
margin-bottom: 20px;
position: relative;
}
#guide #letter li {
display: inline-block;
width: 17%;
padding-bottom: 20px;
}
#guide #letter li img {
max-width: 116px;
width: 100%;
}
#guide #letter li:before {
content: "-";
color: #ed638a;
font-weight: bold;
margin-right: 6px;
}
#guide ul#sign {
display: block;
height: 115px;
}
#guide #sign li {
display: block;
position: absolute;
......@@ -91,66 +107,92 @@
width: 106px;
border-radius: 5px;
}
#guide #sign li img {
width: 58%;
}
#guide #sign li:first-child {
left: 30px;
}
#guide #sign li:nth-child(2) {
left: 152px;
}
#guide #sign li:nth-child(3) {
width: 185px;
left: 274px;
height: 77px;
}
#guide #sign li:nth-child(3) img {
width: 95%;
margin-top: 12px;
}
#guide #sign li:nth-child(4) {
width: 272px;
left: 476px;
height: 77px;
background-color: #666;
}
#guide #sign li:nth-child(4) img {
width: 67%;
margin-top: 12px;
}
#guide #sign li:nth-child(5) {
left: 152px;
}
#guide #sign li:nth-child(6) {
left: 274px;
}
#guide #sign li:nth-child(7) {
left: 396px;
}
#guide #sign li:nth-child(8) {
left: 518px;
}
#guide #sign li:nth-child(9) {
left: 641px;
width: 186px;
}
#guide #sign li:nth-child(9) img {
width: 90%;
}
#guide #sign li:nth-child(10) {
right: 28px;
clear: both;
}
#guide ul#sign:after {
content: "";
display: block;
clear: both;
}
.label li {
text-align: center;
}
.label li a {
display: block;
text-align: center;
margin: 5px 0 15px 15px;
color: #e9573e;
font-weight: bold;
}
/* 0-640px ----*/
@media screen and (max-width:640px){
@media screen and (max-width:640px) {
#facility li {
float: none;
display: block;
......@@ -158,47 +200,58 @@
width: 92%;
margin: 1px auto;
}
#facility li:after {
content: "";
display: block;
clear: both;
}
#facility li strong {
position: absolute;
display: block;
text-shadow: 1px 1px 2px #fff;
}
#facility li img {
display: block;
width: 30%;
float: left;
margin-right: 1px;
}
#facility li img:first-child {
margin-left: 39%;
}
#cleaning {
background-position: center 95%;
width: 86%;
padding-bottom: 200px;
}
#cleaning p {
width: initial;
margin: 0 auto;
}
#guide h2 {
margin-left: 4%;
}
#guide .guide_eg {
margin-left: 4%;
margin-right: 4%;
}
#guide #letter li {
width: 48%;
}
#guide ul#sign {
height: inherit;
}
#guide #sign li {
position: inherit;
display: inline-block;
......@@ -206,13 +259,19 @@
margin-bottom: 12px;
pading: 4% 0;
}
#guide #sign li:nth-child(3), #guide #sign li:nth-child(4), #guide #sign li:nth-child(9) {
#guide #sign li:nth-child(3),
#guide #sign li:nth-child(4),
#guide #sign li:nth-child(9) {
width: 85.2%;
height: auto;
}
#guide #sign li:nth-child(3) img, #guide #sign li:nth-child(4) img {
#guide #sign li:nth-child(3) img,
#guide #sign li:nth-child(4) img {
margin-top: 0;
}
#guide #sign li:nth-child(10) {
margin-left: 7.4%;
float: left;
......@@ -223,4 +282,3 @@
}
......@@ -72,6 +72,16 @@ includeHead2('div');
</div>
</div>
</section>
<section>
<ul class="label">
<li>
其他厕所相关的游览标识将在此页进行说明。<br>
<a href="/utsukushitoilet/cn_s/owner/02.html">⇨前往「厕所相关游览用图符号的种类与含义」页面</a>
</li>
</ul>
</section>
<script type="text/javascript" >
<!--
includeFoot();
......
<!DOCTYPE html>
<html lang="ja" prefix="og: http://ogp.me/ns#">
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta charset="UTF-8">
<meta name="keywords" content="">
<meta name="description" content="">
<title>廁所相關的導覽用符號的種類與含義 - JAPAN TOILET INFORMATION -NIPPON UTSUKUSHI TOILET-</title>
<link rel="stylesheet" href="/utsukushitoilet/shared/css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="/utsukushitoilet/shared/css/common_jp.css" type="text/css" media="all">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all">
<script type="text/javascript" src="/utsukushitoilet/shared/js/jquery.js"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/jquery.plugin.js"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/common.js?ver=191024"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/common_parts.js?ver=191024"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".latest_menu li").autoHeight();
});
</script>
</head>
<body class="second">
<!-- google analytics -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-560401-9']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<!-- //google analytics -->
<script type="text/javascript" >
<!--
includeHead_Ja('div');
//-->
</script>
<noscript>
<p>当サイトはJavaScriptをonにしてご覧ください。</p>
</noscript>
<section class="first owner_menu">
<div class="block" id="breadcrumbs_area">
<p class="breadcrumbs"><a href="/utsukushitoilet/">TOP</a> &gt; <em>廁所相關的導覽用符號的種類與含義</em></p>
</div>
</section>
<section id="_02">
<div class="block">
<h2 class="line">廁所相關的導覽用符號的<br class="sp">種類與含義</h2>
<p>日本的廁所為了以易於了解的方式引導使用者,標示各種導覽符號來指示廁所的用途和設備。<br>
這裡將介紹這些主要導覽符號的類型及其含義。</p>
<h3>導覽用圖符號與標示的含義。</h3>
<dl id="kigou">
<dt><img src="images/kigou01.jpg" alt=""></dt><dd><strong>廁所</strong>標示廁所的位置及設備。</dd>
<dt><img src="images/kigou02.jpg" alt=""></dt><dd><strong>男子廁所</strong>標示男性用廁所的位置及設備。<br>※不限於廁所,它也可能標示男性用的設施。</dd>
<dt><img src="images/kigou03.jpg" alt=""></dt><dd><strong>女子廁所</strong>標示女性用廁所的位置及設備。<br>※不限於廁所,它也可能標示女性用的設施。</dd>
<dt><img src="images/kigou04.jpg" alt=""></dt><dd><strong>男女共用廁所</strong>標示無論性別為何均可使用,或可與看護者共同使用的廁所。</dd>
<dt><img src="images/kigou05.jpg" alt=""></dt>
<dd><strong>兒童廁所</strong>標示獨立的兒童使用的廁所。<br>
※不限於廁所,它也可能標示兒童用的設施。</dd>
<dt><img src="images/kigou06.jpg" alt=""></dt><dd><strong>殘障人士可使用的設備</strong>標示殘障人士(例如輪椅使用者等)可以使用的設備位置和存在。</dd>
<dt><img src="images/kigou07.jpg" alt=""></dt><dd><strong>電腦馬桶</strong>標示電腦馬桶的設置位置及設備。<br>這個圖形符號也表示它是一個西式廁所。</dd>
<dt><img src="images/kigou08.jpg" alt=""></dt><dd><strong>西式廁所(坐式馬桶)</strong>標示設置了西式廁所(坐式馬桶)。</dd>
<dt><img src="images/kigou09.jpg" alt=""></dt><dd><strong>日式廁所(蹲式馬桶)</strong>標示設置了日式廁所(蹲式馬桶)。</dd>
<dt><img src="images/kigou10.jpg" alt=""></dt><dd><strong>嬰幼兒用設備</strong>標示用於嬰幼兒的設施位置和設備,例如母乳餵養和更換尿布等。</dd>
<dt><img src="images/kigou11.jpg" alt=""></dt><dd><strong>換尿布台</strong>標示可以給嬰兒換尿布的設備位置和設備。</dd>
<dt><img src="images/kigou12.jpg" alt=""></dt><dd><strong>嬰兒椅</strong>標示廁所內設置的嬰幼兒固定設備。</dd>
<dt><img src="images/kigou13.jpg" alt=""></dt><dd><strong>更衣台</strong>標示廁所內的更衣設備。</dd>
<dt><img src="images/kigou14.jpg" alt=""></dt><dd><strong>人工肛門用廁所設備</strong>標示裝置人工肛門及人工膀胱者的清洗人工肛門袋等位置和設備。</dd>
<dt><img src="images/kigou15.jpg" alt=""></dt><dd><strong>簡易型人工肛門用設備</strong>標示帶有用於裝置人工肛門和人工膀胱者的清洗人工肛門袋的抽水馬桶位置和設備。</dd>
<dt><img src="images/kigou16.jpg" alt=""></dt>
<dd><strong>看護用床</strong>標示可用於多種用途的設備,例如更換尿布和提供護理等。</dd>
</dl>
<p>出處:<a href="http://www.ecomo.or.jp/barrierfree/pictogram/picto_top2020.html" target="_blank">出自公益財團法人 交通生態與機動性財團(Foundation for Promoting Personal Mobility and Ecological Transportation)</a>網頁</p>
</div>
</section>
<script type="text/javascript">
<!--
includeFoot();
//-->
</script>
</body>
</html>
\ No newline at end of file
@charset "UTF-8";
h3 {
font-weight: bold;
font-size: 20px;
text-align: left;
}
p, .second .block > p {
text-align: left;
margin-top: 20px;
margin-bottom: 20px;
}
.owner_menu p {
margin-bottom: 50px;
}
.owner_menu ul{
text-align: center;
width: 29.5em;
margin: 0 auto;
}
.owner_menu li {
display: block;
float: left;
width: 14em;
border: solid 2px #f5b5aa;
line-height: 1.4;
margin-left: 1em;
margin-top: 30px;
white-space: nowrap;
}
.owner_menu li a {
display: block;
padding: 8px;
font-weight: bold;
}
.owner_menu li a, .owner_menu li span {
color: #e9573e;
font-family: Arial, Helvetica Verdana;
font-stretch: condensed;
}
.owner_menu li:first-child {
margin-left: 0;
}
.owner_menu li span {
position: absolute;
left: 4px;
top: -25px;
font-size: 28px;
}
.label{
overflow: hidden;
display: flex;
margin-bottom: 1em;
border-bottom: 1px solid #ccc;
}
.label li{
width: 49.9%;
padding-bottom: 10px;
border-right: 1px solid #ccc;
border-top: 1px solid #ccc;
}
.label li:nth-child(1),
.label li:nth-child(3){
border-left: 1px solid #ccc;
}
.label li strong{
display: block;
width: 100%;
background: #666;
color: #fff;
padding: .5em 0;
margin-bottom: 1em;
}
.label li p{
width: 90%;
margin: 5px auto;
text-align: left;
}
.label li span{
display: block;
font-size: 85%;
}
.label li a{
display: block;
text-align: left;
margin: 5px 0 0 15px;
color: #e9573e;
font-weight: bold;
}
.label li a:hover{
text-decoration: underline;
}
.label div{
margin-top: 10px;
}
.mb40{
margin-bottom: 40px;
border-bottom: 1px solid #ccc;
}
#kigou{
width: 100%;
overflow: hidden;
margin: 20px 0 40px 20px;
}
#kigou dt{
width: 180px;
float: left;
box-sizing: border-box;
}
#kigou dd{
margin-left: auto;
text-align: left;
}
#kigou dd:after{
display: block;
content: "";
clear: both;
}
#kigou strong{
display: block;
}
@media screen and (max-width: 640px) {
h3{
margin-left: .75em;
}
#kigou{
margin: 1em 0 0 0;
}
#kigou dt{
max-width: 120px;
width: 30%;
float: left;
}
#kigou dt img{
width: 80%;
height: auto;
}
#kigou dd{
width: 68%;
margin-left: auto;
border-left: none;
margin-bottom: 1em;
}
}
/* 0-640px ----------------------------------------*/
@media screen and (max-width:640px){
.owner_menu ul {
margin: 0 auto 0 2%;
}
.owner_menu li {
width: 36%;
margin-bottom: 4px;
margin-left: 1%;
white-space: inherit;
font-size: 13px;
line-height: 1.2;
padding: 8px 0 5px 0;
}
.owner_menu li:first-child {
margin-left: 1%;
}
.owner_menu li span {
top: -21px;
font-size: 26px;
}
.owner_menu.foot_menu {
margin-bottom: 50px;
}
}
#use ul {
margin-bottom: 20px;
}
#use li {
display: block;
width: 31.3%;
float: left;
text-align: left;
margin-left: 3%;
margin-bottom: 40px;
}
#use li:first-child {
margin-left: 0;
}
#use li img {
width: 100%;
}
br.sp{
display: none;
}
@media screen and (max-width:640px){
.label{
display: block;
border: none;
}
.label li{
float: none;
display: block;
clear: both;
width: 92%;
margin: 1px auto 30px auto;
border: none;
}
.label li:nth-child(1),
.label li:nth-child(3){
border-left: none;
}
.label li img{
width: 100%;
height: auto;
}
#use li {
float: none;
display: block;
clear: both;
width: 92%;
margin: 1px auto 30px auto;
}
#use li p {
margin: 10px 0;
}
#use li:first-child {
margin-left: auto;
}
#use li h3 {
margin: 0;
}
br.sp{
display: block;
}
}
\ No newline at end of file
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
......@@ -3,26 +3,32 @@
#facility ul {
padding: 50px 0;
}
#facility ul:after {
content: "";
display: block;
clear: both;
}
#facility li {
display: inline-block;
width: 16.6%;
float: left;
text-align: center;
}
#facility li div {
width: 99%;
}
#facility li strong {
display: block;
}
#facility li img {
width: 100%;
}
#cleaning {
border: solid 1px #ec6b55;
position: relative;
......@@ -33,24 +39,28 @@
margin-top: 50px;
margin-bottom: 50px;
}
#cleaning:after {
content: "";
display: block;
position: absolute;
z-index:-1;
z-index: -1;
top: 3px;
left: 3px;
right: -5px;
bottom: -5px;
border: 1px solid #dcdcdc;
}
#cleaning h2 {
font-size: 20px;
font-weight: bold;
}
#cleaning p {
width: 66%;
}
#guide h2 {
background-color: #7f7f7f;
color: #fff;
......@@ -58,31 +68,37 @@
margin-bottom: 0;
margin-top: 20px;
}
#guide .guide_eg {
border: solid 1px #ccc;
padding: 30px 10px 20px 10px;
margin-bottom: 20px;
position: relative;
}
#guide #letter li {
display: inline-block;
width: 17%;
padding-bottom: 20px;
}
#guide #letter li img {
max-width: 116px;
width: 100%;
}
#guide #letter li:before {
content: "-";
color: #ed638a;
font-weight: bold;
margin-right: 6px;
}
#guide ul#sign {
display: block;
height: 115px;
}
#guide #sign li {
display: block;
position: absolute;
......@@ -91,66 +107,92 @@
width: 106px;
border-radius: 5px;
}
#guide #sign li img {
width: 58%;
}
#guide #sign li:first-child {
left: 30px;
}
#guide #sign li:nth-child(2) {
left: 152px;
}
#guide #sign li:nth-child(3) {
width: 185px;
left: 274px;
height: 77px;
}
#guide #sign li:nth-child(3) img {
width: 95%;
margin-top: 12px;
}
#guide #sign li:nth-child(4) {
width: 272px;
left: 476px;
height: 77px;
background-color: #666;
}
#guide #sign li:nth-child(4) img {
width: 67%;
margin-top: 12px;
}
#guide #sign li:nth-child(5) {
left: 152px;
}
#guide #sign li:nth-child(6) {
left: 274px;
}
#guide #sign li:nth-child(7) {
left: 396px;
}
#guide #sign li:nth-child(8) {
left: 518px;
}
#guide #sign li:nth-child(9) {
left: 641px;
width: 186px;
}
#guide #sign li:nth-child(9) img {
width: 90%;
}
#guide #sign li:nth-child(10) {
right: 28px;
clear: both;
}
#guide ul#sign:after {
content: "";
display: block;
clear: both;
}
.label li {
text-align: center;
}
.label li a {
display: block;
text-align: center;
margin: 5px 0 15px 15px;
color: #e9573e;
font-weight: bold;
}
/* 0-640px ----*/
@media screen and (max-width:640px){
@media screen and (max-width:640px) {
#facility li {
float: none;
display: block;
......@@ -158,47 +200,58 @@
width: 92%;
margin: 1px auto;
}
#facility li:after {
content: "";
display: block;
clear: both;
}
#facility li strong {
position: absolute;
display: block;
text-shadow: 1px 1px 2px #fff;
}
#facility li img {
display: block;
width: 30%;
float: left;
margin-right: 1px;
}
#facility li img:first-child {
margin-left: 39%;
}
#cleaning {
background-position: center 95%;
width: 86%;
padding-bottom: 200px;
}
#cleaning p {
width: initial;
margin: 0 auto;
}
#guide h2 {
margin-left: 4%;
}
#guide .guide_eg {
margin-left: 4%;
margin-right: 4%;
}
#guide #letter li {
width: 48%;
}
#guide ul#sign {
height: inherit;
}
#guide #sign li {
position: inherit;
display: inline-block;
......@@ -206,13 +259,19 @@
margin-bottom: 12px;
pading: 4% 0;
}
#guide #sign li:nth-child(3), #guide #sign li:nth-child(4), #guide #sign li:nth-child(9) {
#guide #sign li:nth-child(3),
#guide #sign li:nth-child(4),
#guide #sign li:nth-child(9) {
width: 85.2%;
height: auto;
}
#guide #sign li:nth-child(3) img, #guide #sign li:nth-child(4) img {
#guide #sign li:nth-child(3) img,
#guide #sign li:nth-child(4) img {
margin-top: 0;
}
#guide #sign li:nth-child(10) {
margin-left: 7.4%;
float: left;
......@@ -223,4 +282,3 @@
}
......@@ -72,6 +72,16 @@ includeHead2('div');
</div>
</div>
</section>
<section>
<ul class="label">
<li>
其他廁所相關的導覽標示將在此頁進行說明。<br>
<a href="/utsukushitoilet/cn_t/owner/02.html">⇨前往「廁所相關導覽用圖符號的種類與含義」頁面</a>
</li>
</ul>
</section>
<script type="text/javascript" >
<!--
includeFoot();
......
<!DOCTYPE html>
<html lang="ja" prefix="og: http://ogp.me/ns#">
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta charset="UTF-8">
<meta name="keywords" content="">
<meta name="description" content="">
<title>Types of Guide Symbols for Toilets and their Meanings - JAPAN TOILET INFORMATION -NIPPON UTSUKUSHI TOILET-</title>
<link rel="stylesheet" href="/utsukushitoilet/shared/css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="/utsukushitoilet/shared/css/common_jp.css" type="text/css" media="all">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all">
<script type="text/javascript" src="/utsukushitoilet/shared/js/jquery.js"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/jquery.plugin.js"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/common.js?ver=191024"></script>
<script type="text/javascript" src="/utsukushitoilet/shared/js/common_parts.js?ver=191024"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".latest_menu li").autoHeight();
});
</script>
</head>
<body class="second">
<!-- google analytics -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-560401-9']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<!-- //google analytics -->
<script type="text/javascript" >
<!--
includeHead_Ja('div');
//-->
</script>
<noscript>
<p>当サイトはJavaScriptをonにしてご覧ください。</p>
</noscript>
<section class="first owner_menu">
<div class="block" id="breadcrumbs_area">
<p class="breadcrumbs"><a href="/utsukushitoilet/">TOP</a> &gt; <em>Types of Guide Symbols for Toilets and their Meanings</em></p>
</div>
</section>
<section id="_02">
<div class="block">
<h2 class="line">Types of Guide Symbols for <br class="sp">Toilets and their Meanings</h2>
<p>Various guide symbols are displayed to indicate the purpose and equipment of Japanese toilets in an easy-to-understand way for users.<br>
We will introduce the main types of guide symbols and their meanings.</p>
<h3>Guide Symbols Display and Meanings</h3>
<dl id="kigou">
<dt><img src="images/kigou01.jpg" alt=""></dt><dd><strong>Restrooms</strong>Indicates location of Restrooms and Facilities</dd>
<dt><img src="images/kigou02.jpg" alt=""></dt><dd><strong>Men’s Restrooms</strong>Indicates location of Men’s Restrooms and Facilities<br>*May indicate facilities for men, not limited to restrooms</dd>
<dt><img src="images/kigou03.jpg" alt=""></dt><dd><strong>Women’s Restrooms</strong>Indicates location of Women’s Restrooms and Facilities<br>*May indicate facilities for women, not limited to restrooms</dd>
<dt><img src="images/kigou04.jpg" alt=""></dt><dd><strong>Restrooms for use by both Men and Women</strong>Indicates Restrooms that do not discriminate between Men and Women and also restrooms for people under nursing care with their helpers.</dd>
<dt><img src="images/kigou05.jpg" alt=""></dt>
<dd><strong>Children’s Restrooms</strong>Indicates Restrooms for Children who can use them on their own.<br>
*May indicate facilities for children, not limited to restrooms</dd>
<dt><img src="images/kigou06.jpg" alt=""></dt><dd><strong>Facilities that can be used by people with disabilities</strong>Shows the location and existence of facilities that can be used by people with disabilities, such as people using wheelchairs.</dd>
<dt><img src="images/kigou07.jpg" alt=""></dt><dd><strong>Warm Water Bidet Toilet Seat</strong>Show the location and facilities of the warm water bidet toilet seats.<br>This symbol also indicates that it is a Western-style toilet.</dd>
<dt><img src="images/kigou08.jpg" alt=""></dt><dd><strong>Western-style toilet (seat-type toilet)</strong>Indicates that a Western-style toilet (seat-type toilet) is installed.</dd>
<dt><img src="images/kigou09.jpg" alt=""></dt><dd><strong>Japanese-style toilet (squat-type toilet)</strong>Indicates that a Japanese-style toilet (squat-type toilet) is installed.</dd>
<dt><img src="images/kigou10.jpg" alt=""></dt><dd><strong>Facilities for Infants</strong>Shows the location and facilities for use with infants, such as breastfeeding and changing diapers.</dd>
<dt><img src="images/kigou11.jpg" alt=""></dt><dd><strong>Diaper Changing Table</strong>Shows the location and facilities where diapers of infants can be changed.</dd>
<dt><img src="images/kigou12.jpg" alt=""></dt><dd><strong>Baby Chair</strong>Show a fixed baby chair is inside the restroom.</dd>
<dt><img src="images/kigou13.jpg" alt=""></dt><dd><strong>Changing Table</strong>Shows facilities for changing clothes are in the restroom.</dd>
<dt><img src="images/kigou14.jpg" alt=""></dt><dd><strong>Facilities for Ostomate</strong>Shows location and facilities for pouch (colostomy bags) washing for people with artificial anuses and artificial bladders.</dd>
<dt><img src="images/kigou15.jpg" alt=""></dt><dd><strong>Facilities for Simple Ostomate</strong>Shows the location and facilities of toilets equipped for pouch (colostomy bags) washing for people with artificial anus and artificial bladder.</dd>
<dt><img src="images/kigou16.jpg" alt=""></dt>
<dd><strong>Nursing Care Bed</strong>Shows facilities for multi-purpose use such as changing diapers and provide nursing care.</dd>
</dl>
<p>Source:<a href="http://www.ecomo.or.jp/barrierfree/pictogram/picto_top2020.html" target="_blank">Website of the Foundation for Promoting Personal Mobility and Ecological Transportation</a></p>
</div>
</section>
<script type="text/javascript">
<!--
includeFoot();
//-->
</script>
</body>
</html>
\ No newline at end of file
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment