/* CSS Document */
/*
Minion Pro
font-family: minion-pro, serif;
font-weight: 600;
Noto Sans CJK JP
font-family: noto-sans-cjk-jp, sans-serif;
font-weight: 400, 500, 700;
Kodchasan
font-family: kodchasan, sans-serif;
font-weight: 500, 700;
*/
/* お気に入り公開時に消す ここから */
body{
#hNav{
grid-template-columns: 1fr;
#hNavPickup{
grid-column: 1;
}
#hNavFavorite{
display: none;
}
}
#navFavorite{
visibility: hidden;
}
#detail #link{
@media (min-width: 768px) {
grid-template-columns: 2fr 1fr;
}
#favorite{
display: none;
}
}
.spotList{
& a[data-fav-id]{
visibility: hidden;
}
&.line{
@media (min-width: 576px) {
& section{
& h3,
& p,
& time{
margin-right: 0;
}
}
}
}
}
}
/* お気に入り公開時に消す ここまで */
[src="[url]"]{
display: block;
background: var(--dummy);
}
[src*="src"]{
display: block;
background: #ccc;
}
[src*="commonPin_number.svg"]{
width: 32px;
height: auto;
}
[src*="commonPin.svg"]{
width: 28px;
height: auto;
}
[lsc-lt]{
display: contents;
}
:root{
--color: #3d3d3d;
--color-rgb: 61, 61, 61;
--color-theme: #13959a;
--color-theme-rgb: 19, 149, 154;
--color-variable: var(--color-theme);
--color-border: #808080;
--font: 'noto-sans-cjk-jp', 'BIZ UDPGothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', sans-serif;
--wrap-space: 24px;
--wrap-min: 375px;
--wrap-max: 1140px;
--wrap-fit: min(clamp(var(--wrap-min), 100dvw, 100%) - (var(--wrap-space) * 2));
--wrap: clamp(calc(var(--wrap-min) - (var(--wrap-space) * 2)), calc(max(100dvw, 100%) - (var(--wrap-space) * 2)), var(--wrap-max));
--dummy: #edf5f1 url('/common/images/logoType.vt.svg') no-repeat center / 50%;
}
html{
min-width: var(--wrap-min);
scroll-behavior: smooth;
scroll-padding-top: clamp(56px, calc(72 / 768 * 100dvw), 72px);
@media (min-width: 1200px) {
scroll-padding-top: 120px;
}
}
body{
color: var(--color);
font: 400 16px var(--font);
line-height: 1.65;
overflow-wrap: anywhere;
}
::selection{
background: var(--color-theme);
color: #fff;
}
::-moz-selection{
background: var(--color-theme);
color: #fff;
}
_::content, _:future, body:not(*:root) {
/* Chromeのハック */
/*フォント細いって言われたとき
font-weight: 500;
*/
}
_::-webkit-full-page-media, _:future, :root body{
/* safariのハック */
}
@-moz-document url-prefix(){
/* Firefoxのハック */
.xxx{
}
}
a{
color: inherit;
.done &{
transition-property: color, text-decoration, background, background-color, background-size, border, border-color, box-shadow, filter, opacity;
transition-duration: 0.2s;
transition-timing-function: ease-out;
}
:focus-visible{
outline: var(--color-theme) auto 2px;
outline-offset: 2px;
}
}
wbr{
.translated-ltr &:not(:lang(ja)){
display: none;
}
}
@-moz-document url-prefix(){
wbr{
display: none;
}
}
main{
& a{
color: var(--color-theme);
text-decoration: underline;
}
}
input,
textarea,
select{
background-color: transparent;
accent-color: var(--color-theme);
caret-color: var(--color-theme);
}
input{
&[type="checkbox"],
&[type="radio"]{
border: 1px solid currentColor;
&:checked{
background: transparent url('data:image/svg+xml;charset=UTF-8,') no-repeat center / 10px;
border: 1px solid currentColor;
}
}
}
button{
display: grid;
align-items: center;
min-height: 48px;
padding: 8px 16px;
background: var(--color-theme);
color: white;
text-align: center;
&:focus-visible{
outline: var(--color-theme) auto 2px;
outline-offset: 2px;
}
}
details{
all: unset;
box-sizing: border-box;
display: block;
&::details-content{
box-sizing: border-box;
}
}
summary{
all: unset;
box-sizing: border-box;
display: block;
&::-webkit-details-marker{
display:none;
}
}
#wrapper{
display: grid;
grid-template-rows: auto auto 1fr;
min-height: 100dvh;
#header{
grid-column: 1;
grid-row: 1;
position: sticky;
top: 0;
z-index: 110;
}
#nav{
z-index: 120;
}
#footer{
order: 10;
}
#pageTop{
z-index: 100;
}
&>#navButton{
display: none;
}
}
#header{
display: grid;
align-items: center;
background: #fff;
transition: background, filter 0.2s ease-out;
#body:not(.scrollTop) &{
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.5));
}
#navButton{
justify-self: center;
}
@media (max-width: 1199.98px) {
grid-template-columns: 1fr clamp(56px, calc(72 / 768 * 100dvw), 72px);
height: clamp(56px, calc(72 / 768 * 100dvw), 72px);
padding: 0 8px 0 24px;
}
@media (min-width: 1200px) {
grid-template-columns: auto 1fr auto;
column-gap: clamp(16px, calc(24 / 1400 * 100dvw), 24px);
padding: clamp(16px, calc(24 / 1400 * 100dvw), 24px);
#hNav{
justify-self: end;
}
}
}
#siteName{
& a{
display: block;
background: var(--color-theme);
font-size: 0;
transition: none;
-webkit-mask: no-repeat center / contain;
@media (max-width: 1199.98px) {
aspect-ratio: 212.74 / 24;
height: clamp(24px, calc(40 / 768 * 100dvw), 40px);
-webkit-mask-image: var(--header-logoType-sp);
}
@media (min-width: 1200px) {
aspect-ratio: 278.51 / 64;
height: clamp(56px, calc(64 / 1400 * 100dvw), 64px);
-webkit-mask-image: var(--header-logoType-pc);
}
}
}
#hNav{
display: grid;
grid-template-columns: 1fr auto;
justify-content: end;
align-items: center;
column-gap: 2em;
font-size: clamp(13px, calc(16 / 1400 * 100dvw), 16px);
#hNavPickup{
grid-column: 1 / 3;
grid-row: 2;
margin: 1em 0 -0.75em 0;
padding-top: 1em;
border-top: 1px solid rgba(var(--color-theme-rgb), 0.4);
}
& a{
color: var(--color-theme);
&:hover{
color: var(--color);
}
}
@media (max-width: 1199.98px) {
display: none;
}
}
#hNavGlobal{
& ul{
display: flex;
column-gap: clamp(16px, calc(32 / 1400 * 100dvw), 32px);
@media (max-width: 1450px) {
column-gap: 16px;
}
}
& li{
display: contents;
}
& a{
display: grid;
grid-template-columns: auto 1fr;
column-gap: 0.5em;
font-weight: 500;
letter-spacing: 0.05em;
@media (max-width: 1450px) {
font-size: 14px;
}
&:before{
content: "";
aspect-ratio: 1;
width: 1em;
background: currentColor;
transform: translateY(calc(0.825em - 50%));
-webkit-mask: no-repeat center / contain;
}
&[href="/article/index.html"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href="/course/index.html"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href="/spot/index.html"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href="/plan/index.html"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href="/event/index.html"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href="/article/gourmet"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href="/stay/index.html"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href="/access/index.html"]:before{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
}
}
#hNavPickup{
& ul{
display: flex;
justify-content: end;
column-gap: 2em;
}
& li{
display: contents;
}
& a{
display: block;
text-align: center;
font-weight: 500;
font-size: clamp(13px, calc(14 / 1400 * 100dvw), 14px);
letter-spacing: 0.05em;
}
}
#hNavFavorite{
& a{
display: block;
aspect-ratio: 1;
width: 18px;
background: currentColor;
font-size: 0;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
&:hover{
color: var(--color);
}
}
}
#navButton{
all: unset;
box-sizing: border-box;
cursor: pointer;
display: grid;
align-content: center;
justify-items: center;
grid-gap: 8px;
aspect-ratio: 1;
width: 56px;
color: var(--color-theme);
overflow: hidden;
pointer-events: all;
& i{
width: 75%;
height: 2px;
background: currentColor;
}
&:hover{
color: var(--color);
}
}
#nav{
position: fixed;
top: 0;
left: 100%;
display: grid;
grid-template-columns: 1fr auto auto clamp(56px, calc(72 / 768 * 100dvw), 72px);
grid-template-rows: clamp(56px, calc(72 / 768 * 100dvw), 72px);
align-content: start;
width: min(100%, 480px);
height: 100%;
background: #fff;
overflow-y: auto;
overscroll-behavior: none;
transform: translateX(0);
transition: transform 0.2s ease-out;
.nav &{
transform: translateX(-100%);
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.5));
}
& h2{
grid-column: 1;
grid-row: 1;
align-self: center;
aspect-ratio: 212.74 / 24;
height: clamp(24px, calc(32 / 768 * 100dvw), 32px);
margin-left: 24px;
background: var(--color-theme);
font-size: 0;
cursor: pointer;
-webkit-mask: var(--header-logoType-sp) no-repeat center / contain;
}
& menu{
all: unset;
box-sizing: border-box;
cursor: pointer;
grid-column: 4;
grid-row: 1;
align-self: center;
justify-self: center;
position: relative;
display: block;
aspect-ratio: 1;
width: 56px;
color: var(--color-theme);
font-size: 0;
overflow: hidden;
pointer-events: all;
&:before,
&:after{
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 75%;
height: 2px;
background: currentColor;
}
&:before{
transform: translate(-50%, -50%) rotate(45deg);
}
&:after{
transform: translate(-50%, -50%) rotate(-45deg);
}
}
& a{
&:hover{
color: var(--color-theme);
}
}
#navGlobal,
#navPickup,
#navExtra,
#navLanguage,
#navSns{
grid-column: 1 / 5;
padding: 32px;
border-top: 1px solid #dedede;
}
#navSearch{
grid-column: 2;
grid-row: 1;
align-self: center;
margin-left: clamp(8px, calc(16 / 768 * 100dvw), 16px);
}
#navFavorite{
grid-column: 3;
grid-row: 1;
align-self: center;
margin-left: clamp(8px, calc(16 / 768 * 100dvw), 16px);
}
}
#navGlobal{
& details{
&::details-content{
display: contents;
}
}
& summary{
font-weight: 700;
font-size: 20px;
letter-spacing: 0.05em;
}
& ul{
display: grid;
grid-auto-flow: column;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(10, auto);
grid-row-gap: 4px;
margin-top: 16px;
}
& li{
display: contents;
}
& a{
display: grid;
grid-template-columns: auto 1fr;
column-gap: 0.5em;
font-weight: 500;
font-size: 14px;
&:before{
content: "-";
}
}
}
#navPickup{
& ul{
display: grid;
grid-row-gap: 8px;
margin-top: 16px;
}
& li{
display: contents;
}
& a{
display: grid;
grid-template-columns: auto 1fr auto;
column-gap: 0.5em;
font-weight: 500;
font-size: 14px;
&:before{
content: "";
aspect-ratio: 1;
width: 12px;
border: 3px solid var(--color-theme);
border-radius: 100%;
transform: translateY(calc(0.825em - 50%));
}
&:after{
content: "";
aspect-ratio: 1;
width: 14px;
background: var(--color-theme);
transform: translateY(calc(0.825em - 50%));
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
}
}
}
#navExtra{
& details{
&::details-content{
display: contents;
}
}
& summary{
font-weight: 700;
font-size: 20px;
letter-spacing: 0.05em;
}
& ul{
display: grid;
grid-row-gap: 8px;
margin-top: 16px;
}
& li{
display: contents;
}
& a{
display: grid;
grid-template-columns: 1fr auto;
column-gap: 0.5em;
font-weight: 500;
font-size: 14px;
&:after{
content: "";
aspect-ratio: 1;
width: 14px;
background: var(--color-theme);
transform: translateY(calc(0.825em - 50%));
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
}
}
}
#navLanguage{
& details{
&::details-content{
display: contents;
}
}
& summary{
font-weight: 700;
font-size: 20px;
letter-spacing: 0.05em;
}
& ul{
display: grid;
grid-row-gap: 8px;
margin-top: 16px;
}
& li{
display: contents;
}
& a{
display: grid;
grid-template-columns: auto 1fr auto;
column-gap: 0.5em;
font-weight: 500;
font-size: 14px;
&:before{
content: "-";
}
&:after{
content: "";
aspect-ratio: 1;
width: 14px;
background: var(--color-theme);
transform: translateY(calc(0.825em - 50%));
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
}
}
}
#navSns{
padding: 8px;
& ul{
display: flex;
justify-content: center;
column-gap: clamp(16px, calc(24 / 1200 * 100dvw), 24px);
}
& li{
display: contents;
}
& a{
display: block;
aspect-ratio: 1;
width: 24px;
background: currentColor;
font-size: 0;
-webkit-mask: no-repeat center / contain;
&[href*="facebook.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href*="x.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href*="youtube.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href*="instagram.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
}
}
#navSearch{
& details{
position: relative;
&[open]::details-content{
position: absolute;
top: calc(100% + 8px);
right: 0;
min-width: 100%;
padding: 8px;
background: #fff;
border-radius: 8px;
filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.3));
transform: translateX(64px);
}
}
& summary{
display: block;
aspect-ratio: 1;
width: 18px;
background: currentColor;
font-size: 0;
color: var(--color-theme);
cursor: pointer;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
&:hover{
color: var(--color);
}
}
& form.gsc-search-box{
all: unset;
box-sizing: border-box;
display: grid;
grid-template-columns: 1fr auto auto;
align-items: center;
width: 18em;
overflow: hidden;
}
& input.gsc-input{
all: unset;
box-sizing: border-box;
width: calc(100% - 16px) !important;
height: auto !important;
margin: 0 8px !important;
&::placeholder{
color: #b3b3b3;
}
}
& button.gsc-search-button{
all: unset;
box-sizing: border-box;
cursor: pointer;
grid-column: 3;
display: block !important;
aspect-ratio: 1;
width: 28px;
margin: 8px;
background: currentColor;
font-size: 0;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
& svg{
display: none;
}
}
& a.gsst_a{
aspect-ratio: 1;
width: 16px;
background: currentColor;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
& span{
all: unset;
display: contents;
}
}
}
#navFavorite{
& a{
display: block;
aspect-ratio: 1;
width: 18px;
background: currentColor;
color: var(--color-theme);
font-size: 0;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
&:hover{
color: var(--color);
}
}
}
#pagePath{
display: grid;
grid-template-columns: var(--wrap);
justify-content: center;
padding: 8px 0;
background: #edf5f1;
& ul{
display: flex;
flex-wrap: wrap;
grid-gap: 0.25em 0.5em;
font-weight: 500;
font-size: clamp(12px, calc(14 / 768 * 100dvw), 14px);
}
& li{
display: contents;
&:nth-child(n+2){
&:before{
content: "\3E";
}
}
}
& a{
text-decoration: underline;
&:hover{
color: var(--color-theme);
}
}
}
#footer{
display: grid;
grid-template-columns: var(--wrap);
justify-content: center;
padding: 40px 0 clamp(16px, calc(32 / 1200 * 100dvw), 32px) 0;
background: var(--color-theme);
color: #fff;
& a:hover{
color: var(--color);
}
}
#fNav{
display: grid;
#fNavGlobal{
order: 1;
margin-top: clamp(16px, calc(48 / 1200 * 100dvw), 48px);
}
#fNavSns{
margin-top: 32px;
}
}
#fNavHome{
display: flex;
justify-content: center;
& a{
display: block;
aspect-ratio: 1 / 0.25;
width: min(90%, 440px);
background: url('/common/images/logoType.svg') no-repeat center / contain;
font-size: 0;
&:hover{
color: inherit;
}
}
}
#fNavGlobal{
& details{
&:nth-child(1){
& ul{
grid-auto-flow: column;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(10, auto);
}
}
}
& summary{
border-bottom: 1px solid rgba(255, 255, 255, 0.6);
font-weight: 700;
font-size: 18px;
}
& summary+div{
margin-top: 16px;
}
& ul{
display: grid;
grid-row-gap: 4px;
}
& li{
display: contents;
}
& a{
display: grid;
grid-template-columns: auto 1fr;
column-gap: 0.5em;
&:before{
content: "-";
}
}
@media (max-width: 991.98px) {
& summary{
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
min-height: 64px;
cursor: pointer;
&:before,
&:after{
content: "";
grid-column: 2;
grid-row: 1;
aspect-ratio: 1;
width: 32px;
}
&:before{
border: 1px solid currentColor;
border-radius: 100%;
}
&:after{
background: currentColor;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
}
[open] &:after{
transform: scale(1, -1);
}
}
}
@media (min-width: 992px) {
display: grid;
grid-template-columns: 2fr 1fr 1fr;
column-gap: 40px;
& details{
&::details-content{
display: contents;
}
}
& summary{
padding-bottom: 16px;
text-align: center;
}
}
}
#fNavSns{
& ul{
display: flex;
justify-content: center;
column-gap: clamp(16px, calc(24 / 1200 * 100dvw), 24px);
}
& li{
display: contents;
}
& a{
display: block;
aspect-ratio: 1;
width: 24px;
background: currentColor;
font-size: 0;
-webkit-mask: no-repeat center / contain;
&[href*="facebook.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href*="x.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href*="youtube.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
&[href*="instagram.com"]{
-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,');
}
}
}
#copyright{
margin-top: clamp(40px, calc(48 / 1200 * 100dvw), 48px);
font-size: clamp(12px, calc(16 / 768 * 100dvw), 16px);
text-align: center;
}
#pageTop{
position: sticky;
bottom: 0;
display: grid;
grid-template-columns: var(--wrap);
justify-content: center;
align-content: end;
align-items: end;
height: 0;
transition: opacity 0.2s ease-out;
.scrollTop &{
opacity: 0;
}
&:hover{
&:before,
& a{
background: var(--color-theme);
}
}
&:before{
content: "";
grid-column: 1;
grid-row: 1;
justify-self: end;
aspect-ratio: 300 / 137;
width: 60px;
background: var(--color);
transform: translateX(16px);
transition: background 0.2s ease-out;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center bottom / contain;
}
& a{
grid-column: 1;
grid-row: 1;
justify-self: end;
display: grid;
justify-items: center;
aspect-ratio: 300 / 137;
width: 84px;
background: var(--color);
color: #fff;
font-weight: 700;
font-size: 12px;
letter-spacing: 0.2em;
text-indent: 0.2em;
line-height: 1;
cursor: pointer;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center bottom / contain;
&:before{
content: "";
aspect-ratio: 1;
width: 16px;
background: currentColor;
transform: translateY(3px);
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
}
}
}
#pagenation{
overflow: hidden;
[lsc-lb*="lscListPgn"]{
display: none;
}
& ul,
& ol{
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
grid-gap: 8px;
list-style: none;
}
& ul{
column-gap: 1em;
& li{
display: contents;
&:nth-child(n+2):before{
content: "|";
}
}
}
& ol{
& a{
&[rel="prev"]{
margin-right: 16px;
}
&[rel="next"]{
margin-left: 16px;
}
}
}
& a{
display: grid;
text-decoration: none;
&:not([rel]){
aspect-ratio: 1;
width: 48px;
place-items: center;
border: 1px solid currentColor;
border-radius: 8px;
color: var(--color-theme);
font-weight: 500;
font-size: 18px;
&:hover{
background: #edf5f1;
}
}
&[rel]{
align-items: center;
grid-gap: 4px;
color: var(--color-theme);
font-weight: 700;
&:before{
aspect-ratio: 1;
background: currentColor;
-webkit-mask: url('data:image/svg+xml;charset=UTF-8,') no-repeat center / contain;
}
}
&[rel="prev"]{
grid-template-columns: 16px auto;
&:before{
content: "";
transform: scale(-1, 1);
}
}
&[rel="next"]{
grid-template-columns: auto 16px;
&:before{
content: "";
order: 1;
}
}
&.lsc-current-page{
background: var(--color-theme);
border-color: transparent;
color: #fff;
pointer-events: none;
}
}
}
[id^="gMap"]{
& button{
all: unset;
}
}
.infoWin{
[LSC-LB="dummy"] &,
[LSC-LT="dummy"] &{
width: clamp(240px, calc(320 / 1200 * 100dvw), 320px);
padding: 16px;
background: #fff;
border-radius: 8px;
filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.2));
}
& dl{
display: flex;
flex-wrap: wrap;
justify-content: center;
grid-gap: 8px;
max-width: min(80vw, 320px);
}
& dt{
width: 100%;
font-weight: 700;
font-size: clamp(12px, calc(16 / 768 * 100dvw), 16px);
letter-spacing: 0.05em;
}
& dd{
&:has(img){
width: 100%;
}
& img{
aspect-ratio: 3 / 2;
object-fit: cover;
}
&:has(a){
display: contents;
}
& a{
display: grid;
align-items: center;
width: calc(50% - 8px);
min-height: 32px;
padding: 0.25em 1em;
border-radius: 8px;
background: var(--color-theme);
color: #fff;
font-size: clamp(10px, calc(12 / 768 * 100dvw), 12px);
text-align: center;
text-decoration: none;
&[href*="google"]{
order: 1;
background: var(--color);
}
}
}
}
.gsc-search-box{
& div,
& table,
& tbody,
& tr,
& td{
display: contents;
}
& td.gsc-search-button{
display: contents !important;
}
}
:root{
--header-logoType-pc: url('data:image/svg+xml;charset=UTF-8,');
--header-logoType-sp: url('data:image/svg+xml;charset=UTF-8,');
}