@charset "UTF-8";

@media screen and (max-width: 640px){

/* Table -----------------------------------------------------------*/

/*LayOut*/
table { border-collapse:collapse;
  font-size:100%;
  width:98%; }
	

/* --------------------------------------------------------------------------- */
body{
 text-align:center;
 color:#153203;
 background:url(../img/bg_body.gif) repeat-x #931414;
 font-size:73%;
}

#wrapper { width:100%;
 margin:0px auto;
 background:none;
}
#container { width:100%;
 margin:0px auto;
 text-align:left;
}

/* --------------------------------------------------------------------------- */
#header{ width:100%;
 height:73px;
 background:url(../img/sp_bg_header.png) no-repeat 10px center #911414;
 background-size:70%;
 margin:0px auto;
 position:fixed;
 z-index:8;
 text-align:left;
}
#logo{
 text-indent:-9999px;
 font-size:0;
}
#logo a { width:220px;
 height:50px;
 display: block;
 margin:0 0 0 0; }


/* --------------------------------------------------------------------------- */

#main{ 
 width:100%;
 margin:73px 0 10px 0;
 text-align:center;
 background-color:#9cbc39; }
.maindetail{ margin:0 15px 0 15px; }

.maindetail p, .maindetail ul, .maindetail dl { text-align:left; }

#right{ width:100%; margin:0 auto; text-align:center; }


.pagetop{ font-size:75%;
 text-align:right; }
  
#menu { display:none; }

#newsflame {
	width:100%;
	height: auto;
	text-align:left; }
 
 
/* --------------------------------------------------------------------------- */

#footer{
 background-image:none;
 margin:-10px auto 0 auto;
 width:100%;
 background:url(../img/sp_bg_footer.png) no-repeat center bottom;
 background-size:90%;
} 
#fmenu{ 
 color:#555555;
 padding:5px 0 0 0;
 font-size:11px;
 line-height:1.5;
 letter-spacing:0.5px;
 text-align:center;
}
address{ color:#666;
 font-size:10px;
 font-family : Arial, Helvetica, sans-serif;
 line-height:15px;
 letter-spacing:0.5px;
 margin:15px 0 10px 0;
 font-style:normal; }



/* H ---------------------------------------------------------------*/

h1 { margin:5px 10px 0 0;
 text-align:right;
 font-size:10px;
 color:#666666;
 font-weight:normal;
}

h2 { background: url(../img/oc-logo.png) no-repeat right center #FECF2E;
background-size:30px auto;
border-bottom: solid 2px #B01717;
color:#931414;
margin:0 0 15px 0;
padding:6px 8px 4px 8px;
font-size:14px;
text-align:left; }

h3{ color:#e9e9ea;
 padding:4px 10px 5px 10px;
 margin:30px 0 10px 0;
 background-color:#0a467c;
 font-size:13px;
 text-align:left; }
h3:first-child { margin-top:0px; }

h4{
	color:#664729;
	border-left:5px solid #664729;
	border-bottom:dotted 1px #664729;
	padding:3px 6px;
	letter-spacing:0.5px;
	margin:20px 0 10px 0;
	font-size:13px;
	text-align:left;
}

h5{
	color:#555;
	border-left:5px solid #555;
	padding:3px 6px;
	letter-spacing:0.5px;
	margin:20px 0 10px 0;
	font-size:13px;
	text-align:left;
}


/* --------------------------------------------------------------------*/
.none{ display:none; }
.kome{
 text-indent: -1em;
 padding-left: 1em;
}
.floatl { margin:0 auto; }
.floatl img { margin-bottom:10px !important; }
.red{
 background-color: inherit;
 color: #c11e1e; }
.blue{
 background-color: inherit;
 color: #114293; }
.storange{
 background-color: inherit;
 color: #921414;
 font-weight:700; }
a.linkwhite,a.linkwhite:visited {text-decoration:none; color:#ffffff;}
a.linkwhite:hover,a.linkwhite:active {text-decoration:underline; color:#ffffff;}

.w550 { width:100% !important; }
.ml30 { margin-left:15px !important; }
.w200 { width:180px !important; }
.w350 { width:180px !important; }
 
li.li01{
 background:url(../img/li01.gif) no-repeat;
 padding:2px 10px 3px 18px;
 margin: 0;
 list-style:none;
}
li.li02{
 list-style:disc;
 margin: 2px 10px 2px 15px;
}
li.li03{
 list-style:circle;
 margin: 2px 30px 10px 70px;
}

ol{ padding:0 0 0 33px;}

dl.dldot { margin:0 0 10px 0;
 border-bottom:dotted 1px #554646; }

dt.dt01 { 
 border-left: solid 4px #664729;
 padding:0 0 0 7px; }

dd.dd01 { 
 padding:0 0 0 10px;
 margin:10px; }

dd.dd02 { 
 padding:0 0 0 10px;
 margin:10px; }



.bggray { background-color:#f6efe9;
 border: solid 1px #CCCCCC;
 padding:10px; }
 
.caption { background-color:#f5f5f5;
 border-bottom: solid 1px #ccc;
 border-left: solid 1px #ccc;
 border-right: solid 1px #ccc;
 padding:8px;
 font-size:10px;
 line-height:1.5;
 color:#555;
 letter-spacing:0.5px; }
 
.fss{ font-size:70%;
 line-height:1.5;
 letter-spacing:0px;}


hr {
	clear: both;
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: 1px dotted #cccccc;
	color: #FFF;
	background-color: inherit;
}

table dt{ 
 border-left: solid 4px #664729;
 padding:0 0 0 7px; }

table dd{ 
 padding:0 0 0 10px;
 margin:10px; }

table .normal th{ width:40% !important; }
table .normal td{ width:60% !important; }

/* --------------------------------------------------------------------------- */
#contact input,textarea,select{
 background-color:#fff;
 border:1px solid #cccccc;
 padding:2px 5px;
 font-size:12px;
}


img.imgleft { max-width:45% !important;
vertical-align:top;
 float:left;
 margin-right:5px;
 margin-bottom:5px;
 display: inline; }

img.imgright { max-width:45% !important;
vertical-align:top;
 float:right;
 margin-left:5px;
 margin-bottom:5px;
 display: inline; }
img { max-width:100% !important;  height:auto; }
.hidden-sp{ display:none; }

/*================================================= */

.out-frame {
  padding: 0 0 0 0;
  position: relative;
  width: 100%;
  z-index:10;
}

.header-frame {
  position: fixed;
  height: 0px;
  top: 0;
  left: 0;
  width: 100%;
}

.menu-btn {
  background: url(../img/sp-btn-menu_off.png) no-repeat;
  background-size: 40px;
  position: absolute;
  right: 5px;
  top: 15px;
  height: 40px;
  width: 40px;
}

.menu-btn img {
  opacity: 1;
}

.black .menu-btn img {
  opacity: 0;
}

.header-menu {
  background: #F5F4E6;
  display: none;
  position: fixed;
  width: 100%;
  z-index: 10;
  top: 63px;
}

.header-menu ul li a{
  text-align: center;
  padding: 10px;
  border-bottom: 1px solid #ccc;
  display: block;
  text-decoration: none;
  color: #901313;
  font-weight:bold;
}
.header-menu ul li.delete{
  text-align: center;
  font-weight: bold;
  background: #901313;
  color:#fff;
  padding: 10px;
  list-style:none;
}

.out-frame.black:after {
  background: #901313;
  opacity: 0.5;
  content: '';
  height: 10000px;
  right: 0;
  top: 63px;
  position: fixed;
  width: 100%;
  z-index: 1;
  transition: all .5s ease;
  -webkit-transition: all .5s ease;
  -moz-transform: all .5s ease;
}

.out-frame:after {
  background: #901313;
  opacity: 0;
  content: '';
  right: 0;
  top: 63px;
  position: fixed;
  width: 100%;
  z-index: 1;
  transition: all .5s ease;
  -webkit-transition: all .5s ease;
  -moz-transform: all .5s ease;
}

}


@media screen and (min-width: 641px){
.hidden-pc{ display:none; }
}


