<STYLE type="text/css">/*========= Google Fontの設定をするCSS ===============*/@font-face {  font-family: "BIZ UDPGothic";  src: url("./font/BIZUDPGothic-Regular.ttf") format("truetype");}.biz-udpgothic-regular14h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 14px ;  line-height: 180% ;  color: #FFFFFF;}.biz-udpgothic-regular18 {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 18px ;  line-height: 150% ;  color: #1A1A1A;}.biz-udpgothic-regular18h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 18px ;  line-height: 150% ;  color: #FFFFFF;}.biz-udpgothic-regular21 {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 21px ;  line-height: 120% ;  color: #1A1A1A;}.biz-udpgothic-regular21h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 21px ;  line-height: 120% ;  color: #FFFFFF;}.biz-udpgothic-regular24h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 24px ;  line-height: 120% ;  color: #FFFFFF;}.biz-udpgothic-regular24 {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 24px ;  line-height: 120% ;  color: #1A1A1A;}.biz-udpgothic-regular28 {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 28px ;  line-height: 120% ;  color: #1A1A1A;}.biz-udpgothic-regular28h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 28px ;  line-height: 120% ;  color: #FFFFFF;}.biz-udpgothic-regular36 {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 36px ;  line-height: 120% ;  color: #1A1A1A;}.biz-udpgothic-regular36h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 36px ;  line-height: 120% ;  color: #FFFFFF;}.biz-udpgothic-regular42 {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 42px ;  line-height: 180% ;  color: #1A1A1A;}.biz-udpgothic-regular42h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 42px ;  line-height: 180% ;  color: #FFFFFF;}.biz-udpgothic-regular46 {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 46px ;  line-height: 180% ;  color: #1A1A1A;}.biz-udpgothic-regular46h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 46px ;  line-height: 180% ;  color: #FFFFFF;}.biz-udpgothic-regular52h {  font-family: "BIZ UDPGothic", sans-serif;  font-weight: 400;  font-style: normal;  font-size: 52px ;  line-height: 150% ;  color: #FFFFFF;}/*========= リンク時の文字色を設定をするCSS ===============*/a{  color:grey;    text-decoration:none;}A:link {text-decoration:none ;color : #1A1A1A }A:visited {text-decoration:none ;color : #1A1A1A }A:hover {text-decoration:none ;color : #1A1A1A }A:active {text-decoration:none ;color : #1A1A1A }a.mail:link, a.mail:visited { color:#1A1A1A }a.mail:hover { color:#1A1A1A; }a.mail:active {color:#1A1A1A; }A { text-decoration: none; }A:hover {color:#1A1A1A; text-decoration:underline}/*========= 画像の角を丸くする為のCSS ===============*/p.corner1 img {    border-radius: 10px; /* 小 */}p.corner2 img {    border-radius: 20px; /* 中 */}p.corner3 img {    border-radius: 30px; /* 大 */}/*========= ヘッダーを固定する為のCSS ===============*/.navi{    position: fixed;    z-index: 10;}.contents{    margin-top: 0px;}/*========= テキストにアンダーライン（黄色） ===============*/  .test {   background: linear-gradient(transparent 60%, yellow 30%);   display: inline-block;  }/*========= 背景画像を横100%にする為のCSS ===============*/.bg{   background-image: url('../images/back_images_gradation.png');   background-size: 100% 100%;}/*========= 画像をゆっく切り替え＆画像の上に文字を配置する為のCSS ===============*/.switch_image01 {    position: relative;}.switch_image01 img {    transition: opacity 0.5s;}.switch_image01:hover img:first-of-type {    opacity: 0;}.switch_image01 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image01:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}.switch_image02 {    position: relative;}.switch_image02 img {    transition: opacity 0.5s;}.switch_image02:hover img:first-of-type {    opacity: 0;}.switch_image02 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image02:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}.switch_image03 {    position: relative;}.switch_image03 img {    transition: opacity 0.5s;}.switch_image03:hover img:first-of-type {    opacity: 0;}.switch_image03 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image03:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}.switch_image04 {    position: relative;}.switch_image04 img {    transition: opacity 0.5s;}.switch_image04:hover img:first-of-type {    opacity: 0;}.switch_image04 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image04:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}.switch_image05 {    position: relative;}.switch_image05 img {    transition: opacity 0.5s;}.switch_image05:hover img:first-of-type {    opacity: 0;}.switch_image05 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image05:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}.switch_image06 {    position: relative;}.switch_image06 img {    transition: opacity 0.5s;}.switch_image06:hover img:first-of-type {    opacity: 0;}.switch_image06 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image06:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}.switch_image07 {    position: relative;}.switch_image07 img {    transition: opacity 0.5s;}.switch_image07:hover img:first-of-type {    opacity: 0;}.switch_image07 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image07:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}.switch_image08 {    position: relative;}.switch_image08 img {    transition: opacity 0.5s;}.switch_image08:hover img:first-of-type {    opacity: 0;}.switch_image08 img:last-of-type {    position: absolute;    top: 0px;    left: 0px;    opacity: 0;}.switch_image08:hover img:last-of-type {    opacity: 1;}.center {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}/*========= マウスが乗ったら画像を一回転させる為のCSS ===============*/.imgrotation {  height: 203px;  margin-inline: auto;  margin-top: 0px;  width: 203px;}.imgrotation img {  background-color: #FFFFFF;  cursor: pointer;  height: auto;  width: 100%;}.title {  display: inline-block;  font-size: 20px;  font-weight: 700;  margin-top: 40px;  position: relative;}/* hoverアニメーション */.imgrotation:hover img {  transition: transform 1s;  transform: rotate(360deg);}</STYLE>