<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">

/* 蜈ｱ騾� */
*{
    margin: 0;
    padding: 0;
}


/* 繝倥ャ繝繝ｼ繝医ャ繝� */

.headerbox{
    position: relative;
    width: 100%;
    height: 100vh; /* 繧ｦ繧｣繝ｳ繝峨え縺ｮ鬮倥＆縺�▲縺ｱ縺� */
    
    /* 繧ｪ繝ｼ繝舌�繝ｬ繧､縺ｮ濶ｲ縺ｨ逕ｻ蜒上�謖�ｮ� */
    background: linear-gradient(rgba(0, 0, 0, .6),  rgba(0, 0, 0, .6)),  url("img/gate2.jpg");
    /* 逕ｻ蜒上�菴咲ｽｮ繧�し繧､繧ｺ縺ｮ隱ｿ謨ｴ */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    
    background-size: cover;
    background-position: center;    
    background-attachment: fixed;
    max-height: 790px;
}

.headerbox .title{
    position: absolute;
    bottom: 90px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%); 
    text-align: center;
}

.headerbox  h1{
    font-size: 26px;
    color: #fff;
    animation: fadeInUp;
    animation-duration: 1.5s;

}

.sns ul{
    display: flex;
    list-style: none;
}
.sns li a {
    text-decoration: none;
}

.headerbox .sns{
  
    position: fixed;
    top:32px;
    right: 133px;
    z-index: 9999;   
}

.twitter{
    margin-top: 3px;

}

.headerbox .sns img{
margin-left: 30px; 
}



/* 繝｡繝九Η繝ｼ�医リ繝薙ご繝ｼ繧ｷ繝ｧ繝ｳ�� */
.menubox {
    position: fixed;
    width: 51%;
    height: 98vh;
    background-color: black;
    opacity: 0.8;
    top:0px;
    right: -703px;
    z-index: 990;
    transition-duration: 0.8s;
    font-size: 20px;

}
.menubox ul {
    display: flex;
    justify-content: space-evenly;
    flex-direction: column;
    list-style: none;
}
.menubox ul li {
    width: 320px;
    padding: 10px 0;
    display: block;
    
    margin: 0px 1px;
}
.menubox ul li a {
    text-decoration: none;
    color: white;  
}

.inlight{
font-size: 16px;
margin-left: 69px;
margin-top: 6px;
}



.menuboxbox{
    margin: 110px 0 0 95px;  
}

.btn{
position: relative;
transition-duration: 0.5s;
width: 150px;
height: 34px;
border: none;
cursor: pointer;
}

.btn::after{
position: absolute;
content: '';
bottom:0;
left:0;
width:0%;
height:1px;
background-color: #fff;
transition-duration: 0.5s;
}

.btn:hover::after{
width:100%;
}




.box{
display: flex;
margin: 16px 0px 0px 26px;
}
.box p{
color: #fff;
}
 
.box .rine{
    font-size: 38px;
}
#box2 .rine{
    font-size: 38px;
}




#tab{
    position: fixed;
    
    top:6px;
    right: 5px;
    z-index: 1000;
    
    width: 150px;
    padding: 5px;
    display: block;
    margin: 0px 1px;
    text-align: center;
    color: white;
    cursor: pointer;
    
    font-size: 40px;
    
}
.tab1{
height: 0px;
margin-bottom: 10px;

}
.tab2{
    height: 40px;
    margin-bottom: 10px;
}
.tab3{  
font-size: 15px;
}


.sectionbox {
position:relative;
padding-top: 50px;
}
.sectionbox h1 {
margin-left: 73px;
font-size: 55px;
}
img{
max-width: 100%;
}


/* 繧｢繝舌え繝医�繝ｼ繧ｸ */


.about{
padding-bottom: 118px;
/* 繧ｪ繝ｼ繝舌�繝ｬ繧､縺ｮ濶ｲ縺ｨ逕ｻ蜒上�謖�ｮ� */
background: linear-gradient(rgba(10, 33, 59, 0.6),  rgba(0, 0, 0, .6));
background-color: rgb(0, 0, 0);
}
.vision{
text-align: right;
color: rgba(255, 255, 255, 0.459);
}

.vision2{
display: flex;
flex-direction: column;
}

.vision2 .visionbox:first-child{
margin-top: 30px; 
}
#target{
display: flex;
color: #fff;
margin-left: 0px;
}
#target .textbox1{
text-align: left;
}
#target img{
width: 600px;
margin-left: auto;
margin-right: 30px;
}


.vision2 .visionbox:nth-child(2){
margin-top: 300px;
}

.vision2 .visionbox:nth-child(3){
margin-top: 140px;
}
#third img{
width: 480px;
}

.vision2 .visionbox:last-child{
width: 400px;
margin: auto;
margin-top: 110px;
}


#aboutsection {
position: relative;
}
.about h1{
margin-left: 8px;
color:#fff;
}
    

.aboutbox1{
margin-top: 50px;
}



.textbox1{
margin-left:auto;
margin-right: 50px;
margin-top: 30px;
text-align: right;
}
.textbox1 h2{
color: #fff;
}
.textbox1 p{
color: #fff;
font-size: 11px;
}


   


/* 譁ｰ隱倩� */
.aboutbox3{
margin:   170px auto;
margin-bottom: 80px;
}


.abtext{
margin-left: 79px;
color: #fff;

}
.abtext h2{
font-size: 32px;
}
.abtext p{
font-size: 12px;
}
#a3{
margin-top: 16px;
}
#a3 img{
margin-left: auto;
margin-right: 20px;
margin-bottom: 10px;
}

/* MAP */
.about2{
background-color:#cef0fb;
}


#map{
position: relative;
padding: 0 50px;
margin-bottom: 67px;
}

#mapbox h2{
margin-left: 73px;
font-size: 39px;
}

#mapbox{
margin-top: 33px;
}
#map .mappic{
text-align: center;
margin-top: 38px;
}



#mapimg img:first-child{
position: absolute;
top: 252px;
right: calc(600px - 50px + ( 100vw - 600px)/2.0);
animation: shakeY;
animation-duration: 7.5s;
animation-iteration-count: infinite;
animation-timing-function: ease;
width: 150px;
height: 100px;
}


#mapimg img:nth-child(2){
position: absolute;
bottom: 180px;
right: calc(600px - 110px + ( 100vw - 600px)/2.0);
animation: shakeY;
animation-duration: 7.5s;
animation-iteration-count: infinite;
animation-timing-function: ease;
width: 150px;
height: 100px;
}

#mapimg img:nth-child(3){
animation: shakeY;
animation-duration: 7.5s;
animation-iteration-count: infinite;
animation-timing-function: ease;
width: 150px;
height: 100px;
}

#mapimg img:nth-child(4){
position: absolute;
bottom: 125px;
left: calc(600px - 80px + ( 100vw - 600px)/2.0);
animation: shakeY;
animation-duration: 7.5s;
animation-iteration-count: infinite;
animation-timing-function: ease;
width: 150px;
height: 100px;
}

#mapimg img:nth-child(5){
position: absolute;
bottom: 285px;
left: calc(555px + 2px + ( 100vw - 600px)/2.0);
animation: shakeY;
animation-duration: 7.5s;
animation-iteration-count: infinite;
animation-timing-function: ease;
width: 150px;
height: 100px;
}

#mapimg img:last-child{
position: absolute;
top: 115px;
animation: shakeY;
animation-duration: 7.5s;
animation-iteration-count: infinite;
animation-timing-function: ease;
width: 150px;
height: 100px;
}
    
/* 隕九←縺薙ｍ */

#highlight{
background: linear-gradient(181deg, rgb(37 116 147 / 73%),rgb(240 250 255));
background-color: rgb(166 251 255 / 76%);
position: relative;
padding-top: 10px;
}

.active{
animation: bounceInUp;
animation-duration: 2.0s;
}
.activate{
animation: rollIn;
animation-duration: 1.0s;
}

#materiaru {
display: flex;
margin-top: 36px;
}

#cloud{
margin-top: 155px;
margin-left: 33px;
}
#cloud2{
margin-left: -37px;
}
.sun{
margin-left: 5px;
}
#cloud3{
margin-left: 50px;
margin-top: 55px; 
}

.hightex{
background-color: rgba(255, 255, 255, 0.733);
}

#highlight h2{
text-align: center;
font-size: 38px;
margin-top: -52px;

}
.hightex p{
font-size: 13px;
text-align: center;
animation: fadeIn;
animation-duration: 2.0s;
}
/* 繧ｵ繝�繝� */
#high-img {
display: flex;
justify-content: center;
width:100%;
margin-top: 59px;
}
.highbox  img{
width: 300px;
height: 200px;
}
    

.highbox:not(:last-child){
margin-right:10px;
}


.highbox{
cursor: pointer;
border: 1px solid;
border-color: black;
transition-duration: 1s;
text-align: center;
}


.highbox:hover{
border-color: white;    
}



/* 繧ｵ繝�繝阪け繝ｪ繝�け蠕� */
.photoframe {
position: fixed;
top: 0;
left: -100vw;
width: 100vw;
height: 100vh;
background-color: rgba(29, 48, 65, 0.616);
z-index: 500;
}

.works {
    position: absolute;
    left: calc(( 100vw - 576px)/2.0);
    top: calc(( 100vh - 376px)/2.0);
    width: 576px;
    height: 376px;
    border-radius: 20px;
    background-color: aliceblue;
}


#works1,#works2,#works3 {
opacity:0;
z-index:-999;
animation: fadeIn;
animation-duration: 2.0s;
}

.imagebox {
position: absolute;
top:0px;
left: calc(( 576px - 325px)/2.0); 
opacity: 0;
}

.imagebox img{
width: 325px;
height: 250px;
}

.imagebox h3{
z-index: -800;
text-align: center;
}


/* 繝懊ち繝ｳ */
#prevbutton {
position: absolute;
top: 48vh;
right: calc(576px + 10px + ( 100vw - 576px)/2.0);
color: #fff;
font-size: 24px;
cursor: pointer;
}

#nextbutton {
    position: absolute;
    top:48vh;
    left: calc(576px + 10px + ( 100vw - 576px)/2.0);
    color: #fff;
    
    font-size: 24px;
    cursor: pointer;
}

.close {
    position: absolute;
    left: calc(576px - 100px + ( 100vw - 576px)/2.0);
    bottom: calc(( 100vh - 472px)/2.0);
    color: #fff;
    cursor: pointer;
    font-size: 30px;
}


#ivent{
display: flex;
margin-top: 100px;
}



#iventpic img{
width: 550px;
height: 225px;
}

#iventwrap{
display: flex;
flex-direction: column;
margin-left: auto;
}

.ivent-txt{
    z-index: 1;
    text-align: right;
    margin-right: 50px;
}


#night{      
background-attachment: fixed;
padding: 20px;
color: #fff;
/* 繧ｪ繝ｼ繝舌�繝ｬ繧､縺ｮ鬮倥＆繧呈欠螳� */
height: 1000px;
/* 繧ｪ繝ｼ繝舌�繝ｬ繧､縺ｮ濶ｲ縺ｨ逕ｻ蜒上�謖�ｮ� */
background: linear-gradient( 1deg, rgba(8, 13, 27, 0.911),rgba(38, 55, 77, 0.6)), url("img/gate2.jpg"); 
/* 逕ｻ蜒上�菴咲ｽｮ繧�し繧､繧ｺ縺ｮ隱ｿ謨ｴ */
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}



#nighttext{
    margin-top: 268px;

}

#night p{
    text-align: center;  
    font-size: 17px;
    margin-top: 82px;
    color:hsl(180deg 63% 91%);
}

#night h2{
margin-top: -35px;
}

#moon{
    width: 90px;
    margin-left: auto;
    margin-top: -383px;
    margin-right: 62px;
    transform: rotate(8deg);
} 



/* 繧｢繧ｯ繧ｻ繧ｹ繧ｬ繧､繝� */
#access{
padding:50px;
}
.access .sectionbox{
display: flex;
flex-direction: column;
justify-content: center;
}

.access h1{
font-size: 42px;
margin-top: 0;
margin-left: 0px;
padding: 0;
}

.access .contents{
display: flex;
margin: auto;
} 


/* .access .guidance{
margin:0 50px 0 0;   
} */
.access .guidance p{
color: rgb(71, 49, 16);
}

.access .mapbox{
margin: 0 0 0 70px;
}

.mapbox img{
    width: 500px;
    height: 300px;
}


/* 繝輔ャ繧ｿ繝ｼ */

.footer{
background-color: rgb(0 0 0 / 86%);;
}

#foot{
position: relative;
padding: 0;
   
}

#foot .footbox{
display: flex;
margin-left: 100px;
padding: 29px 0;

}

#foot .footbox #rogobox{
margin-top:40px;    
}
#foot .sns{
margin-top: 94px;
margin-right: 10px;    
}  
#foot .sns img{
margin-right: 10px; 
width: 40px;   
} 

#foot .sns ul{
    display: flex;
    list-style: none;
}
#foot .sns li a {
    text-decoration: none;
}


 #rogobox .fraze{
    color: aliceblue;
 }

#foot .footmenu {
  margin-left: 10px;
  margin-top: 10px;  
}

#foot .footmenu ul {
    display: flex;
    justify-content: space-evenly;
    flex-direction: column;
    list-style: none;
}
#foot .footmenu ul li {
    width: 150px;
    padding: 5px;
    display: block;
    font-size: 15px;
    margin: 0px 1px;
    
}
#foot .footmenu ul li a {
    text-decoration: none;
    color: rgba(240, 238, 238, 0.897);
}</pre></body></html>