@charset "ut-8";

/*
スマホ: 320px - 480px
タブレット:480px - 768px（480px以上）
pc: それ以上            （768px以上）
*/



/* 共通の設定 */
html, body {
        font-family: "Courier New", arial, sans-serif;
        width: 100%;
        height: 100%;
        margin: 0 auto;
        /* 画像ファイルの指定 */
  background-image: url(../images/back.jpg);
   
  /* 画像を常に天地左右の中央に配置 */
  background-position: center center;
   
  /* 画像をタイル状に繰り返し表示しない */
  background-repeat: no-repeat;
   
  /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
  background-attachment: fixed;
   
  /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
  background-size: cover;
   
  /* 背景画像が読み込まれる前に表示される背景のカラー */
  background-color: #ffffff;
}

#header {
      
}

#footer {
        
      
}

body > #container {
  
}

#container {
     
}

.box_left {
    color: #FFF;
    width:263px;
    height:345px;
    margin-bottom:120px;
    margin-left:60px;
    float:left;
   
}

.box_left:hover  {
     opacity:0.6;
                -webkit-transition: 0.5s;
                 -moz-transition: 0.5s;
                 -o-transition: 0.5s;
                 -ms-transition: 0.5s;
                 transition: 0.8s;
                 text-decoration: none;
  

}
.box_wrap {
   
    height:auto;
    /* border:1px solid #000;*/
    
}
.clearfix:after {
  display: block;
  clear: both;
  content: "";
}

img {
        max-width:100%;
}


a{
    color: #000;
    text-decoration: none;
}
 
#subNav2 {
    width: 100%;
    text-align: center;
    line-height: 3;

}

/* スマホのスタイル  
#subNav{
        display: none;

}
*/

/* タブレットのスタイル  

@media all and (min-width:480px) {
        #footerNavLink {
                display:none;
        }
        #subNav {    
                display: block;
        }
        
        #footerNav {
                display:none;
        }
}

*/

/* pcのスタイル  */

/*
all:980px
sub:200px
margin:15px
main :765px
*/


/*@media all and (min-width:768px) {*/

 /*//////////////↓↓↓information css↓↓↓////////////////// */ 
        
        #container {
                overflow: hidden;
                height:100%;
          
        }
        
        #main {
                float: right;
                width:719px;
                overflow: hidden;
                height:100%;
                position:relative;
               
        }
        
       
        
       .tellbox {
   
                width: 402px;
                float: right;
                height:330px;
                padding-bottom:30px;
                overflow: hidden;
                position:relative;
                
        }
        
      
       
        .mobile {
                  color: #aaaaaa;
                  position: absolute;
                  top: 65px;
                  left: 60px;
                  font-size: 20px;
        }


        .nanbar {
                  color: #333300;
                  position: absolute;
                  top: 95px;
                  left: 90px;
                  font-size: 24px;
        }
        
        
        
        .mail {
                color: #aaaaaa;
                position: absolute;
                top: 165px;
                left: 60px;
                font-size: 20px;
        }
        

        
        .mailadress {
                  color: #333300;
                  position: absolute;
                  top: 190px;
                  left: 90px;
                  font-size: 17px;
        }
        
        
        
        .cyui {
                  color: #aaaaaa;
                  position: absolute;
                  top: 210px;
                  left: 90px;
                  font-size: 10px;
        }
        
        .appointment {
                color: #333300;
                position: absolute;
                top: 265px;
                left: 115px;
                font-size: 30px;
                font-weight: 500;
                /*text-shadow: 5px 5px 2px #aaa;*/
                background: linear-gradient(transparent 60%, #aaa 60%);
  
        }
  /**********************************************************/  

         .mapbox {
   
                width: 402px;
                float: right;
                height:330px;
                padding-bottom:30px;
                overflow: hidden;
                position:relative;
                
        }  
        
        .map {
                color: #333300;
                position: absolute;
                top: 265px;
                left: 260px;
                font-size: 30px;
                font-weight: 500;
                /*text-shadow: 5px 5px 2px #aaa;*/
                background: linear-gradient(transparent 60%, #aaa 60%);
        }
        
        .mapadress {
                      color: #aaaaaa;
                      position: absolute;
                      top: 65px;
                      left: 60px;
                      font-size: 13px;
                      letter-spacing: 3px;
                      line-height: 35px;
        }
                   
 /**********************************************************/ 
 
         .schedulebox {
           
                        width: 402px;
                        float: right;
                        height:330px;
                        padding-bottom:30px;
                        overflow: hidden;
                        position:relative;
                        
           }  
           .schedulebox2 {
           
                        width: 402px;
                        float: right;
                        padding-bottom:30px;
                        overflow: hidden;
                        position:relative;
                        
           }  
           .schedule {
                color: #333300;
                position: absolute;
                top: 265px;
                left: 170px;
                font-size: 30px;
                font-weight: 500;
                /*text-shadow: 5px 5px 2px #aaa;*/
                background: linear-gradient(transparent 60%, #aaa 60%);
        }
        
        .scheduletext {
                      color: #aaaaaa;
                      position: absolute;
                      top: 65px;
                      left: 60px;
                      font-size: 13px;
                      letter-spacing: 3px;
                      line-height: 35px;
        }
 
 
      
 /*//////////////↓↓↓introduction css↓↓↓////////////////// */ 
 
        .imagebox {
                
                width:100%;
                height:880px;
                overflow: hidden;

        } 

        .image0{
                width:300px;
                height:300px;
                background-color: rgba(0,0,255,1); 
                float:left; 
                position: absolute;
                top: 0px; 
                left: 0px; 
                z-index:1;  
        } 
        
        .image1{
                  width: 260px;
                  height: 200px;
                  background-color: rgba(0,200,0,1);
                  float: left;
                  position: absolute;
                  top: 0px;
                  left: 260px;
                  z-index: 2; 
                     
        } 
        
        .image2{
                width:239px;
                height:300px;
                background-color: rgba(0,0,150,1); 
                float:right; 
                z-index: 3;     
        } 
        
        .image3{
                width:150px;
                height:150px;
                background-color: rgba(150,0,0,1);
                position: absolute;
                top: 260px;
                left:40px;
                z-index: 3;    
        } 
        
         .image4{
                  width: 324px;
                  height: 68px;
                 
                  position: absolute;
                  top: 342px;
                  left: 405px;
                  z-index: 4;    
        } 
        
        .image5{
                  width: 267px;
                  height: 400px;
                  background-color: rgba(50,50,50,1);
                  position: absolute;
                  top: 410px;
                  left: 0px;
                  z-index: 5;    
        } 
        
         .image6{
                width:230px;
                height:150px;
                background-color: rgba(150,0,150,1);
                position: absolute;
                top: 520px;
                left:170px;
                z-index: 6;    
        } 
        
        .image7{
                  width: 319px;
                  height: 215px;
                  background-color: rgba(150,150,150,1);
                  position: absolute;
                  top: 595px;
                  left: 400px;
                  z-index: 7;    
        } 
        
        .image8{
                  width: 150px;
                  height: 150px;
                  background-color: rgba(0,150,200,1);
                  position: absolute;
                  top: 445px;
                  left: 529px;
                  z-index: 8;   
        } 
 
/**********************************************************/        
        .textbox {
                
                  width: 100%;
                  height: 900px;
                  overflow: hidden;
                  position: relative;
                  padding-top:200px;

        } 
               
       .text {
                
                  width: 100%;
                  height: 700px;
                  overflow: hidden;
                  position: relative;
                  z-index: 2;
                  line-height: 35px;
                  font-size: 12px;
        } 
               
               .text0 {
                
                  width: 450px;
                  height: 450px;
                  overflow: hidden;
                  background-color: rgba(50,50,50,0.5);
                  position: absolute;
                  top: 400px;
                  left: 250px;
                  z-index:1;
                  opacity: 0.6;
               } 
               
/**********************************************************/               
               .credit {
                
                    width: 300px;
                    height: 100%;
                    overflow: hidden;
                    position: relative;
                    margin: 0 auto;
                    float: right;
                
                    

               } 
               .creditname a img {
                       -webkit-transition: opacity 1s ease-out;
                    -moz-transition: opacity 1s ease-out;
                    -ms-transition: opacity 1s ease-out;
                    transition: opacity 1s ease-out;
                
                }
               
               .creditname a:hover img  {
                         opacity: .5;
                        -webkit-opacity: .5;
                        -moz-opacity: .5;
                        filter: alpha(opacity=50);	/* IE lt 8 */
                        -ms-filter: "alpha(opacity=50)"; /* IE 8 */
                        
               }
        
               hr.style-seven {
                    height: 30px;
                    border-style: solid;
                    border-color: black;
                    border-width: 1px 0 0 0;
                    border-radius: 20px;
                }
                hr.style-seven:before {
                    display: block;
                    content: "";
                    height: 30px;
                    margin-top: -31px;    
                    border-style: solid;
                    border-color: black;
                    border-width: 0 0 1px 0;
                    border-radius: 20px;
                }
                
                .c {
                      text-align: center;
                }
                
                .creditname {
                      width: 217px;
                      height: 177px;
                      margin: 0 auto;
                      padding-bottom:40px;
                }
                
 /*//////////////↓↓↓information css↓↓↓////////////////// */
 
                
                .menu{
                        width: 100%;
                        height: 100%;
                        /*background-color: rgba(0,255,0,0.5);*/
                        padding-top: 100px;
                        text-align: right;
                        font-size: 14px;
                        line-height: 38px;
                
                }
                
                .menu:last-child {
                        width:100%;
                        height:100%;
                        /*background-color: rgba(0,255,0,0.5);*/
                        padding-top: 100px;
                        padding-bottom: 100px;
                        
                
                }
                
                .menu:last-child > p {
                        text-align: right;
                        font-size: 14px;  
                }
                
                p.card {
                        font-size: 10px;
                }
                
                hr.menuline {
                        height: 30px;
                    border-style: solid;
                    border-color: black;
                    border-width: 1px 0 0 0;
                    border-radius: 20px;
                }
                hr.menuline:before {
                    display: block;
                    content: "";
                    height: 30px;
                    margin-top: -31px;    
                    border-style: solid;
                    border-color: black;
                    border-width: 0 0 1px 0;
                    border-radius: 20px;
                }
                
                .cut {
                      text-align: center;
                }
                
/*//////////////↓↓↓information css↓↓↓////////////////// */

                .crendar {
                        height: 40%;
                        padding-bottom: 100px;
                }
                
    
 /*//////////////↓↓↓pc共通css↓↓↓////////////////// */   

        #header {
                height: 15px;
        } 
        
        body > #container {
        height: auto;
        }

        #container {
              width: 1024px;
              position: relative;
              margin: 0 auto;
              min-height: 100%;
              height: 100%;
                
        }

        
        #sub {
                float: left !important;
                margin-left: 50px;
                width: 175px;
                text-align: center !important;
                font-size: 22px;
                position:fixed;

        }
        
        #subNav {
                width:100%;
                text-align: center ;
                line-height: 3;
                margin-top: 215px;
                color: #333300;
        }
        
        #footer {
        
       
        }
         #footer > p {
        text-align: center;
       
        }
        
        a{
        color: #000;
        -webkit-transition: 0.5s;
         -moz-transition: 0.5s;
         -o-transition: 0.5s;
         -ms-transition: 0.5s;
         transition: 0.8s;
         text-decoration: none;
        }
 
        a:hover {
            color: #fff;
            text-shadow: -1px 1px 5px #ccc, 1px -1px 5px #000;
        }
        
        li.active {
            color: #fff;
            text-shadow: -1px 1px 5px #ccc, 1px -1px 5px #000; 
        }
        
        
        .mapurl:hover {
                text-shadow: 0px 0px 0px #ccc, 0px 0px 0px #000;
                opacity:0.6;
                -webkit-transition: 0.5s;
                 -moz-transition: 0.5s;
                 -o-transition: 0.5s;
                 -ms-transition: 0.5s;
                 transition: 0.8s;
                 text-decoration: none;
        }
        
        p.nanbar:hover {
                color: #fff;
                text-shadow: -1px 1px 5px #ccc, 1px -1px 5px #000;
                
                -webkit-transition: 0.5s;
                 -moz-transition: 0.5s;
                 -o-transition: 0.5s;
                 -ms-transition: 0.5s;
                 transition: 0.8s;
                 text-decoration: none;
        }
     
    

/*}*/