@charset "utf-8";

/* ----------------------------------------

stdb_viewer

---------------------------------------- */

.center { text-align: center; }
.right { text-align: right; }
.small { font-size: 0.85em; }
.sp_only { display: none; }
.palt { font-feature-settings: "palt"; }

li.indent-1 {	padding-left:1em;	text-indent:-1em; }
li.indent-2 {	padding-left:2em;	text-indent:-1em; }
.title_style04 > span > span { padding-left: 0; display: inline-block; } 

#bread_crumb { position: relative; display: flex; margin: 0 auto; padding: 15px 0; width: 1084px; }


.wrapper.wrapper_has_aside aside { flex-basis: 220px; }
aside .aside_main_title { margin-bottom: 20px; background: #01addf; letter-spacing: .2em; }
aside .aside_nav { margin: -15px 0 20px; }
.aside_main_title::after { position: absolute; content: ""; right: 0; bottom: 0; width: 62px; height: 60px; background: url(/assets/img/common/aside_bg_viewer.svg) no-repeat right bottom; background-size: 62px auto; opacity: .5; }
.fix_menu { width: 220px; }

.title_main { height: 70px; line-height: 70px; font-weight: bold; letter-spacing: .5rem; background: url(/assets/img/software/software_title_bg01.png) no-repeat center top, linear-gradient(to right, #f2f2f2 50%, #00bbda 50%); background-size: auto 110px; }
.lead { font-size: larger; margin-bottom: 50px; }

.s_bnr_dl { display: grid; gap: 0.5em; } 

.ico_blank { margin: auto 0.5em 0.15em; }

#viewer aside .aside_nav li.aside_nav_viewer > a:link,
#viewer aside .aside_nav li.aside_nav_viewer > a:visited,
#viewer aside .aside_nav li.aside_nav_viewer > a:hover,
#viewer aside .aside_nav li.aside_nav_viewer > a:active,
#viewer_use aside .aside_nav li.aside_nav_s001 > a:link,
#viewer_use aside .aside_nav li.aside_nav_s001 > a:visited,
#viewer_use aside .aside_nav li.aside_nav_s001 > a:hover,
#viewer_use aside .aside_nav li.aside_nav_s001 > a:active,
#viewer_use aside .aside_nav li.aside_nav_s001 > a:active,
#viewer_entry aside .aside_nav li.aside_nav_s002 > a:link, 
#viewer_entry aside .aside_nav li.aside_nav_s002 > a:visited, 
#viewer_entry aside .aside_nav li.aside_nav_s002 > a:hover,
#viewer_entry aside .aside_nav li.aside_nav_s002 > a:active,
#viewer_setting aside .aside_nav li.aside_nav_s003 > a:link,
#viewer_setting aside .aside_nav li.aside_nav_s003 > a:visited,
#viewer_setting aside .aside_nav li.aside_nav_s003 > a:hover,
#viewer_setting aside .aside_nav li.aside_nav_s003 > a:active { background: #e5f7fc; color: #01addf; opacity: 1; } 

.fix_box {
  max-height: calc(100vh - 150px) !important; /* 高さ制限 */
  overflow-y: auto; /* 内部のみスクロール */
  scrollbar-width: none; /* Firefox: スクロールバー非表示 */
}

/* Chrome/Safari用 */
.fix_box::-webkit-scrollbar {
  display: none; /* 内部スクロールバーを非表示 */
}

/* .Vii { position:relative; margin-bottom: 2.5em; background: #ffd977; }
.Vii p { position: absolute; top: 50%; transform: translateY(-50%); right: 15px; z-index:10; width: auto;	display: inline-block; letter-spacing: 0.1em; }
.Vii a { position: relative; display: block; padding: 0.5em 0.7em; text-decoration: none; background: #668ad8; color: #ffffff; font-weight: bold; border-bottom: solid 4px #627295; border-radius: 3px; }
.Vii a::after { content: ""; display: block; width: 8px; height: 8px; border-top: #fff 2px solid; border-right: #fff 2px solid; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; right: 10px; top: 0; bottom: 0; margin: auto; }
.Vii a:hover { transform: translateY(2px); box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);  border-bottom: solid 2px #627295; letter-spacing: 0.1em; }
.Vii a, .Vii a:visited { text-decoration: none; color: #fff; } */

.bnr_dl { width: 75%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5em; margin-bottom: 2.5em; }
.bnr_dl li img { width: 100%; }

.list_viewer > li { position: relative; margin-bottom: 30px; padding-left: 20px; }
.list_viewer > li::before { position: absolute; left: 0; content: "●"; color: #01addf; }

.list_viewer .text { font-weight: bold; color: #01addf; }

ul.kome li { text-indent:-1em; margin-left:1em; }
ul.kome li::before { content:"※"; }
.disc > li { position: relative; margin: 2.5px 0; padding-left: 1.5rem; }
.disc > li::before { position: absolute; top: 10px; left: 3px; width: 4px; height: 4px; font-size: 1em;background-color: #333; content: ""; }

#viewer_use #anc01-1 .disc > li { margin-bottom: 1.2em; }

.btn_wfull { margin-top: 1em; }

.viewer .note { margin: 1.2em 0 1em; padding: 20px; border: 1px solid #c7edf2; }
.viewer .note h3 { margin-bottom: 15px; color: #4bc0d1; font-weight: 700; font-size: 1.8rem; }
.viewer .note p { margin-bottom: 0.5em; color: #4bc0d1; font-size: 1.1em; font-weight: 700; }

.viewer .pagelink01 { margin: 2em 0 1em -1em; gap: 0.5em; display: grid; }
.viewer .pagelink01 a { position: relative; display: block; padding: 2px 22px 2px 50px; color: #333; text-decoration: none; font-weight: 700; font-size: 1.6rem; line-height: 1.1; }
.viewer .pagelink01 a::before { position: absolute; top: 0; bottom: 0; margin: auto; content: ""; vertical-align: middle; left: 22px; width: 18px; height: 18px; background: #01addf; }
.viewer .pagelink01 a::after { position: absolute; bottom: 0; margin: auto; content: ""; vertical-align: middle; top: -3px; left: 28px; width: 7px; height: 7px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(135deg); }
.viewer .pagelink01 li a:hover { text-decoration: none; opacity: .5; }
.viewer .title_style04 { margin-block: 2.5em 1.5em; font-size: 1.2em; }

.privacy.title_style02 { font-size: 1.8rem; }

#privacy { height: 380px; margin: 0.5em auto 1em; padding: 1em; overflow: auto; border: 1px #ccc solid; }

.viewer_tbl { margin-block: 1em 3em; font-size: 0.95em; border-top: 1px solid #c7c7c7; border-right: 1px solid #c7c7c7; }
.viewer_tbl th, .viewer_tbl td { padding: 0.5em 0.7em; text-align: center; border-bottom: 1px solid #c7c7c7; border-left: 1px solid #c7c7c7; }
.viewer_tbl th { font-weight: bold; background-color: #f2f2f2; }
.viewer_tbl th span { color: #f00; }

.viewer_flow h4 { font-size: 1.2em; }
.prot_list { counter-reset: print-step; }
.prot_list > li { counter-increment: print-step; }
.prot_list > li:not(:first-child) { margin-top: 3em; }
.prot_list > li > .title_style02 { position: relative; padding-left: 2em; font-size: 1.2em; }
.prot_list > li > .title_style02::before { position: absolute; left: 0; margin-right: 0.3em; content: counter(print-step); background: #4bc0d1; color: #fff; display: inline-block; width: 1.5em; height: 1.5em; line-height: 1.5em; text-align: center; margin-right: 0.4em; font-weight: bold; }

.prot_list .flex { gap: 1.2em; }
.prot_list figure { max-width: 500px; margin-block: 1em 2em; }
.prot_list figure > img { display: block; }
.prot_list figure.screen_img { max-width: 300px; }

.qr_img { width: 20px; padding-bottom: 0.5em; }

.viewer h3.title_style04 > span { font-size: 1.2em; }
#viewer_use .pagelink01 { gap: 1em; }

h5.title_style05 { font-size: 1.2em; }
.cb_privacy { margin-block: 1.2em 1em; text-align: center; font-size: 1.2em; }
.cb_privacy label,.cb_privacy label input[type="checkbox"]  { cursor: pointer; }
.cb_privacy label input[type="checkbox"]  { transform: scale(1.2); }


#viewer h2.title_style01 { line-height: 1.6; }


#viewer_use #anc01, #viewer_use #anc02, #viewer_use #anc03 { scroll-margin-top: 120px; }

/*----------------------------------------------------
スマホ
-----------------------------------------------------*/
@media screen and (max-width: 767px) {
  .sp_only { display: block; }
  .sp_none { display: none; }
  .title_style01 { line-height: 1.4; letter-spacing: .05rem; font-size: 2.0rem; }
  #bread_crumb { width: auto; flex-wrap: wrap; padding: 10px 4% 0; }
  
  .viewer section { margin-top: 2em; }
  .sec_viewer { margin-top: 1.5em; }
  .Vii { padding: 0.5em 0 }
  .Vii p { display: block; width: 90%; margin: auto; position: unset; transform: unset; }
  .Vii a { line-height: 1.4; font-size: 0.9em; }
  
  
  .s_bnr_dl { grid-template-columns: repeat(3,1fr); }
  .bnr_dl { width: 100%; grid-template-columns: repeat(3, 1fr); margin-inline: auto; }
  .btn_wfull { display: grid; grid-template-columns: repeat(1, 1fr); gap: 0.7em; }
  .btn_wfull a { width: 100%; }
  .viewer .pagelink01 a { line-height: 1.3; }
  .viewer .pagelink01 a span { display: block; }

  #viewer_use .title_style04 { font-size: 1.5rem; }
  #viewer_use #anc01, #viewer_use #anc02, #viewer_use #anc03 { scroll-margin-top: 60px; }

  .lead { margin-bottom: 2em; }




}

@media screen and (max-width: 669px) {
.prot_list .flex { display: block; gap: 0; }
}