@charset "utf-8";

/* common
---------------------------------------------*/
* {margin:0;padding:0;}

a:link,a:visited {
	color: #ffffff;
	text-decoration:underline;
}
a:hover,a:active {
	color: #22D2FF;
	text-decoration:underline;
}

a {
    text-decoration: none;
}

.impact   {font-size:20pt; font-weight:bold;}
.impact2  {color:red;}
.impact3  {background:yellow; color:#000;}
#impact4  {underline;}
.impact5  {background:#173B50; padding:2px 5px; color:#fff;}
.impact6  {background:#f4f4f4; padding:3px; line-height:1.1;}
.impact7  {background: #B60000; padding:2px 5px; color:#fff;}
.style2   {color: #FF0000}
.style3   {color: #333333}
.style4   {color: #000000}


img{ border: none;}

/* ボタンのマウスオーバーで明るくする */
.btn:hover {
  filter: brightness(110%);
}

/* animation
---------------------------------------------*/
.feedInUp {
	opacity: 0;
	transform: translate(0,30px); 
	-webkit-transform: translate(0,30px); 
	transition: 1.5s;
}
.feedInUp_On {
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

/* layout
---------------------------------------------*/
/*TopIntro-Start*/
body {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	min-width: 100vw;
	
	background-repeat: repeat;
	background-attachment: fixed;
	background-position: top center;
	
-webkit-text-size-adjust:none;
	
  text-align:center;
  font-size:26px;
  font-family: 'meiryo', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    color: #383d5c;
}
#main{
    width: 100%;
    max-width: 100vw; /* max-widthを画面の幅に合わせる */
}

.container {
    width: 100vw;
    overflow: hidden;
}
.image-container {
    width: 100vw;
    overflow: hidden;
}

.image-container1 {
    width: 100%;
    position: relative;
}

.image-container2 {
    width: 100vw;
    overflow: hidden;
}

.main-image {
    width: 100%; /* 画像1の幅を画面幅に合わせる */
    height: auto;
    display: block;
}

.image-container img {
    width: 100%; /* 親コンテナの幅に合わせる */
    height: auto; /* 画像の縦横比を保持しながら高さを自動調整 */
    display: block; /* 画像の下に余白ができないようにする */
}
.image-container1 img {
    width: 100%; /* 親コンテナの幅に合わせる */
    height: auto; /* 画像の縦横比を保持しながら高さを自動調整 */
	display: block; /* 画像の下に余白ができないようにする */
}
.image-container2 img {
    width: 100%; /* 親コンテナの幅に合わせる */
    height: auto; /* 画像の縦横比を保持しながら高さを自動調整 */
	display: block; /* 画像の下に余白ができないようにする */
}

.button {
    position: absolute;
	width: 40%;
	height: auto;
	margin-top: 13%;
	margin-left: 30%;
	z-index: 5;
}

.button2 img {
	width: 100%;
	height: 100%;
}

.nav-box {
    position: absolute;
	width: 100vw;
	height: auto;
	margin-top: 3%;
	z-index: 5;
	
}

.main-nav {
	display: flex;
	justify-content: flex-end;
    font-size: 0.9rem;
	font-weight: bold;
    text-transform: uppercase;
    margin-top: 0.5%;
	margin-right: 32%;
	
}

.main-nav li {
	list-style: none;
	float: left;
	margin-left: 20px
}

.main-nav a {
	text-decoration: none;
}

.button2 {
	position: absolute;
	width: 60%;
	height: auto;
	z-index: 5;
	margin-left: 20%;
	
}

.button3 {
    position: absolute;
	width: 40%;
	height: auto;
	margin-top: -0.5%;
	margin-left: 30%;
	
}

.button2 img {
	width: 100%;
	height: 100%;
}
.button3 img {
	width: 100%;
	height: 100%;
}

.btn-row {
  display: flex;              /* 横並びにする */                 
	gap: 20px;   /* ボタン間の余白 */
  flex-wrap: nowrap;            /* 画面が狭ければ折り返す。折り返したくなければnowrap */
	position: absolute;
	z-index: 5;
	margin-top: 1.8%;
	top: 50%;
 	 left: 50%;
 	 transform: translate(-50%, -50%); /* 自分の大きさ分だけ戻して中央 */
}

.btn-row2 {
  display: flex;              /* 横並びにする */                 
	gap: 20px;   /* ボタン間の余白 */
  flex-wrap: nowrap;            /* 画面が狭ければ折り返す。折り返したくなければnowrap */
	position: absolute;
	z-index: 5;
	margin-top: 0.3%;
	top: 50%;
 	 left: 50%;
 	 transform: translate(-50%, -50%); /* 自分の大きさ分だけ戻して中央 */
}

.btn-row3 {
  display: flex;              /* 横並びにする */                 
	gap: 20px;   /* ボタン間の余白 */
  flex-wrap: nowrap;            /* 画面が狭ければ折り返す。折り返したくなければnowrap */
	position: absolute;
	z-index: 5;
	margin-top: 1.5%;
	top: 50%;
 	 left: 50%;
 	 transform: translate(-50%, -50%); /* 自分の大きさ分だけ戻して中央 */
}

.btn-row img {
  display: block;             /* 画像下のすき間防止 */
  height: auto;          /* 親幅に合わせて縮む（必要なら固定幅指定） */
}

.pura {
	position: absolute;
	z-index: 5;
	margin-left: 45%;
	margin-top: -1%;
}

.pura a {
	text-decoration: none;
	font-size:13px;
}
 
/* フォーム
-----------------------------------------------------*/

#form { background: url("../images/header1_07.png") no-repeat top center; height:    389px; } 


#h1 { 
	background: url("../images/h0.png");
	background-position-x: center;
    background-position-y: top;
    background-size: initial;
    background-repeat: no-repeat;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: initial;
    height: 478px;
}

#h2 {
    background-image: url(../images/h1.png);
    background-position-x: center;
    background-position-y: top;
    background-size: initial;
    background-repeat: no-repeat;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: initial;
    height: 81px;
}

#h3 {
    background-image: url(../images/h2.png);
    background-position-x: center;
    background-position-y: top;
    background-size: initial;
    background-repeat: no-repeat;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: initial;
    height: 240px;
}

#movie {
	height: 450px;
}

#footer-container {
	text-align: center;
	width: 100vw;
	margin: 0 auto;
}



.white {
  color: #fff;
}

.text-center {
　text-align: center;
}

#c-copy2 {
	margin: 0 auto;
	padding: 8px;
	background-color: #fff;
	font-size: 6px;
}

#c-copy2 a {
	color: #666666 !important;
	text-decoration: none !important;
}

#c-copy {
	margin: 0 auto;
	padding: 8px;
	background-color: #B3B3B3;
	color: white;
	font-size: 6px;
}
--------------------------- */

ol,
ul{
	list-style-position: inside;
	padding-left:10px;
}
ol li,
ul li{
	text-align:left;
}