@charset "UTF-8";
/* CSS Document */

body {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans",
               "Yu Gothic UI", "Yu Gothic", "Meiryo",
               -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.8; 
  color: #222;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a {color:#ed0e74;text-decoration: underline;}
a:hover{color:#e95b9c;}
section {padding:0 10px 40px 10px;}
.red {color: #ff0000;}
.blue {color: #00bfff;}
.green {color: #008000;}
.pink {color: #ff1493;}
.mb100{margin-bottom:100px;}
.txt-16{font-size: 16px;}
.txt-18{font-size: 18px;}
.txt-bold{font-weight: 700;}


/*TITLE*/
.top-banner{
	border-top:6px solid #e95b9c;
	border-bottom:6px solid #e95b9c;
margin-bottom:20px;}
.top-banner-p{
	border-top:6px solid #ffd700;
}
.top-title{
padding: 2.5rem 0 1.5rem;
    background-image: linear-gradient(90deg, #fff 0% 40%, #333 40% 60%, white 60%);
    background-repeat: no-repeat;
    background-size: 100% 0.2rem;
    background-position: bottom;
    color: #353535;
    font-weight: 700;
    font-size: 30px;
    text-align: center;
}

.sub-title{
	font-size:28px!important;
	color:#6bb2b4;
	font-weight:700;
	line-height:1.5;
	margin:20px 0;
	border-top: 4px double #6bb2b4;
	border-bottom: 4px double #6bb2b4;
	padding:20px 0;
	
}

/*HEADING*/
#meguro h2 {
  font-size:22px;
font-weight: 700;
  line-height: 180%;
}

#meguro h3 {
	font-weight: 700;
  
}
#meguro h4 {
  font-weight: 500;
line-height:150%;
}

#meguro h5 {
  font-size: 16px;
  font-weight: 700;
text-align:center;
}

/*TABLE*/
.info{width:100%;}
.info tr th{
	border-collapse: collapse;
    border:1px solid #333;
	width:20%;
	font-size:18px;
	text-align: left;
	padding:20px;
	background-color: gainsboro;
}
.info tr td{
	border-collapse: collapse;
    border:1px solid #333;
	font-size:18px;
	text-align: left;
	padding:40px;
}
/*.info tr td span{
	font-size:14px;
}*/


.table-wrap{
	width:90%;
	margin:40px auto;
}
.table-wrap2{
	width:60%;
	margin:40px auto;

}
.meguru-box{
	border:4px solid #a9a9a9;
border-radius: 10px;}

.ul-wrap{
	width:90%;
	margin:40px auto;
}


/*FOOTER*/
footer.f-info{
	background-color: aliceblue;
	padding:20px;
	font-size:14px;
}

/*BUTTON*/
.button {
	display:inline-block;
	padding:25px;
	text-align: center;
	text-decoration: none;
	outline: none;
	background-color: #00bfff;
	border: 2px solid #00bfff;
	border-radius:50px;
	color: #fff;
	font-size:18px;
	font-weight:700;
	margin:20px 0;
	
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	content: '';
	display:inline-block;
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.button:hover {
	background-color: #fff;
	border-color: #00bfff;
	color: #00bfff;
	text-decoration: none;
}
.button_pink{
	display:inline-block;
	padding:20px;
	text-align: center;
	text-decoration: none;
	outline: none;
	background-color: #ff1493;
	border: 2px solid #ff1493;
	border-radius:10px;
	color: #fff;
	font-size:18px;
	font-weight:700;
	margin:20px 0;
	
}
.button_pink::before,
.button_pink::after {
	position: absolute;
	z-index: -1;
	content: '';
	display:inline-block;
}
.button_pink,
.button_pink::before,
.button_pink::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.button_pink:hover {
	background-color: #fff;
	border-color: #ff1493;
	color: #ff1493;
	text-decoration: none;
}
.button_yellow{
	display:inline-block;
	padding:10px;
	text-align: center;
	text-decoration: none;
	outline: none;
	background-color: #ffd700;
	border: 2px solid #ffd700;
	border-radius:10px;
	color: #333;
	font-size:16px;
	font-weight:700;
	margin:0 0 20px 0;
	
}
.button_yellow::before,
.button_yellow::after {
	position: absolute;
	z-index: -1;
	content: '';
	display:inline-block;
}
.button_yellow,
.button_yellow::before,
.button_yellow::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.button_yellow:hover {
	background-color: #fff;
	border-color: #ffd700;
	color: #333;
	text-decoration: none;
}
.button_yellow_n{
	display:inline-block;
	padding:10px;
	text-align: center;
	text-decoration: none;
	outline: none;
	background-color: #ffffff;
	border: 2px solid #ffd700;
	border-radius:10px;
	color: #333;
	font-size:16px;
	font-weight:700;
	margin:0 0 20px 0;
	
}
i.fa-caret-right{padding-left:10px;}

/*NOTICE*/
ol {
  list-style: none;
}
ol.nonbiri {
  counter-reset:number;
  padding: 1.6em;
border:4px solid #ffd700;
  border-radius: 10px;
  background: beige;
	margin: 40px 0;
}
ol.nonbiri li{
font-size: 16px;
font-weight:700;
  position: relative;
  line-height: 1.8em;
  padding: 1em 1em 1em 2.5em;
  margin-left:0 !important;
}

ol.nonbiri li:before{
 position: absolute;
  counter-increment: number;
  content: counter(number);
  display:inline-block;
  background: #ffd700;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 16px;
  border-radius: 50%;
  left: 0;
  width: 26px;
  height: 26px;
  line-height: 26px;
  text-align:center;
 
}


.howto h2 {
	color: #ff1493;
	background-color: lavenderblush;
	font-size:22px;
	font-weight: 700;
	line-height: 160%;
	padding:20px;
	border-radius: 10px;
	margin-bottom: 20px;
}
.howto p{font-size:16px;}

/*BOX*/
.box {
	font-size: 18px;
	position: relative;
    margin: 2em 0;
    padding: 2em 2em 1em;
    border: solid 3px #a9a9a9;
	border-radius:0 10px 10px;
}

.box .box-title {
    position: absolute;
    display: inline-block;
	width:30%;
    top: -30px;
    left: -15px;
    padding: 0 18px;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
	font-weight: 700;
    background: #ffd700;
    color: #333333;
	border-radius: 5px;
	/*border-radius: 5px 5px 0 0;*/
}

.box p {
    margin: 0; 
    padding: 0;
}
.box ul {
padding-left:10px;
padding-bottom:0;
}

.box ul li{
padding-bottom:10px;
}



@media screen and (max-width: 768px)  {
section { padding:0 10px 20px 10px;}
.top-title{ font-size:20px;}
.sub-title{ font-size:16px !important;}
#meguro h2 {
  font-size:18px;
  line-height: 160%;
}
#meguro h3 {font-size:16px;}
#meguro h4 {font-size:16px !important;}
.table-wrap{
	width:100%;
	margin:0;
}
.table-wrap2{
	width:100%;
	margin:20px 0;
}
.ul-wrap{
	width:100%;
	margin:20px 0;
}
.info tr th{
	width:25%;
	padding:10px;
	font-size:14px;
}
.info tr td{
font-size:14px;
padding:10px;
	
}
.info tr td span{
	font-size:12px;
}
.mb100{margin-bottom:50px;}
.menu01{font-size:14px;}
	
ul{margin-left:0;padding-left:10px;}
ol.nonbiri {
  padding:  0.5em;
 }
	
.box {
	font-size: 16px;
	
}
.box .box-title {
width:50%;
font-size: 16px;
}
.button {
	font-size:16px;
}
.button_pink {
	font-size:16px;
}
	#sumanyan img {
		width:70%;
	}
}


 /* 20211022 */

.map h1 {
	margin-bottom: 80px;
}

.map h2,.map h2 a {
	font-size: 26px!important;
	text-align: center;
	background-color: #ffd700;
	color:#333;
	border-bottom: 2px solid #a9a9a9;
	margin-bottom: 60px;
	padding:13px 0;
}
.map .map_area img {
	image-rendering: -webkit-optimize-contrast;
}
@media screen and (max-width: 768px)  {
	.map h1 {
		margin-bottom: 40px;
	}
	.map h2 {
		font-size: 16px!important;
		margin-bottom: 16px;
	}
}

.howto_app .howto_txt {
	margin-top: 80px;
}
.howto_app .row-eq-height {
	margin-bottom: 80px;
}
.howto_app h1 {
	margin-bottom: 80px;
}
.howto_app p {
	margin-bottom: 40px;
}

.howto_app img {
	image-rendering: -webkit-optimize-contrast;
}
@media screen and (max-width: 768px)  {
	.howto_app h1 {
		margin-bottom: 40px;
	}

	.howto_app .mt80 {
		margin-top: 80px;
	}
	.howto_app h-100 {

	}

}


.info {
	position: relative;
	margin: 2em 0;
	padding: 2em;
	border: solid 2px #000;
	border-radius:0 10px 10px;

}
.info .box-title {
	position: absolute;
	display: inline-block;
	top: -30px;
	left: -3px;
	padding: 0 18px;
	height: 30px;
	line-height: 30px;
	font-size: 17px;
	font-weight: 500;
	background: #e95b9c;
	color: #ffffff;
	border-radius: 5px 5px 0 0;
}

 /* 20220901 */
.menu01{
	width:16.6%;
	text-align: center;
	background: #ffd700;
	border-top: 2px solid #a9a9a9;
	border-right: 2px solid #a9a9a9;
	border-bottom: 2px solid #a9a9a9;
    padding:10px;
	font-size:15px;
	color:#333!important;
	font-weight:700;

}
.menu01 a{display: block;color:#333!important; text-decoration: none;}
i.fa-caret-down{padding-left:10px;}

.menu01.first{
	text-align: center;
	align-items: center;
	background: #ffd700;
    align-content: flex-start;
	border: 2px solid #a9a9a9;
	padding:10px;
	font-size:15px;
	color:#333!important;
	font-weight:700;

}
@media screen and (max-width: 768px)  {
	.menu01{
	width:100%;
	border: 2px solid #a9a9a9;
	margin-bottom: 10px;
	}

}
#about{
background-color: beige;
padding:20px;
border-radius: 30px;}

#pagetop {
display: none;
position: fixed;
bottom: 40px;
right: 20px;
width: 44px;
height: 44px;
border-radius: 22px;
z-index: 10;
transition: background-color 400ms;
background: rgba(255,20,147,0.85) url(img/pagetop.png) 50% 45% no-repeat;
text-indent: 100% !important;
white-space: nowrap;
overflow: hidden;
}