@charset "utf-8";

/* mobile----------------------------------------------------*/
@media screen and (max-width: 480px) {

h1 {display: none;}      
.trance img{width: 100%;}    
.headerL { border-top:4px solid #39c;}
.headerL img{ width: 90%; padding: 8px 2%;}     
.headerR {display: none;} 
.naviLine{overflow: hidden; width: 96%; margin: 0 0 10px 2.5%;}    
.naviBt {float: left; width: 30%; border:1px solid #aaa; margin: 4px 1%;
    height:24px; text-align: center; padding-top: 8px; font-size: 4vw;
    border-radius: 8px;} 
.naviBt_open {float: left; width: 30%; border:1px solid #aaa; margin: 4px 1%;
    height:24px; text-align: center; padding-top: 8px; font-size: 4vw; 
    background-color: #39c; color: #fff; font-weight: bold; border-radius: 8px;}

.footer3 {overflow: hidden; width: 92%; margin: 0 4% 2%;}	
.footer3 img{float: left; width: 18%; margin: 0 1%;}	
.footer2{background-color: #39c; color: #fff; font-size: 2vw; text-align: center;} 
.mente{display: none;}      
    
}/* Tablet---------------------------------------------------*/
@media (min-width: 481px) and (max-width: 768px) {  

h1{background-color: #39c; font-size: 0.1vw; color: #39c; height: 10px;}
.trance img{width: 100%;}
    
.header{overflow: hidden; margin-bottom: 10px; }    
.headerL {float: left; width: 60%; margin-left: 5%;}    
.headerR {display: none;}     

.crossNavi{width: 100%; margin-bottom: 16px; border-top:1px solid #ccc;
    background: linear-gradient(white, #ccc);}       
.naviLine{overflow: hidden; width: 96%; margin-left: 2%; border-left:1px solid #ccc;}       
.naviBt {float: left; width: 16.4%; border-right:1px solid #ccc; 
    height:24px; text-align: center; padding-top: 8px; font-size: 15px;}         
.naviBt_open {float: left; width: 16.4%; border-right:1px solid #ccc; 
    background-image: url(../common/navi_open_line.jpg); color: #06c;
    background-position: right bottom; background-repeat:no-repeat; 
    font-weight: bold;
    height:24px; text-align: center; padding-top: 8px; font-size: 15px;}     

.footer3{display: none;}    
.footer2{background-color: #39c; color: #fff; font-size: 1.2vw; text-align: center;}   .mente{display: none;}  
    
    
}/* PC-------------------------------------------------------*/
@media print, screen and (min-width: 769px) {
   
.container{width: 1080px; margin: 0 auto;}

h1{background-color: #39c; font-size: 0.1vw; color: #39c; height: 10px;}
.trance img{width: 100%;} 
    
.header{overflow: hidden; margin-bottom: 10px; }    
.headerL {float: left; width: 33%;}    
.headerR {float: right; width: 28%;}  

.crossNavi{width: 100%; margin-bottom: 20px; border-top:1px solid #ccc;
    background: linear-gradient(white, #ccc);}       
.naviLine{overflow: hidden; width: 90%; margin-left: 5%; border-left:1px solid #ccc;}       
.naviBt {float: left; width: 16.5%; border-right:1px solid #ccc; 
    height:24px; text-align: center; padding-top: 8px; font-size: 15px;}         
.naviBt_open {float: left; width: 16.5%; border-right:1px solid #ccc; 
    background-image: url(../common/navi_open_line.jpg); color: #06c;
    background-position: right bottom; background-repeat:no-repeat; 
    font-weight: bold;
    height:24px; text-align: center; padding-top: 8px; font-size: 15px;} 
      
.footer3{display: none;}    
.footer2{background-color: #39c; color: #fff; font-size: 0.6vw; text-align: center;} 
.mente{font-size: 7px; text-align: right; margin-top: 20px;}    
.mente a{color: #ffe;}   
    
    
    
}