@charset "UTF-8";

body{
}

img,div,a{
	line-height: 1;
	margin: 0px;
	padding: 0px;
	border:none;
}

#wrappar{
	max-width:1500px;
	width:100%;
	margin:0 auto;
}

.title{
	margin-top: 3%;
	float: left;
	background: url("front-01.gif") repeat-y top #ffffff;
	width:100%;

}

iframe{
width:100%;
}

.fl3l{
float:left;
max-width:375px;
width: 100%;
background: url("../start/sptakuann.png");

}

.fl3l p{
  text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;
  color: white;
  font: 1.3em/500% Georgia, serif;
}

.fl3r{
float:left;
max-width:400px;
width: 100%;
max-height:500px;
height:100%;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
text-align:left;
font: 1.3em/300% Georgia, serif;
}
.fl3r h1{
  font-size: 30px;
  margin-left: 1%;
  font: 200%/200% Georgia, serif;

}

.fl3r p{
line-height: 1.7;
  margin-left: 20px;
  font: 100%/150% Georgia,serif;
padding-top:5%;

}

.fl3b{
float:left;
max-width:1250px;
width: 100%;

}

.header{
margin:0 auto;
max-width: 1400px;
width: 100%;
display: inline-block;

}

.menu{
max-width: 1400px;
display: inline-block;
width: 100%;

}

.top_img_logo{

}


.top_img_logo img{
margin:auto;
display:block;
width:40%;
padding:5%;
}


p.tpi{
position: relative;
float: left;
}

pre {
white-space: pre-wrap ;
text-align: left;
}

.contents{
  /* �摜�t�@�C���̎w�� */
  background-image: url(../main1.png);
  /* �摜���^�C����ɌJ��Ԃ��\�����Ȃ� */
  background-repeat: no-repeat;
  /* �\������R���e�i�̑傫���Ɋ�Â��āA�w�i�摜�𒲐� */
  background-size: contain;
  position: relative;
  top: 10%;
}


.top{
	max-width: 100%;
	padding-top: 5%;
}

.top2{
	max-width: 100%;
}

.top3{
	max-width: 100%;
}

.otk {
  background-image: url(../tsukemono/tsukemono.jpg);
  background-repeat: no-repeat;
  width: 100%;
  max-width: 1500px;
  margin: 0 auto;
}
.otk pre{
  white-space: pre-wrap;
  text-align: left;
  width: 100%;
  max-width: 608px;
  margin: 0 auto;
  padding-top: 5%;
  text-align: left;
  font: 1.0em/100% Georgia, serif;
  text-decoration-color: blue;
  color: black;
  text-shadow: 2px 2px 3px white;
}

img,div,a{
	line-height: 1;
	margin: 0px;
	padding: 0px;
	border:none;
}

#wrappar{
	width:100%;
	margin:0 auto;
}


.header{
margin-top: 5%;
max-height: 260px;
max-width:960px;
width:100%;
height: 100%;
display: inline-block;
}

.menu{
max-width: 341px;
display: none;
}

.title{
	margin-top: 3%;
	float: left;
	background: url("front-01.gif") repeat-y top #ffffff;
	width:100%;
}

.topics{

}

.top{
	max-width: 100%;
	padding-top: 5%;
}

.top2{
	max-width: 100%;
}

.top3{
	max-width: 100%;
}


.notice-box {
  background: #ffecec;
  border: 2px solid #ff0000;
  padding: 10px;
  margin: 10px 0;
}
.notice-title {
  font-weight: bold;
  color: #ff0000;
  font-size: 1.2em;
  margin-bottom: 5px;
}
.notice-text {
  color: #333;
  font-size: 1em;
}