@charset "utf-8";
/*===============================================
●tablet.css 画面の横幅が960pxまで
===============================================*/
@media screen and (max-width: 960px){
/* ----------------------------------------------------------------------
そのままだと画像は元のままのサイズで表示されてしまい画面からはみ出てしまいます。
上記にも記載しておりますが、スマートフォン用・タブレット用のCSSに下記のように画像を伸縮するように指定をします。
---------------------------------------------------------------------- */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
header, #main, #footer_contents,
#SmartmainVisual,
#SmartmainVisual img,
#mainVisual img,
#mainVisual{
width:100%;
height:auto;
}
header{
    overflow:hidden;
}
header p {
    margin-right: 10px;
}
#main_contents {
    width: 73%;
    margin-left:1%
}
aside{
    width: 25%;
}
header h1{
    margin-left:10px;
}
h3 {
    background: url("common/img/h3_bg.png") right center no-repeat;
    width: 100%;
    background-size: contain;
    clear: both;
}
#globalNavi {
    clear: both;
    padding:0px;
    background:none;
    height:auto;
    min-height: 3.5em;
    margin-top: -5.5vw;
}
#globalNavi .navi  li{
	position:relative;
}
#globalNavi .navi  li:before {
    position: absolute;
    margin-top: -8px;
    top: 50%;
    left: 4px;
    color: #5e3b1f;
    content: " \f054";
    font-family: FontAwesome;

}
#globalNavi .navi {
    margin: 0 auto;
    background: none;
    width: 100%;
    height: 100%;
    margin-bottom: 2.5em;
    margin-bottom: 0em;
}
section{
    width:100%;
}
#main_contents table {
    width: 98%;
}
aside img {
    width: 100%;
    height: auto;
}
footer p,
.footer_menu {
    width: 100%;
}
.footer_menu {
    width: 95%;
}
.navi li a img{
	display:none;
}
#globalNavi .navi li{
	float:none;
	display:block;
}
#globalNavi .navi li span{
	display:inline;
	color:#FF9786;
	color:#5e3b1f;
}
h4{
	width:100%;
	max-width:100%;
}
footer p{
	padding:0;
	line-height: 2.0rem;
	line-height:10vw;
}
footer {
    clear: both;
    min-height: 300px;

}
.navtitle.open,
.closebtn{
	display:none!important;
}
#mainVisual{
	display:none;
}
#SmartmainVisual{
	display:block;
}
#warp{
	background:none;
}
#globalNavi .navi li:before{
    text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
    margin-left: 1em;
    top: 55%;
}
.mod_nav_inner ul li a{
	-webkit-border-radius: 3px;
    border-radius: 3px;
    /*-webkit-box-shadow: 0px 0px 4px #000000;
    box-shadow: 0px 0px 4px #000000;*/
    background-image: -moz-linear-gradient(top, #ffffff, #ffffff 70%, #f8f0e5);
    background-image: -webkit-gradient(linear, center top, center bottom, from(#ffffff), color-stop(0.7,#ffffff), to(#f8f0e5));
    background-image: -webkit-linear-gradient(top, #ffffff, #ffffff 70%, #f8f0e5);
    background-image: linear-gradient(top, #ffffff, #ffffff 70%, #f8f0e5);
    -webkit-background-clip: padding-box;
    text-shadow:
    text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
    font-size:1.1em;
    font-weight:bold;
}
.mod_nav_inner ul li a:link {
 color: #000;
 text-decoration: none;
}
.mod_nav_inner ul li a:visited {
 color: #000;
 text-decoration: none;
}
.mod_nav_inner ul li a:hover, .mod_nav_inner ul li a:hover:before {
 color: #009933;
 text-decoration: none;
}
.mod_nav_inner ul li a:active, .mod_nav_inner ul li a:hover:before {
 color: #009933;
 text-decoration: none;
}
/* mod_nav_btn */
.mod_nav_inner p.closebtn {
 display:none;
}
#globalNavi p i{
	display:none;
}
header h2{
	text-align:center;
}
}






/* mod_nav
-----------------------------------------*/
.mod_nav {

}

@media screen and (max-width:960px) {
.mod_nav {
 position:relative;
 padding: 0;
 height: 50px;
}
}
/* navtitle */
.mod_nav p.navtitle {
 display: none;
}

@media screen and (max-width:960px) {
.mod_nav p.navtitle {
 position:absolute;
 top:8px;
 left:10px;
 display: block;
 font-size:20px;
 cursor:pointer;
}
.mod_nav p.navtitle i{
 font-size:24px;
}
.mod_nav p.navtitle span{
    display: block;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
}
/* mod_nav_inner */
.mod_nav_inner {
}
@media screen and (max-width:960px) {
.mod_nav_inner {
 display:none;
 position:relative;
 top:45px;
 left:0;
 background-color:#FFF;
}
}
.mod_nav_inner ul {

 text-align: right;
}
@media screen and (max-width:960px) {
.mod_nav_inner ul {
 margin: 0;
 text-align: left;
 border-top:solid 1px #CCC;
}
}
.mod_nav_inner ul li {

}
@media screen and (max-width:960px) {
.mod_nav_inner ul li {
 display: block;
 margin:0;
 border-bottom:solid 1px #CCC;
}
}
.mod_nav_inner ul li a {

}
@media screen and (max-width:960px) {
.mod_nav_inner ul li a {
 display: block;
 padding: 15px 0 15px 40px;
}
}

@media screen and (max-width:960px) {
.mod_nav_inner ul li a:before {
 left: 15px;
}
}



@media screen and (max-width:960px){
.mod_nav_inner p.closebtn{
 display:block;
 background-color:#000;
 color:#FFF;
 margin:0;
 padding:10px;
 line-height:1;
 font-size:16px;
 cursor:pointer;
 text-align:center;
}
.mod_nav_inner p.closebtn i{
 margin:0 5px 0 0;
}

}
@media screen and (max-width:745px){
#globalNavi {
    margin-top: -11.5vw;
}
}