@charset "UTF-8";

body {
	margin:0px;
	padding:0px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	overflow-x:hidden;
	overflow-y:scroll;
}
h1, h2, h3, h4, h5, h6, p, ul, li, dl, dt, dd {
	padding:0px;
	margin:0px;
	list-style-type: none;
}
a img {
    border-style:none;
}
a:focus { outline:none;}
#mainVisual {
	width: 100%;
}


#hugeCircle {
	background-color:#ffffff;
	z-index: 999;
	position: absolute;
	width: 100%;
	height: 230px;
	bottom: 0px;
}
#hugeCircle h1 {
	width: 220px;
	margin-left: auto;
	z-index: 100;
	margin-right: auto;
	padding-top: 30px;
	padding-bottom: 20px;
}
h2#catchCopy {
	width: 462px;
	margin-left: -231px;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 100;
}
h2#catchCopy img {
	position: absolute;
	top: 50%;
	margin-top: -180px;
}




img.bgV {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 900px;
  /* Set up proportionate scaling */
  width: 150%;
  height: auto;
  /* Set up positioning */
  position: fixed;
  /* またはabsolute; */
  top: 0;
  left: 0;
}
img.bgVR {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 900px;
  /* Set up proportionate scaling */
  width: 150%;
  height: auto;
  /* Set up positioning */
  position: fixed;
  /* またはabsolute; */
  top: 0;
  right: 0;
}
img.bgH {
  /* Set rules to fill background */
  min-height: 500px;
  min-width: 100%;
  /* Set up proportionate scaling */
  width: auto;
  height: 120%;
  /* Set up positioning */
  position: fixed;
  /* またはabsolute; */
  top: 0;
  left: 0;
}
img.bgHR {
  /* Set rules to fill background */
  min-height: 500px;
  min-width: 100%;
  /* Set up proportionate scaling */
  width: auto;
  height: 120%;
  /* Set up positioning */
  position: fixed;
  /* またはabsolute; */
  top: 0;
  right: 0;
}



div#container {
  position: relative; 
}

#bgMain01{
	z-index:-10
}


#bgMain02{
	z-index:-9;
	top: -250px;
}


#bgMain03{
	z-index:-8;
	right: 0px;
}

#bgMain04{
	z-index:-7;
	top: -0px;
}

#bgMain05{
	z-index:-6;
}

#navi {
	width:662px;
	margin-left:auto;
	z-index:100;
	margin-right: auto;
}
.whiteCanvas {
	background-color: #FFF;
	height: 100%;
	width: 100%;
	position: fixed;
	z-index:10
}
#hugeCircle #navi ul li {
	clear: none;
	float: left;
	margin-right: 30px;
}
#footer {
	height: 20px;
	width: 100%;
	border-top-width: 1px;
	border-top-style: none;
	border-top-color: #D8D8D8;
	position: fixed;
	z-index: 9999;
	bottom: 0px;
	padding-top: 10px;
	padding-bottom: 20px;
}
#footer .left {
	position: fixed;
	left: 20px;
}
#footer .right {
	position: absolute;
	right: 20px;
}


.btnCircle {
	position: fixed;
	z-index: 9999;
	top: 40px;
	right: 40px;
	background-image: url(images/btnPDF_topBG.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: none;
}
#hugeCircle #navi ul #nav04 {
	margin-right: 0px;
}
/* 980px以下の画面サイズに対するスタイル */
@media (max-width: 980px) {
    #navi {
		width: 100%;
        transform: translateX(-45px) translateY(-40px);/* navi全体を左に35px、上に30pxずらす */
      }
      #navi ul {
        display: flex;
        justify-content: center;  /* 子要素を中央に配置 */
        padding: 0;
        margin: 0;
        align-items: center;  /* 縦方向を中央揃え */
      }
   
      #navi ul li {
        margin: 0 60px; /* 左右の間隔を調整 */
      }
   
      #navi ul li a img {
        width: 160%;  /* 画像を30%大きくする */
        height: auto; /* 高さを自動調整 */
      }
   
      /* 3番目の画像（中央にしたい画像） */
      #navi ul li:nth-child(3) {
        margin-left: 0; /* 左のマージンをリセット */
        margin-right: 0; /* 右のマージンをリセット */
      }
      h1 img {
        transform: translateX(-20px) translateY(-15px);/* h1 img全体を左に20px、上に15pxずらす */
        width: 250px;  /* 画像の幅を250pxに変更（調整可能） */
        height: auto;  /* 高さは自動調整 */
      }
    }