<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}/*========= ハンバーガーボタン ===============*/.hamburger {  display : block;  position: fixed;  z-index : 3;  right : 13px;  top   : 12px;  width : 42px;  height: 42px;  cursor: pointer;  text-align: center;  -webkit-transition: 0.5s all;  -moz-transition   : 0.5s all;  transition        : 0.5s all;}.hamburger span {  display : block;  position: absolute;  width   : 30px;  height  : 3px ;  left    : 6px;  background : #fff;}.hamburger span:nth-child(1) {  top: 10px;}.hamburger span:nth-child(2) {  top: 20px;}.hamburger span:nth-child(3) {  top: 30px;}/* ナビ開いてる時のボタン */.hamburger.active{  -webkit-transform: rotate(360deg);  transform: rotate(360deg);}.hamburger.active span:nth-child(1) {  top : 16px;  left: 6px;  -webkit-transform: rotate(-45deg);  -moz-transform   : rotate(-45deg);  transform        : rotate(-45deg);}.hamburger.active span:nth-child(2) {  top: 16px;  -webkit-transform: rotate(45deg);  -moz-transform   : rotate(45deg);  transform        : rotate(45deg);}.hamburger.active span:nth-child(3) {  opacity: 0;}nav.globalMenuSp {  position: fixed;  z-index : 2;  top  : 0;  left : 0;  color: #000;  background: #fff;  text-align: center;  transform: translateX(100%);  transition: all 0.6s;  width: 100%;}nav.globalMenuSp ul {  background: #19A065;  margin: 0 auto;  padding: 0;  width: 100%;}nav.globalMenuSp ul li {  list-style-type: none;  padding: 0;  width: 100%;  border-bottom: 1px solid #fff;}nav.globalMenuSp ul li:last-child {  padding-bottom: 0;  border-bottom: none;}nav.globalMenuSp ul li:hover{  background :#ddd;}nav.globalMenuSp ul li a {  display: block;  color: #000;  padding: 1em 0;  text-decoration :none;}/* このクラスを、jQueryで付与・削除する */nav.globalMenuSp.active {  transform: translateX(0%);}/*========= 画像の角を丸くする為の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;}.center01 {  position: absolute;  top: 40%;  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;}.center02 {  position: absolute;  top: 40%;  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;}.center03 {  position: absolute;  top: 40%;  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;}.center04 {  position: absolute;  top: 40%;  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;}.center05 {  position: absolute;  top: 40%;  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;}.center06 {  position: absolute;  top: 25%;  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;}.center07 {  position: absolute;  top: 25%;  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;}.center08 {  position: absolute;  top: 25%;  left: 50%;  transform: translate(-50%, -50%);}/*========= 画像の上に横文字を配置する為のCSS ===============*/.textbox001{  position: relative;}.center001 {  position: absolute;  top: 40%;  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;}/*========= テキストにアンダーライン（黄色） ===============*/  .test {   background: linear-gradient(transparent 60%, yellow 30%);   display: inline-block;  }</STYLE>