<STYLE type="text/css">/*========= リンク時の文字色を設定をするCSS ===============*/a{  color:grey;    text-decoration:none;}A:link {text-decoration:none ;color : #FFFFFF }A:visited {text-decoration:none ;color : #FFFFFF }A:hover {text-decoration:none ;color : #FFFFFF }A:active {text-decoration:none ;color : #FFFFFF }a.mail:link, a.mail:visited { color:#FFFFFF }a.mail:hover { color:#FFFFFF; }a.mail:active {color:#FFFFFF; }A { text-decoration: none; }A:hover {color:#FFFFFF; text-decoration:underline}/*========= 画像の角を丸くする為のCSS ===============*/p.corner1 img {    border-radius: 10px; /* 小 */}p.corner2 img {    border-radius: 20px; /* 中 */}p.corner3 img {    border-radius: 30px; /* 大 */}/*========= 画像をゆっく切り替え＆画像の上に文字を配置する為の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: 45%;  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: 45%;  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: 45%;  left: 50%;  transform: translate(-50%, -50%);}/*========= 画像の上に横文字を配置する為のCSS ===============*/.textbox001{  position: relative;}.center001 {  position: absolute;  top: 48%;  left: 50%;  transform: translate(-50%, -50%);}/*========= 画像の上に縦文字を配置する為のCSS ===============*/.textbox101{  position: relative;}.center101 {  position: absolute;  writing-mode: vertical-rl;  top: 35%;  left: 50%;  transform: translate(-50%, -30%);}/*========= 縦文字を配置する為のCSS ===============*/.text_vertical01 {	-ms-writing-mode: tb-rl;	writing-mode: vertical-rl;	text-align: center;	display: inline-block;}/*========= pageTopのCSS ===============*/  #pageTop {    position: fixed;    bottom: 20px;    right: 20px;  }  #pageTop i {  	padding-top: 6px   }  #pageTop a {    display: block;    z-index: 999;    padding: 8px;    border-radius: 30px;    width: 35px;    height: 35px;    background-color: #19A065;    color: #fff;    font-weight: bold;    text-decoration: none;    text-align: center;  }  #pageTop a:hover {    text-decoration: none;    opacity: 0.7;  }/*========= テキストにアンダーライン（黄色） ===============*/  .test {   background: linear-gradient(transparent 60%, yellow 30%);   display: inline-block;  }</STYLE>