@charset "UTF-8";
:root{
  --light-c-01:#E3E6ED;
  --light-c-02:#FFFFFF;
  --light-c-03:#F2F3F7;
  --light-c-04:#DBDEE5;
  --light-c-05:#446BEC;
  --light-c-06:#43454F;
  --light-c-07:#373737;
  --light-c-08:#F8F8F8;
  --light-c-09:#BFC8CE;
  --light-c-10:#E2CB00;
  --light-c-11:#D68B00;
  --light-c-12:#43454F;
  --light-c-13:#43454F;
  --light-c-14:#F8F8F8;
  --light-c-15:#4E5160;
  --light-c-16:#DBDEE5;
  --light-c-17:#D5D6DC;
  --light-c-18:#D03946;
  --dark-c-01:#121415;
  --dark-c-02:#4E5160;
  --dark-c-03:#2A2C35;
  --dark-c-04:#212227;
  --dark-c-05:#446BEC;
  --dark-c-06:#F8F8F8;
  --dark-c-07:#CACACA;
  --dark-c-08:#F8F8F8;
  --dark-c-09:#4E5160;
  --dark-c-10:#E2CB00;
  --dark-c-11:#D68B00;
  --dark-c-12:#4E5160;
  --dark-c-13:#F8F8F8;
  --dark-c-14:#F8F8F8;
  --dark-c-15:#4E5160;
  --dark-c-16:#212227;
  --dark-c-17:#121415;
  --dark-c-18:#D03946;
}
html,
body{
  background:transparent;
}

:focus{
  outline:none !important;
}

#manual-common-pagetitle.scroll{
  z-index:9;
}
#vi{
  flex-direction:column;
  width:100%;
  height:auto;
  align-items:center;
  justify-content:center;
  position:relative;
  opacity:1;
  transition:opacity 1s;
  overflow:hidden;
}

#vi .vi-override{
  position:absolute;
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:10;
  width:100%;
  height:100%;
  opacity:0;
  pointer-events:none;
  transition:opacity 1s;
}

#vi .vi-override .loading{
  z-index:10;
}

#vi .vi-override::after{
  content:"";
  width:100%;
  height:100%;
  position:absolute;
  background:#eee;
  top:0;
  left:0;
  pointer-events:none;
  z-index:999;
}

#vi.vi-processing .vi-override{
  transition:opacity 1s;
  opacity:1;
}

#vi *{
  list-style:none;
}

#vi .draggable > div{
  display:flex;
  align-items:center;
}

#vi .slider-box{
  position:relative;
  overflow:hidden;
}

#vi .hidden{
  display:none !important;
}

#vi .notes{
  float:right;
  padding:10px 10px 20px;
}

#vi .notes p{
  font-size:1rem;
  margin-bottom:0;
}
#vi-main{
  margin-bottom:10px;
  overflow:hidden;
  background-color:transparent;
  position:relative;
}

#vi-main *{
  user-select:none;
}

#vi-main #vi-tabs{
  position:absolute;
  top:10px;
  right:46px;
  z-index:8;
  display:flex;
  border-radius:4px;
  margin:auto;
  width:220px;
}

#vi-main #vi-tabs .vi-tab{
  min-width:110px;
  line-height:28px;
  cursor:pointer;
  text-align:center;
  color:#333;
  background-color:#f2f2f2;
  border-bottom:1px solid #888;
  transition:all 0.5s;
  font-size:1.6rem;
}

#vi-main #vi-tabs .vi-tab.on{
  color:#fff;
  background-color:#888;
  transition:all 0.5s;
}

#vi-main #vi-tabs .vi-tab:first-of-type{
  border-radius:4px 0 0 4px;
}

#vi-main #vi-tabs .vi-tab:last-of-type{
  border-radius:0 4px 4px 0;
}

#vi-main #vi-images{
  line-height:0;
  margin-top:0;
  overflow:hidden;
}

#vi-main #vi-images[data-type=in]{
  transform:translate(0, -50%);
}

#vi-main .slider-arrow-area{
  background:transparent;
  width:36px;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  cursor:pointer;
  position:absolute;
  top:0;
  z-index:8;
  background-color:#eee;
  border:1px solid transparent;
}

#vi-main .slider-arrow-area.slider-prev{
  left:-36px;
}

#vi-main .slider-arrow-area.slider-prev span{
  border-left:2px solid #aaa;
  border-top:2px solid #aaa;
  width:12px;
  height:12px;
  border-width:2px;
  transform:rotate(-45deg);
  margin:2px;
}

#vi-main .slider-arrow-area.slider-next{
  right:-36px;
}

#vi-main .slider-arrow-area.slider-next span{
  border-left:2px solid #aaa;
  border-top:2px solid #aaa;
  width:12px;
  height:12px;
  border-width:2px;
  transform:rotate(135deg);
  margin:2px;
}

#vi-main .slider-arrow-area span{
  width:0;
  height:0;
  border:7px solid transparent;
  border-left-width:10px;
  border-right-width:10px;
}

#vi-main .slider-arrow-area .slider-arrow{
  line-height:0;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0;
  cursor:pointer;
  border-radius:25px;
  border:none;
  opacity:1;
  background-color:#eee;
}

@media screen and (min-width: 769px){
  #vi-main .slider-arrow-area:hover span{
    opacity:0.8;
  }
}
#vi-sub{
  margin:0 auto;
  overflow:hidden;
  height:160px;
  background-color:#f2f2f2;
}

@media screen and (max-width: 480px){
  #vi-sub{
    height:90px;
  }
}
#vi-sub #vi-thumbs{
  width:calc(100% - 90px);
  width:calc(100% - 30px);
  margin:0px auto 0px;
}

#vi-sub #vi-thumbs[data-type=in]{
  transform:translate(0, -50%);
}

#vi-sub .slider-arrow{
  line-height:0;
  position:absolute;
  top:50%;
  display:flex;
  justify-content:center;
  align-items:center;
  width:25px;
  height:25px;
  padding:0;
  -webkit-transform:translate(0, -50%);
  -ms-transform:translate(0, -50%);
  transform:translate(0, -50%);
  cursor:pointer;
  border-radius:25px;
  border:1px solid #ddd;
  background:#fff;
}

#vi-sub .slider-arrow.slider-prev{
  left:-35px;
}

#vi-sub .slider-arrow.slider-prev span{
  border-right-color:#666;
  margin-left:-12px;
}

#vi-sub .slider-arrow.slider-next{
  right:-35px;
}

#vi-sub .slider-arrow.slider-next span{
  border-left-color:#666;
  margin-right:-12px;
}

#vi-sub .slider-arrow span{
  width:0;
  height:0;
  border:7px solid transparent;
  border-left-width:10px;
  border-right-width:10px;
}
#vi-images .slider{
  transition:opacity 2s;
  width:calc(100% - 72px);
  margin-left:36px;
}

#vi-images .slider.slick-initialized{
  opacity:1;
  background-color:#fff;
}

#vi-images .slider img{
  max-width:100%;
}

#vi-images .slider .slick-slide{
  align-self:stretch;
  justify-content:center;
}

#vi-images .slider .slick-slide > div,
#vi-images .slider .slick-slide .slider-wrapper,
#vi-images .slider .slick-slide .slider-box{
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:center;
  max-width:100%;
  width:100%;
}

#vi-images .slider .slick-slide .slider-image{
  opacity:0;
  pointer-events:none;
}

#vi-images .slider img{
  object-fit:contain;
  object-position:50% 50%;
  max-width:808px;
  width:100%;
  height:auto;
  height:100%;
}
#vi-thumbs .slider{
  transition:opacity 2s;
}

#vi-thumbs .slider.slick-initialized{
  opacity:1;
}

#vi-thumbs .slider img{
  max-width:100%;
}

#vi-thumbs .slider .slick-slide{
  margin:10px 15px;
  opacity:0.5;
  transition:all 0.5s;
  cursor:pointer;
  padding:10px 0;
  height:140px;
}

@media screen and (max-width: 480px){
  #vi-thumbs .slider .slick-slide{
    height:90px;
    margin:0 5px;
  }
}
#vi-thumbs .slider .slick-slide img{
  height:100%;
  width:100%;
  object-fit:cover;
}

#vi-thumbs .slider .slick-slide div{
  height:100%;
  max-width:180px;
}

@media screen and (max-width: 480px){
  #vi-thumbs .slider .slick-slide div{
    max-width:85px;
  }
}
#vi-thumbs .slider .slick-slide.slick-current{
  opacity:1;
  transition:all 0.5s;
  transform:scale(1.1);
}

#vi-thumbs .slider .slick-slide .slider-box{
  border-radius:6px;
}

.leaflet-container{
  background:transparent;
  top:0;
  bottom:0;
}

.leaflet-container .leaflet-tooltip-left{
  margin-left:-25px;
}

.leaflet-container .leaflet-tooltip-right{
  margin-left:25px;
}

.leaflet-container .leaflet-image-layer{
  pointer-events:auto;
}
#vi-modal{
  display:flex;
  width:100%;
  height:100%;
  justify-content:center;
  align-items:center;
  position:absolute;
  top:0;
  pointer-events:none;
}

#vi-modal *{
  overscroll-behavior-y:none !important;
}

#vi-modal #modal-index{
  width:40%;
  min-width:280px;
  color:#333;
  position:relative;
  pointer-events:auto;
  max-height:60%;
  overflow:hidden;
  z-index:8;
  display:none;
}

#vi-modal #modal-index .modal-index-box{
  display:flex;
  flex-direction:column;
  height:100%;
}

#vi-modal #modal-index #modal-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background-color:#f2f2f2;
  flex-shrink:0;
  border-bottom:2px solid #ddd;
}

#vi-modal #modal-index #modal-header #modal-title{
  font-weight:bold;
}

#vi-modal #modal-index #modal-header #modal-title .modal-text{
  font-size:1.6rem;
  margin:12px 10px 8px;
}

#vi-modal #modal-index #modal-header #modal-close{
  display:flex;
  position:relative;
  cursor:pointer;
  height:22px;
  width:22px;
  margin-right:8px;
  border-radius:4px;
}

@media screen and (min-width: 769px){
  #vi-modal #modal-index #modal-header #modal-close:hover{
    opacity:0.8;
  }
}
@media screen and (max-width: 768px){
  #vi-modal #modal-index #modal-header #modal-close:active{
    background:#f00;
  }
}
#vi-modal #modal-index #modal-header #modal-close div.modal-close-inner{
  position:relative;
  overflow:hidden;
  width:2em;
  height:2em;
}

#vi-modal #modal-index #modal-header #modal-close div div{
  background-color:#aaa;
  width:2px;
  height:18px;
  position:absolute;
  top:2px;
  left:calc(50% - 1px);
}

#vi-modal #modal-index #modal-header #modal-close div div.s{
  transform:rotate(45deg);
}

#vi-modal #modal-index #modal-header #modal-close div div.n{
  transform:rotate(-45deg);
}

#vi-modal #modal-index #modal-list{
  background-color:rgba(255, 255, 255, 0.97);
  overflow-y:auto;
}

#vi-modal #modal-index #modal-list ul li{
  margin:0;
}

#vi-modal #modal-index #modal-list .modal-link{
  text-decoration:none;
  color:#555;
  display:flex;
  justify-content:space-between;
  align-items:center;
  position:relative;
  padding-left:7px;
}

@media screen and (min-width: 769px){
  #vi-modal #modal-index #modal-list .modal-link:hover .modal-text:after{
    content:"";
    position:absolute;
    width:100%;
    height:1px;
    background-color:#eb0a1e;
    top:calc(100% + 2px);
    left:0;
  }
}
@media screen and (max-width: 768px){
  #vi-modal #modal-index #modal-list .modal-link:active{
    background:#999;
  }
}
#vi-modal #modal-index #modal-list .modal-link::after{
  content:"";
  width:4px;
  height:6px;
  border-left:4px solid #888;
  border-bottom:3px solid transparent;
  border-top:3px solid transparent;
  left:6px;
  top:calc(0.5em + 12px - 4px);
  position:absolute;
}

#vi-modal #modal-index #modal-list .modal-no-link{
  color:#bbb;
}

#vi-modal #modal-index .modal-text{
  font-size:1.3rem;
  display:flex;
  align-items:center;
  margin:10px 10px;
  line-height:1.4;
  position:relative;
}

@media all and (-ms-high-contrast: none){
  #vi-modal #modal-index .modal-text{
    vertical-align:middle;
    display:inline-block;
  }
}
#vi-modal #modal-zoom{
  position:absolute;
  width:100%;
  height:100%;
  z-index:8;
  top:-100%;
  left:0;
}

#vi-modal #modal-zoom .zoomed{
  position:absolute;
  width:calc(100% - 72px);
  width:100%;
  height:100%;
  left:36px;
  left:0;
  pointer-events:auto;
  opacity:0;
  overflow:hidden;
  background:rgba(0, 0, 0, 0.7);
}

#vi-modal #modal-zoom .zoomed .slider-box,
#vi-modal #modal-zoom .zoomed .slider-image{
  width:100%;
  height:100%;
  max-width:808px;
  max-width:880px;
}

#vi-modal #modal-zoom .zoomed .slider-image{
  object-fit:contain;
}

#vi-modal #modal-zoom .modal-back{
  display:block;
  width:880px;
  width:100%;
  height:660px;
  height:100%;
  position:absolute;
  z-index:3;
  background:transparent;
}

#vi-modal #modal-zoom .modal-back.before{
  top:0;
  left:0;
  background:#aaf;
}

#vi-modal #modal-zoom .modal-back.after{
  bottom:0;
  right:0;
  background:#afa;
}

#vi-modal #modal-zoom .leaflet-image-overlay{
  display:block;
  background:rgba(255, 0, 0, 0.2);
  z-index:6 !important;
  position:absolute;
  transform-origin:0 0;
  left:0;
  top:0;
}

#vi-modal .leaflet-pane{
  z-index:7 !important;
}

#vi-modal .slider-image{
  opacity:0;
  pointer-events:none;
}
svg{
  transition:transform 0.2s;
}

svg.index,
svg.zoomin{
  width:100%;
  height:100%;
  filter:drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));
  pointer-events:none;
  box-sizing:content-box;
  padding:1px;
}

svg.zoomout{
  width:40px;
  height:40px;
  transform:rotate(45deg);
}

svg.on,
svg.active{
  transform:scale(1.2);
  transition:transform 0.2s;
}

svg.on use,
svg.active use{
  opacity:0.5;
}

.svg-zoomout{
  filter:drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));
  position:absolute;
  top:10px;
  right:10px;
  cursor:pointer;
  z-index:8;
  display:flex;
  align-items:center;
}
.loading{
  width:100px;
  height:100px;
  position:relative;
  margin-bottom:20%;
}

.loading .circle{
  width:100%;
  height:100%;
  position:absolute;
  left:0;
  top:0;
}

.loading .circle::before{
  content:"";
  display:block;
  margin:0 auto;
  width:7%;
  height:7%;
  background-color:#666;
  border-radius:100%;
  -webkit-animation:loaderFadeDelay 1.2s infinite ease-in-out both;
  animation:loaderFadeDelay 1.2s infinite ease-in-out both;
}

.loading .loader2{
  -webkit-transform:rotate(30deg);
  -ms-transform:rotate(30deg);
  transform:rotate(30deg);
}

.loading .loader2::before{
  -webkit-animation-delay:-1.1s;
  animation-delay:-1.1s;
}

.loading .loader3{
  -webkit-transform:rotate(60deg);
  -ms-transform:rotate(60deg);
  transform:rotate(60deg);
}

.loading .loader3::before{
  -webkit-animation-delay:-1s;
  animation-delay:-1s;
}

.loading .loader4{
  -webkit-transform:rotate(90deg);
  -ms-transform:rotate(90deg);
  transform:rotate(90deg);
}

.loading .loader4::before{
  -webkit-animation-delay:-0.9s;
  animation-delay:-0.9s;
}

.loading .loader5{
  -webkit-transform:rotate(120deg);
  -ms-transform:rotate(120deg);
  transform:rotate(120deg);
}

.loading .loader5::before{
  -webkit-animation-delay:-0.8s;
  animation-delay:-0.8s;
}

.loading .loader6{
  -webkit-transform:rotate(150deg);
  -ms-transform:rotate(150deg);
  transform:rotate(150deg);
}

.loading .loader6::before{
  -webkit-animation-delay:-0.7s;
  animation-delay:-0.7s;
}

.loading .loader7{
  -webkit-transform:rotate(180deg);
  -ms-transform:rotate(180deg);
  transform:rotate(180deg);
}

.loading .loader7::before{
  -webkit-animation-delay:-0.6s;
  animation-delay:-0.6s;
}

.loading .loader8{
  -webkit-transform:rotate(210deg);
  -ms-transform:rotate(210deg);
  transform:rotate(210deg);
}

.loading .loader8::before{
  -webkit-animation-delay:-0.5s;
  animation-delay:-0.5s;
}

.loading .loader9{
  -webkit-transform:rotate(240deg);
  -ms-transform:rotate(240deg);
  transform:rotate(240deg);
}

.loading .loader9::before{
  -webkit-animation-delay:-0.4s;
  animation-delay:-0.4s;
}

.loading .loader10{
  -webkit-transform:rotate(270deg);
  -ms-transform:rotate(270deg);
  transform:rotate(270deg);
}

.loading .loader10::before{
  -webkit-animation-delay:-0.3s;
  animation-delay:-0.3s;
}

.loading .loader11{
  -webkit-transform:rotate(300deg);
  -ms-transform:rotate(300deg);
  transform:rotate(300deg);
}

.loading .loader11::before{
  -webkit-animation-delay:-0.2s;
  animation-delay:-0.2s;
}

.loading .loader12{
  -webkit-transform:rotate(330deg);
  -ms-transform:rotate(330deg);
  transform:rotate(330deg);
}

.loading .loader12::before{
  -webkit-animation-delay:-0.1s;
  animation-delay:-0.1s;
}

.hide{
  display:none !important;
}
@-webkit-keyframes loaderFadeDelay{
  0%, 39%, 100%{
    opacity:0;
  }
  40%{
    opacity:1;
  }
}
@keyframes loaderFadeDelay{
  0%, 39%, 100%{
    opacity:0;
  }
  40%{
    opacity:1;
  }
}