@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
.samterimgviewer {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.samterimgviewer .samter-hidden {
  display: none;
}

.samterimgviewer .samter-img-position-log {
  background-color: #FFFFFF;
  border: 1px solid #000000;
  z-index: 99;
}

/*vr 배경색*/

.samterimgviewer .samter-img-container {
  background-color: #fff;
  background: linear-gradient(to bottom, #fff, #fff);
}

.samterimgviewer .samter-img-container .samter-img {
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

/* @media all and (min-width: 1025px) {
  메뉴 컨테이너 크기와 위치
  .samterimgviewer .samter-menu-container {
    left: 100%;
    top: 50%;
    margin-left: -70px;
    transform: translateY(-50%);
    position: absolute;
  }
  메뉴 리스트의 공통 적용 스타일
  .samterimgviewer .samter-menu-container .samter-menu-list {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
  }
  메뉴 아이템의 공통 적용 스타일
  .samterimgviewer .samter-menu-container .samter-menu-item {
    background-repeat: no-repeat;
    cursor: pointer;
  }
} */

@media all and (max-width: 1024px) {
  /* 메뉴 컨테이너 크기와 위치*/
  .samterimgviewer .samter-menu-container {
    width: 100%;
    bottom: 0%;
    left: 0;
    background-color: rgba(255, 255, 255, .8);
    border-top: 1px solid #ccc;
    position: fixed;
  }
  /* 메뉴 리스트의 공통 적용 스타일*/
  .samterimgviewer .samter-menu-container .samter-menu-list {
    width: 100%;
    margin: 0px;
    padding: 0px;
    float: left;
    list-style-type: none;
  }
  /* 메뉴 아이템의 공통 적용 스타일 */
  .samterimgviewer .samter-menu-container .samter-menu-item {
    width: 100%;
    float: inherit;
    box-sizing: border-box;
    background-repeat: no-repeat;
    cursor: pointer;
  }
}

/* 메뉴의 버튼 모양 ===============================================================================*/

/* 메뉴 리스트에 대한 버튼의 폭과 높이 */

.samter-menu-subTagMenu-list>.samter-menu-list>.samter-menu-list-side-bar {
  display: none;
  opacity: 0;
}

/* .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item .samter-menu-item-content {
  width: 50px;
  height: 65px;
  margin: 20px 0px;
  background-size: 100%;
} */

.samterimgviewer .samter-menu-subTagMenu {
  position: absolute;
  z-index: 10;
  width: 120px;
  height: auto;
  padding: 7px;
  background-color: transparent;
  z-index: 100;
}

.samterimgviewer .samter-menu-subTagMenu ul.samter-menu-list>li {
  margin: 4px 0px;
  padding: 2px;
  text-align: center;
  color: #fff;
  background-color: #3bacc9;
  cursor: pointer;
  border-radius: 3px;
}

@media all and (min-width: 1025px) {
  /* 버튼의 구분선 표시*/
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item {
    border-bottom: 1px solid #000000;
  }
}

@media all and (max-width: 1024px) {
  /* 버튼의 구분선 표시*/
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item {
    border-bottom: 0;
  }
}

/* 마지막 버튼은 하단에 구분선이 없다 */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item:last-child {
  border-bottom: none;
}

/* 버튼 아이콘 설정 */

/* 사용법 */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-manual .samter-menu-item-content,
.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-manual-2d .samter-menu-item-content {
  background-image: url("../img/manual_on.png");
}

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-manual .samter-menu-item-content:hover,
.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-manual-2d .samter-menu-item-content:hover {
  background-image: url("../img/manual_over.png");
}

/* 초기화 */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-reset .samter-menu-item-content {
  background-image: url("../img/reset_on.png");
}

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-reset>.samter-menu-item-content:hover {
  background-image: url("../img/reset_over.png");
}

/* 돋보기 버튼 */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-mgglass>.samter-menu-item-content {
  background-image: url("../img/glass_on.png");
}

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-mgglass>.samter-menu-item-content:hover {
  background-image: url("../img/glass_over.png");
}

/* 태그 */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-detail>.samter-menu-item-content {
  background-image: url("../img/detail.on.gif");
}

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-detail>.samter-menu-item-content:hover {
  background-image: url("../img/detail_over.png");
}

/* SNS */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-sns>.samter-menu-item-content {
  background-image: url("../img/sns_on.png");
}

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-sns>.samter-menu-item-content:hover {
  background-image: url("../img/sns_over.png");
}

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-exit>.samter-menu-item-content {
  background-image: url("../img/exit_on.png");
}

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-exit>.samter-menu-item-content:hover {
  background-image: url("../img/exit_over.png");
}

/*meun 버튼 크기 조정*/

/* @media all and (max-width: 1024px) {
  .samterimgviewer .samter-menu-container .samter-menu-list-1>* {
    width: 16.6%;
  }
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item>.samter-menu-item-content {
    width: 50px;
    height: 65px;
    background-size: 50px 65px;
    margin: 13px 0;
    box-sizing: border-box;
    margin-left: 50%;
    transform: translateX(-50%);
  }
}

@media all and (max-width: 768px) {
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item>.samter-menu-item-content {
    width: 40px;
    height: 52px;
    background-size: 40px 52px;
  }
}

@media all and (max-width: 581px) {
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item>.samter-menu-item-content {
    width: 35px;
    height: 45px;
    background-size: 35px 45px;
  }
}

@media all and (max-width: 480px) {
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item>.samter-menu-item-content {
    width: 30px;
    height: 39px;
    background-size: 30px 39px;
  }
} */

/*메뉴 화면 크기별 사이즈 시작 ====================================================================*/

@media (min-width: 1025px) and (max-height:768px) {
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item .samter-menu-item-content {
    width: 40px;
    height: 52px;
    margin: 18px 0px;
    background-repeat: no-repeat;
  }
  .samterimgviewer .samter-menu-container {
    margin-left: -70px;
  }
}

@media (min-width: 1025px) and (max-height:581px) {
  #fixed-icon-fullbtn {
    margin: 15px !important;
  }
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item .samter-menu-item-content {
    width: 35px;
    height: 45px;
    margin: 16px 0px;
    background-repeat: no-repeat;
  }
  .samterimgviewer .samter-menu-container {
    margin-left: -60px;
  }
}

@media (min-width: 1025px) and (max-height: 400px) {
  #fixed-icon-fullbtn {
    margin: 15px 19px !important;
    font-size: 30px !important;
  }
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-item .samter-menu-item-content {
    width: 30px;
    height: 39px;
    margin: 8px 0px;
    background-repeat: no-repeat;
  }
  .samterimgviewer .samter-menu-container {
    margin-left: -40px;
  }
}

/* 세부 목록 버튼*/

/* 세부 목록 버튼의 폭과, 높이, 마우스 커서 스타일 */

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-item .samter-menu-item-content {
  width: 100%;
  height: 21px;
  cursor: default;
  font-size: 8pt;
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

/* SNS 버튼 크기 */

.samterimgviewer .samter-menu-container .samter-menu-sns .samter-menu-item .samter-menu-item-content {
  width: 27px !important;
  height: 27px !important;
}

.samter-menu-list-side-bar {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 22px;
  height: 100% !important;
}

/* sns sideBar 숨기기*/

li.samter-menu-sns .samter-menu-list-side-bar {
  display: none;
}

/* 버튼에 표시되는 텍스트 위치조정 */

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-item .samter-menu-item-content {
  text-align: left;
  cursor: pointer;
  font-family: '나눔고딕', NanumGothic, 'Nanum Gothic', "맑은 고딕", serif !important;
}

/* 버튼에 표시되는 텍스트 크기 조정 */

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-item .samter-menu-item-content span {
  font-size: 12px;
  font-weight: bold;
}

/* 이름만 표시되는 버튼 스타일 .samter-menu-nomal-button*/

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-nomal-button {
  text-align: center;
  color: #1681d9;
  padding-left: 33px;
  margin-bottom: 3px;
}

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-nomal-button:hover {
  color: #0d47a1;
}

/* 블록 형태의 버튼 스타일 .samter-menu-block-button*/

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-block-button {
  text-align: center;
  padding: 0 5px 0px 33px;
  color: #000;
}

/*서브 메뉴 이름만 표시되는 버튼 스타일 .samter-menu-nomal-button*/

.samterimgviewer .samter-menu-container .samter-menu-list-3 .samter-menu-nomal-button {
  margin-bottom: 3px;
  text-align: center;
  color: #2c98a6;
}

.samterimgviewer .samter-menu-container .samter-menu-list-3 .samter-menu-nomal-button:hover {
  color: #0d5d67;
}

/* 서브 메뉴 블록 형태의 버튼 스타일 .samter-menu-block-button*/

.samterimgviewer .samter-menu-container .samter-menu-list-3 .samter-menu-block-button {
  color: #000;
}

.samterimgviewer .samter-menu-container .samter-menu-list-3 .samter-menu-block-button:hover {
  color: #215996;
}

/*menu list sideBar, button:hover 색*/

.samter-menu-detail.aepel>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #37abb8;
}

.samter-menu-detail.aepel>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #37abb8;
}

.samter-menu-detail.mediumaquamarine>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #73c9c3;
}

.samter-menu-detail.mediumaquamarine>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #73c9c3;
}

.samter-menu-detail.mediumaquamarine>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.mediumaquamarine>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #73c9c3;
}

.samter-menu-detail.crimson>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #e43d3e;
}

.samter-menu-detail.crimson>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #e43d3e;
}

.samter-menu-detail.crimson>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.crimson>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #e43d3e;
}

.samter-menu-detail.sandybrown>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #f5b13c;
}

.samter-menu-detail.sandybrown>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #f5b13c;
}

.samter-menu-detail.sandybrown>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.sandybrown>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #f5b13c;
}

.samter-menu-detail.darkslategray>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #1c3c24;
}

.samter-menu-detail.darkslategray>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #1c3c24;
}

.samter-menu-detail.darkslategray>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.darkslategray>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #1c3c24;
}

.samter-menu-detail.darkslateblue>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #215996;
}

.samter-menu-detail.darkslateblue>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #215996;
}

.samter-menu-detail.darkslateblue>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.darkslateblue>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #215996;
}

.samter-menu-detail.mediumSeaGreen>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #45b35d;
}

.samter-menu-detail.mediumSeaGreen>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #45b35d;
}

.samter-menu-detail.mediumSeaGreen>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.mediumSeaGreen>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #45b35d;
}

.samter-menu-detail.seaGreen>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #2e7540;
}

.samter-menu-detail.seaGreen>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #2e7540;
}

.samter-menu-detail.seaGreen>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.seaGreen>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #2e7540;
}

.samter-menu-detail.pero>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #bb7733;
}

.samter-menu-detail.pero>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #bb7733;
}

.samter-menu-detail.pero>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.pero>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #bb7733;
}

.samter-menu-detail.silver>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #ccccbb;
}

.samter-menu-detail.silver>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #ccccbb;
}

.samter-menu-detail.silver>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.silver>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #ccccbb;
}

.samter-menu-detail.darkgray>div.samter-menu-sublist>ul>div.samter-menu-list-side-bar {
  background-color: #aaaaaa;
}

.samter-menu-detail.darkgray>div.samter-menu-sublist>ul>li.samter-menu-block-button:hover {
  color: #aaaaaa;
}

.samter-menu-detail.darkgray>div.samter-menu-sublist>ul>li.activeBlockClass,
.samter-menu-detail.darkgray>div.samter-menu-sublist>ul>li.activeDetailBlockClass {
  color: #aaaaaa;
}

/* 메뉴 구분선 */

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-item-line {
  background-color: #FFFFFF;
  background-image: url("../img/item_line.png");
  background-repeat: repeat-x;
}

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-item-line:hover {
  background-color: #FFFFFF;
}

/* SNS 버튼 - 트위터*/

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-sns-twitter-button>.samter-menu-item-content {
  background-image: url("../img/sns/twitter.png");
}

/* SNS 버튼 - 페이스북*/

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-sns-facebook-button>.samter-menu-item-content {
  background-image: url("../img/sns/facebook.png");
}

/* SNS 버튼 - 카카오톡*/

.samterimgviewer .samter-menu-container .samter-menu-list-2 .samter-menu-sns-kakaotalk-button>.samter-menu-item-content {
  background-image: url("../img/sns/kakaotalk.png");
}

.samterimgviewer .samter-menu-container .samter-menu-list-2 li.samter-menu-item>.samter-menu-item-content {
  background-size: 100% 100%;
  margin: 15px 0;
  height: auto;
}

@media all and (max-width: 1024px) {
  .samterimgviewer .samter-menu-container .samter-menu-list-2 li.samter-menu-item>.samter-menu-item-content {
    margin: 5px 0;
  }
  .samterimgviewer .samter-menu-container .samter-menu-list-2 li.samter-menu-item>.samter-menu-item-content span {
    font-size: 11px;
  }
  .samterimgviewer .samter-menu-container .samter-menu-sns .samter-menu-sublist {
    /* position: relative !important; */
  }
  .samterimgviewer .samter-menu-container .samter-menu-sns .samter-menu-list-2 .samter-menu-item .samter-menu-item-content {
    margin: 10px;
  }
}

/* 끝 - 세부 목록 버튼 ================================================================================================= */

/* 세부목록 말풍선 모양 ============================================================================================*/

@media all and (min-width: 1025px) {
  /* 세부목록이 들어가 있는 DIV 스타일*/
  .samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist {
    position: absolute;
    width: 200px;
    /* min-height: 50px; */
    margin-top: -30px;
    margin-left: -210px;
  }
  .samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist-3 {
    width: 205px;
  }
  /* 목록 DIV 내부의 스타일 */
  .samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist .samter-menu-list {
    width: 100%;
    /* width: 200px; */
    min-height: 45px;
    box-sizing: border-box;
    /* padding: 7px; */
    background-color: #FFF;
    border: 1px solid #f3f3f3;
    box-shadow: 5px 4px 20px -5px rgba(0, 0, 0, 0.6);
    cursor: default;
  }
  .samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist .samter-menu-list-3 {
    /* border: 2px solid #2c98a6; */
  }
}

@media all and (max-width: 1024px) {
  /* 세부목록이 들어가 있는 DIV 스타일*/
  .samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist {
    /* width: 100vw; */
    /* height: 100vh; */
    /* top: 0;
    left: 0; */
    min-height: 100px;
    position: fixed;
    margin: 0 !important;
  }
  /* 목록 DIV 내부의 스타일 */
  .samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist .samter-menu-list {
    width: 85vw;
    min-height: 45px;
    left: 50%;
    bottom: 9%;
    background-color: #FFFFFF;
    border: 1px solid #f3f3f3;
    cursor: default;
    position: fixed;
    transform: translateX(-50%);
    box-shadow: 0px 0px 25px -5px rgba(0, 0, 0, 1);
  }
  @media screen and (orientation:landscape) {
    .samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist .samter-menu-list {
      width: 85vw;
      left: 50%;
      bottom: 21%;
      padding: 8px;
      background-color: #FFFFFF;
      cursor: default;
      position: fixed;
      transform: translateX(-50%);
    }
  }
}

.samterimgviewer .samter-menu-container .samter-menu-list-1 .samter-menu-detail>.samter-menu-sublist.samter-menu-sublist-3 {
  top: 30px;
  margin-left: -250px;
}

/* 상위 메뉴 버튼은 크기가 크기 때문에 세부목록 DIV 위치를 조절한다 */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-detail>.samter-menu-sublist {
  margin-top: -110px;
}

/* SNS 메뉴의 세부 목록은 아이콘만 뜨기 때문에 폭을 좁힌다.*/

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-sns .samter-menu-sublist {
  width: 100px;
  min-height: 143px;
  margin-top: -110px;
  margin-left: -100px;
}

/* SNS 목록 DIV 내부의 스타일 */

.samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-sns .samter-menu-sublist .samter-menu-list {
  width: 53px;
  min-height: 86px;
  padding: 0px 11px;
  border-radius: 10px;
  background-color: #FFFFFF;
}

@media all and (max-width: 1024px) {
  /*sns*/
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-sns .samter-menu-sublist .samter-menu-list {
    width: auto;
    left: 80%;
    padding: 8px;
    min-height: 36px;
  }
  .samterimgviewer .samter-menu-container .samter-menu-list-1>.samter-menu-sns .samter-menu-sublist .samter-menu-list li {
    width: 50%;
  }
}

/* 끝 - 세부목록 말풍선 모양 ============================================================================================*/

/* 돋보기 */

.samterimgviewer .samter-magnifyingglass-container {
  border: 1px solid #B7B7B7;
  /*background-color: #D9D9D9;*/
  background-color: #fff;
  z-index: 2;
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

/* 사용법 팝업 ============================================================================================*/

@media all and (min-width: 1025px) {
  .samterimgviewer .samter-manual-container .samter-manual {
    /*background-image: url("../img/submenu_right.png") ;*/
    /*background-repeat: no-repeat;
    background-position-y: center;
    background-position-x: right;*/
  }
  /* 폭의 수치는 자바스트립트에서 고정되어 있다 */
  /* 높이는 이미지에 맞게 설정하면 된다 */
  .samterimgviewer .samter-manual-container .samter-manual div {
    width: 362px;
    min-height: 122px;
    margin-top: 0px;
    background-size: 100% 100%;
    background-image: url("../img/manual_1.png");
    border: 1px solid #ccc;
    border-radius: 10px;
    background-color: #FFFFFF;
    /*box-shadow: -3px 3px 5px -3px;*/
  }
  .samterimgviewer .samter-manual-container .samter-manual-2d div {
    width: 362px;
    min-height: 65px;
    margin-top: 20px;
    background-size: 100% 100%;
    background-image: url("../img/manual_2.jpg");
    border: 1px solid #ccc;
    border-radius: 10px;
    background-color: #FFFFFF;
    /*box-shadow: -3px 3px 5px -3px;*/
  }
}

@media all and (max-width: 1024px) {
  .samterimgviewer .samter-manual-container .samter-manual {
    width: 278px !important;
    height: 124px !important;
    top: 75% !important;
    left: 50% !important;
    position: fixed !important;
    transform: translate(-50%, -75%);
  }
  .samterimgviewer .samter-manual-container .samter-manual-2d {
    width: 300px !important;
    height: 65px !important;
    top: 75% !important;
    left: 50% !important;
    position: fixed !important;
    transform: translate(-50%, -75%);
  }
  /* 폭의 수치는 자바스트립트에서 고정되어 있다 */
  /* 높이는 이미지에 맞게 설정하면 된다 */
  .samterimgviewer .samter-manual-container .samter-manual div {
    min-height: 122px;
    margin-top: 0px;
    background-size: 100% 100%;
    background-image: url("../img/manual_1.png");
    border: 1px solid #ccc;
    border-radius: 10px;
    background-color: #FFFFFF;
  }
  .samterimgviewer .samter-manual-container .samter-manual-2d div {
    min-height: 65px;
    background-image: url("../img/manual_2.jpg");
    background-size: 100% 100%;
    border-radius: 10px;
    border: 1px solid #ccc;
    background-color: #FFFFFF;
    /*width: 362px;*/
    /*margin-top: 20px;*/
    /*box-shadow: -3px 3px 5px -3px;*/
  }
}

/* 끝 - 사용법 팝업 ============================================================================================*/

/* 진행방 영역 ============================================================================================*/

/*.samter-progressbar-field {
background-color: #E3E3E1;
background: linear-gradient(to bottom,#F8F7F5, #E3E3E1);
}

.samter-progressbar-base {
width: 80%;
height: 30px;
top: 50%;
left: 10%;
margin-top: -30px;
margin-left: -5px;
position: absolute;
background-color: #D8D8D8;
border-radius: 10px;
box-shadow: -3px 3px 5px -3px;
}

.samter-progressbar-bar {
height: 30px;
background-color: #9172D0;
border-radius: 10px;
}*/

.samter-progressbar-base {
  width: 100%;
  height: 15px;
  position: absolute;
}

.samter-progressbar-bar {
  height: 15px;
  background-color: #1c9ee7;
}

/* 끝 - 진행방 영역 ============================================================================================*/

.samterimgviewer .samter-link-pointer {
  /*background-color: #FF0000;*/
  display: none;
  border-radius: 50%;
}

/* 태그 팝업 스타일 ============================================================================================*/

.samter-tag-popup>img {
  width: 100%;
  height: 100%;
}

.samter-tag-popup .samter-tag-popup-close {
  /*width: 20px;
  height: 20px;
  margin-left: 2px;
  left: 100%;
  position: absolute;
  background-color: #D8D8DA;*/
}

/*특징 규격 닫기버튼 비활성화*/

#samter-menu-feature.samter-tag-popup .samter-tag-popup-close,
#samter-menu-size.samter-tag-popup .samter-tag-popup-close,
#samter-menu-compare.samter-tag-popup .samter-tag-popup-close,
.samter-menu-img.samter-tag-popup .samter-tag-popup-close {
  display: none;
}

.samter-tag-popup .samter-tag-popup-close div {
  width: 20px;
  height: 20px;
  margin-left: auto;
  margin-right: auto;
  /*background-image: url("../img/pop_close.png");*/
}

.samter-tag-popup[class~="samter-link-target-show"] .samter-link-target {
  width: 100%;
  height: 100%;
  max-width: 100px;
  max-height: 100px;
  margin-right: auto;
  float: left;
  background-color: #D8D8DA;
}

/* 끝 - 태그 팝업 스타일 ============================================================================================*/

.samter-link-chain {
  height: 2px;
  border-radius: 1px;
  background-color: #e40000;
}

/*태그 팝업 표시 애니메이션*/

/* left */

@-webkit-keyframes kf-tagpopup-show-left {
  from {
    margin-left: -100px;
    opacity: 0
  }
}

@-moz-keyframes kf-tagpopup-show-left {
  from {
    margin-left: -100px;
    opacity: 0
  }
}

@-o-keyframes kf-tagpopup-show-left {
  from {
    margin-left: -100px;
    opacity: 0
  }
}

@keyframes kf-tagpopup-show-left {
  from {
    margin-left: -100px;
    opacity: 0
  }
}

.samter-animation-left:not(.samter-hidden) {
  -webkit-animation: kf-tagpopup-show-left 0.3s;
  -moz-animation: kf-tagpopup-show-left 0.3s;
  -o-animation: kf-tagpopup-show-left 0.3s;
  animation: kf-tagpopup-show-left 0.3s;
}

/* right */

@-webkit-keyframes kf-tagpopup-show-right {
  from {
    margin-left: 100px;
    opacity: 0
  }
}

@-moz-keyframes kf-tagpopup-show-right {
  from {
    margin-left: 100px;
    opacity: 0
  }
}

@-o-keyframes kf-tagpopup-show-right {
  from {
    margin-left: 100px;
    opacity: 0
  }
}

@keyframes kf-tagpopup-show-right {
  from {
    margin-left: 100px;
    opacity: 0
  }
}

.samter-animation-right:not(.samter-hidden) {
  -webkit-animation: kf-tagpopup-show-right 0.3s;
  -moz-animation: kf-tagpopup-show-right 0.3s;
  -o-animation: kf-tagpopup-show-right 0.3s;
  animation: kf-tagpopup-show-right 0.3s;
}

/* top */

@-webkit-keyframes kf-tagpopup-show-top {
  from {
    margin-top: -100px;
    opacity: 0
  }
}

@-moz-keyframes kf-tagpopup-show-top {
  from {
    margin-top: -100px;
    opacity: 0
  }
}

@-o-keyframes kf-tagpopup-show-top {
  from {
    margin-top: -100px;
    opacity: 0
  }
}

@keyframes kf-tagpopup-show-top {
  from {
    margin-top: -100px;
    opacity: 0
  }
}

.samter-animation-top:not(.samter-hidden) {
  -webkit-animation: kf-tagpopup-show-top 0.3s;
  -moz-animation: kf-tagpopup-show-top 0.3s;
  -o-animation: kf-tagpopup-show-top 0.3s;
  animation: kf-tagpopup-show-top 0.3s;
}

/* bottom */

@-webkit-keyframes kf-tagpopup-show-bottom {
  from {
    margin-top: 100px;
    opacity: 0
  }
}

@-moz-keyframes kf-tagpopup-show-bottom {
  from {
    margin-top: 100px;
    opacity: 0
  }
}

@-o-keyframes kf-tagpopup-show-bottom {
  from {
    margin-top: 100px;
    opacity: 0
  }
}

@keyframes kf-tagpopup-show-bottom {
  from {
    margin-top: 100px;
    opacity: 0
  }
}

.samter-animation-bottom:not(.samter-hidden) {
  -webkit-animation: kf-tagpopup-show-bottom 0.3s;
  -moz-animation: kf-tagpopup-show-bottom 0.3s;
  -o-animation: kf-tagpopup-show-bottom 0.3s;
  animation: kf-tagpopup-show-bottom 0.3s;
}

.samter-subviewer-container {
  border: 1px solid #EAEAEA;
}

.samter-subviewer-container .samter-subviewer-bar {
  background-color: #EAEAEA;
}

.samter-subviewer-container .samter-subviewer-name {
  float: left;
  overflow: hidden;
  cursor: default;
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.samter-subviewer-container .samter-subviewer-name span {
  padding-left: 5px;
  color: #B7B7B7;
  font-size: 1.1em;
  vertical-align: middle;
}

.samter-subviewer-container .samter-subviewer-close {
  background-image: url("../img/pop_close.png");
  background-repeat: no-repeat;
  background-position: center center;
  float: left;
}

.samter-activity-viewer .samter-subviewer-bar {
  background-color: #B7B7B7;
}

.samter-activity-viewer .samter-subviewer-name span {
  color: #EAEAEA;
}

.samterimgviewer .samter-search-container {
  min-width: 250px;
  max-height: 500px;
  top: 30px;
  left: 50%;
  margin-left: -125px;
  border: 1px solid #898989;
  border-radius: 3px;
  position: absolute;
  background-color: #D9D9D9;
}

.samterimgviewer .samter-search-container .samter-search-field {
  width: 240px;
  height: 20px;
  padding: 0px;
  margin: 0px;
  margin-top: 4px;
  margin-left: 4px;
  margin-bottom: 4px;
  border: 1px solid #B7B7B7;
  border-radius: 3px;
}

.samterimgviewer .samter-search-container .samter-search-list-field {
  width: 240px;
  max-height: 450px;
  margin-left: 4px;
  padding-top: 1px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.samterimgviewer .samter-search-container .samter-search-list {
  margin: 0px;
  padding: 0px;
  margin-top: 10px;
  list-style-type: none;
}

.samterimgviewer .samter-search-container .samter-search-item {
  margin-left: 4px;
  margin-bottom: 4px;
  border: 1px solid transparent;
  outline: none;
  cursor: default;
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.samterimgviewer .samter-search-container .samter-search-item:focus {
  color: #EAEAEA;
  background-color: #B7B7B7;
}

.samterimgviewer .samter-search-container .samter-search-item:hover {
  border: 1px solid #B7B7B7;
}








/* logo css */
#logo{
  position: absolute;
  z-index: 100;
  top: 10px;
  left: 10px;
}

#logo > img{
  width: 100%;
}