@charset "UTF-8";
/* -------------------------------
	オープニング
-------------------------------- */
html{
  overflow-y:scroll;
}
#opening { position: fixed; width: 100%; height: 100%; background-color: #dce8ed; z-index:200; }

/* オープニング終了 */
#opening.complete { opacity: 0; visibility: hidden; transition: opacity 1s ease-out, visibility 1s ease-out; }

/* オープニング無効 */
#opening.load_already { opacity: 0; visibility: visible; }

/* --- 参考デザイン --- */
#opening {/*  padding: 10%; */
	font-size: 20px;
}

#opening .image{
}
#opening .svg-container{
    width: 50%;
	margin: 0 auto;
	max-width: 100px;
}

/***************************************************
 * Generated by SVG Artista on 9/29/2026, 3:04:27 PM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/
/*
svg .svg-elem-1 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
}

svg.active .svg-elem-1 {
  fill: rgb(142, 148, 152);
}

svg .svg-elem-2 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
}

svg.active .svg-elem-2 {
  fill: rgb(142, 148, 152);
}

svg .svg-elem-3 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
}

svg.active .svg-elem-3 {
  fill: rgb(142, 148, 152);
}

svg .svg-elem-4 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
}

svg.active .svg-elem-4 {
  fill: rgb(38, 52, 75);
}

svg .svg-elem-5 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
}

svg.active .svg-elem-5 {
  fill: rgb(38, 52, 75);
}

svg .svg-elem-6 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
}

svg.active .svg-elem-6 {
  fill: rgb(38, 52, 75);
}

*/

/***************************************************
 * Generated by SVG Artista on 10/2/2026, 10:21:40 AM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/

svg .svg-elem-1 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
}

svg.active .svg-elem-1 {
  fill: rgb(16, 42, 74);
}

svg .svg-elem-2 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
}

svg.active .svg-elem-2 {
  fill: rgb(16, 42, 73);
}

svg .svg-elem-3 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
}

svg.active .svg-elem-3 {
  fill: rgb(16, 42, 73);
}

svg .svg-elem-4 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
}

svg.active .svg-elem-4 {
  fill: rgb(135, 142, 146);
}

svg .svg-elem-5 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
}

svg.active .svg-elem-5 {
  fill: rgb(135, 142, 146);
}

svg .svg-elem-6 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
}

svg.active .svg-elem-6 {
  fill: rgb(135, 141, 146);
}

svg .svg-elem-7 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s;
}

svg.active .svg-elem-7 {
  fill: rgb(134, 140, 145);
}

svg .svg-elem-8 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s;
}

svg.active .svg-elem-8 {
  fill: rgb(134, 140, 145);
}

svg .svg-elem-9 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s;
}

svg.active .svg-elem-9 {
  fill: rgb(134, 140, 146);
}

svg .svg-elem-10 {
  fill: transparent;
  -webkit-transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s;
          transition: fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s;
}

svg.active .svg-elem-10 {
  fill: rgb(134, 140, 146);
}


/**/



#opening .split-text{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
#opening .image{
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	z-index: 1;
	width: 100%;
}
#opening .image img {width: 50%; max-width: 200px; margin: 0 auto;}
@media print, screen and (min-width: 992px) {
	#opening .image img {width: 70%;}
}
@media print, screen and (min-width: 1200px) {
	#opening .image img {width: 80%;}
}



#opening .split-text > span { opacity: 0; animation: key_opening_txt .5s ease alternate forwards; }

@keyframes key_opening_txt { from { opacity: 0; }
  100% { opacity: 1; } }

/*# sourceMappingURL=opening.css.map */

.opening_tate{
		writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		-webkit-writing-mode:vertical-rl;
		font-size: 90%;
		margin-bottom: 0;
		display: inline-block!important;
		position: absolute;
		z-index: 1;
		left: 60px;
		top: 0;
		color: #fff;
		font-family: 'Zen Old Mincho', serif;
		font-weight: 500;
		line-height: 1.6em;

}
@media print, screen and (min-width: 768px) {
	#opening {font-size: 30px;}
}
@media print, screen and (min-width: 1200px) {
	#opening {font-size: 40px;}
}

@keyframes opening_anime{
    0%{
       opacity:1;
    }
	/*
    50%{
        opacity:1;
    }

    70%{
        opacity:0;
    }
		
    100%{
        opacity:0;
    }
	*/
}
.opening_anime{
    animation-name: opening_anime;
    animation-duration: 5s;/*8秒かけてアニメーション*/
    animation-fill-mode: forwards;/*終了時の状態を維持する*/
	animation-delay: 0.5s;/*アニメーションの開始を1秒遅らせる*/
}

/*一瞬オープニングが表示される件を修正*/
#home-body { opacity: 0; }/*※下層ページには<body id="home-body" ...は付けない。*/
#home-body.start { opacity: 1; }