/*
 * ==============================================
 * Skin for oXygen generated WebHelp.
 * ==============================================
 */

/* Specify the background color of the page header. 2021.12.09 */
.wh_header_flex_container {
    background-color: rgb(28,128,196);
}
.wh_breadcrumb ol .active {

/* The open titles in the breadcrumb list are not colored. 2021.11.16 */
    color: initial;
}
.wh_breadcrumb .active > span{
    color: initial;
}

/* The color of related-links is different from other links. 2021.12.09 */
.wh_related_links{
}
.wh_child_links,
.wh_topic_content .related-links {
    background-color: rgb(255,255,255);
    padding: 1.5em;
    margin-top: 1.5em;
}
/* Change the color of the top menu 2021.12.19 */
.wh_top_menu ul li a{
    background-color: rgba(28,128,196,0.85);
    color: rgb(255,255,255);
}


/* Color for top menu hover 2021.12.09 */
.wh_top_menu a:hover {
	color: white;
    text-decoration: underline;
}
.wh_top_menu ul ul li a:hover {
    background-color: rgba(28,128,196,0.85);
}
.wh_top_menu ul li+ li {
      border-left: 1px solid white;
}
/* do note display border-left for sub menu 2022.02.24 */
.wh_top_menu ul li ul li+ li {
      border-left: 0px solid white;
}

/* Placement of the top tile 2021.12.09 */
.wh_tiles {
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 40px;
    justify-content: flex-start;
}
.wh_rdg_tiles_lt2 {
    justify-content: center;
}
/* Centering the topic image */
.wh_tile {
	padding: 0;
	border: none;
	background-color: white;
    text-align: center;
    border: 1px solid rgb(205,205,205);
    align-items: center;
    display: flex;
    justify-content: center;
    max-width:360px;
    min-width:100px;
    border-radius: 0;
}
.wh_tile:hover {
    background-color: rgb(240,250,254);
    border: 0px;
}
.wh_tile > a:hover {
    color: rgb(137,137,137);
}
.wh_publication_toc span {
    padding-top: 0.3em;
}
.wh_publication_toc ul > li > span:hover {
/*#48. 2023.04.
    background-color: rgb(240,250,254);
*/
}
.wh_publication_toc ul > li > span[data-state="expanded"]:hover {
/*#48. 2023.04.
    background-color: rgb(240,250,254);
*/
}
.wh_publication_toc ul > li > span[data-state="not-ready"]:hover {
/*#48. 2023.04.
    background-color: rgb(240,250,254);
*/
}
.wh_publication_toc ul > li:hover ul{
    background-color:white;
}
.wh_publication_toc li > ul:hover {
    background-color:white;
}

.wh_publication_toc a:hover {
/* #48. Change from light blue background to underline.  2023.04. 
    background-color: rgb(240,250,254);
	text-decoration: none;
*/
}

.wh_rdg_tile_title_cell {
    color: rgb(137,137,137);
    width:254px;
}
/* 2022.02.24 */
.wh_rdg_tile_title_cell:lang(en) {
    font-size: 18px;
}

/* Image size specification. 2021.12.09 */
.wh_rdg_tile_image {
	width: 15vw;
	height: auto;
    max-width: 98px;
}

.wh_rdg_tile_title {
	border: initial;
}
/* Change the symbol of the list 2022.01.012 */
.wh_topic_content ul {
    padding-left:26px;
}
/* #33. 2023.04. */
.wh_topic_content ul[class*="steps-unordered"] {
    list-style: none;
}

.wh_topic_content ul.related_link {
    padding-left: 0px;
}
nav.related-links > div.relatedlinktitle {
    margin-bottom: 0px;
}

.wh_topic_content li:not(.step) {
 /*   list-style: disc; */ /* #33.  No "●" in substep. 2023.04. */
}
/* Class for the element you want to fill the screen width. */
.widthMax { 
    box-sizing: border-box;
    text-align:center;
    display:block;
    background:rgb(28,128,196);
    color:white;
    height:80px;
    width:100%;
    line-height: 80px;
    font-size: 60px
}
/*
 * ------------------------------------------------------------------
 * content area 
 *
*/
.wh_content_area {
    position: relative;
    max-width: 2050px;
    margin-left:auto;
    margin-right:auto;
    min-height: calc( -235px + 100vh);
/*
    display: flex;
*/
}
.wh_content_area.index_page {
    display: flex;
}

/*
 * ------------------------------------------------------------------
 *  
 * Search area
 * 
 */

/* before
.wh_search_input {
    padding: 0;
	margin: 0;
	box-shadow: none;
    position: fixed
    right: 0;
    z-index: 2;
}
*/
.wh_search_input {
    padding: 0;
	box-shadow: none;
    position: sticky;
    top: 190px;
    margin-bottom: 0px;
/*
    width: 300px;
    margin-left: auto;
*/
    z-index: 2;
}

#searchForm {
    position: absolute;
    /* right: 0px; */
    width: 100%;
}

.wh_rdg_search_input {
    padding: 0;
	margin: 0;
	box-shadow: none;
}

.wh_welcome:not(:empty) {
    padding: 0;
    /* display: none; */
}


/* ----------------------------------------------------------------------
The following is moved from custombase.css 2022.01.07 */
a:hover {
    text-decoration: underline;
}
.wh_header {
    padding: 0;
}
.wh_header > .container-fluid {
    background-color: rgb(28,128,196);
/* 2022.02.24
    max-width: 100vw;
*/
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
.wh_search_button {
	color: white;
	background-color: #2372de;
    border-top-right-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
	/*font-size: 16px;*/
    /* The size is different in version 23.1, so add the following. 2021.10.20 */
    height:2.73em;
	border: none;
    right: inherit;
    position: relative;
    float: none;
}
/* The open title of the breadcrumb list is not colored. font-weight is normal. 2021.11.16 */
.wh_breadcrumb .active .topicref a {
	color: #878787;
	font-weight: normal;
}
.wh_breadcrumb .active > span {
	font-weight: bold;
	color: currentColor;
}
.wh_breadcrumb .active {
	font-weight: bold;
	color: currentColor;
}
.wh_publication_toc {
	background-color: #FFFFFF;
}
.wh_publication_toc a {
    color: rgb(137,137,137);
}
.wh_publication_toc .active > .topicref a {
	color: currentColor;
	font-weight: normal;
}
/* #48.  */
li[role='treeitem'].active>span.topicref[data-state='expanded'],
li[role='treeitem'].active>span.topicref[data-state='leaf'] {
	background-color: rgb(240,250,254);
}


/*
 * ------------------------------------------------------------------
 *  
 * step
 *
 * 2021.11 change
 */
.stepstart {
    display:inline-block;
    color:#0062B1;
    font-weight:bold;
	background-color: transparent;
	padding: 0.2em 0.5em 0.2em 0em;
	border-width:0px;
	line-height:1.4em;
	font-size:20px;
	margin: 0em 0em;
    background-color: inherit;
	box-shadow: none;
}
/*
 * ------------------------------------------------------------------
 *  
 * table
 *
 * 2021.12 change
 */
/* add for version up to 23.1 2021.10.26 */
 table {
	margin: 0em;
}

.li.step .table-wrap {
    margin-left:-13px;
    margin-top: 20px;
}
.table {
    /* #34. Change table width to fit content. 2023.04. 
    width: 100%;
    */
    word-break: break-word; /* cannot fit within the table. 2023.04. */
    width: fit-content;
    min-width: 340px;   /*#12. 2023.05.ウィンドウを小さくしていき、960px以下になると左右のメニューが表示されなくなるため表の幅が広がる挙動となる. */
    /* #12. Horizontal scroll start px value for table. 
    If the number of characters is small, we do not want to scroll (the number of characters cannot be managed by the number of characters). 
    set the minimum width of the table display to 340px, below which it will scroll.450px => 340px. 2023.04. */
}
/*
 * ------------------------------------------------------------------
 *  
 * related links 
 * 
 */
.wh_related_links {
	background-color: #ffffff; /* #eefaff ; backgruond-color change 2021.12.01 */
    padding-left: 0px;
	border-radius: 0.3em;
	
}

div.wh_related_links > nav.related-links {
    margin-bottom: 1em;
    padding-left: 10px;
    border: none;
}

nav.related-links > div.relatedlinktitle {
	display: block;
	font-size: 1.1em;
	font-weight: bold;
    border: none;
}

/* add for version up to 23.1 2021.10.26 */
.linklist {
	margin-bottom: 1em;
}
/*
 * ------------------------------------------------------------------
 *  
 * Note
 * 
 */
/* note background-color 2021.11.25 remove
div.remember {
    background-color:yellow;
    border:2pt solid red;
}
*/
/* Added versin up to 23.1, which changes the icon attribute of note. 2021.10.27 */
div.note {
    padding: 0em 0em 0em 0em;
    background-image: none;
    border:2px solid #00A7B6;
    margin-right: -20px;
}
td div.note {
    margin-right: 0px;
}
/*
 * Responsive images
 * Avoid losing the corners of a square image. add 2021.12.02
 */
img.image:not(img[usemap]) {
    border-radius: 0px;
    /* #28. 2023.04. */
    cursor: default;
    transition: unset;
}
/* #28. 2023.04. */
img.image:not(img[usemap]):hover {
    opacity: 1;
}

/*
 * ------------------------------------------------------------------
 *  
 * Footer
 * Specify the background color.
 */
.wh_footer {
    background-color: rgb(233,237,243)
}
/* ----------------------------------------------------------------------
 *   The following moves the changes in customskin.css 2022.01.07
*/
/*
 * ------------------------------------------------------------------
 *  
 * note 
 * 
 */
.notespan {
	display: block;
	margin-top: 0px;
	margin-bottom: 1em;
	margin-right: 25px;
	margin-left: 25px;
}

/*
 * ------------------------------------------------------------------
 *  
 * note caution
 * 
 */
.notetitle {
	background-image: none !important;
	padding: 0;
}
/*
 * ------------------------------------------------------------------
 *  
 * note danger
 * 
 */
.note.danger {
    background-color:rgb(255, 242, 224);
    border-color:rgb(253, 168, 46);
    margin-left: 0px;
    margin-top: 1.5em;
    display: block;
    width: 100%; /* #21. 2023.04. */
}
.dangertitle {
/*
    height:31px;
*/
    top:-1em;
    left:26px;
    position:relative;
	color: rgb(33, 37, 41);
	background-color:rgb(253, 168, 46);
	background-image: none !important;
	padding: 3px 22px 3px 35px;
	border-radius: 1em;
    background-position: 19px 4px; /* Adjusting the position of icons */
	background-image: url("img/danger.svg") !important;
    font-size: 14px;
    background-size: 1em;
    line-height: 1.2em;
}
/*
 * ------------------------------------------------------------------
 *  
 * note other
 *  #80 2023.04. 
 */
.note.other {
    background-color:rgb(255,224,223);
    border-color:rgb(243,46,46);
	color:rgb(0,0,0);
	margin-top: 2em;	
}
.othertitle {
    top:-1em;
    left:26px;
    position:relative;
	color: rgb(255,255,255);
	background-color:rgb(243,46,46); /* #51 2023.04. */
	padding: 3px 22px 3px 35px;
	border-radius: 1em;
    background-position: 19px 4px; /* Adjusting the position of icons */
	background-image: url("img/danger.svg") !important;
    font-size: 14px;
    background-size: 1em;
    line-height: 1.2em;
	background-repeat: no-repeat;	
}

/*
 * ------------------------------------------------------------------
 *  
 * note warning
 * 
 */
.note.warning { /* #51 2023.04. */
    background-color:rgb(255,249,223);
    border-color:rgb(254,215,43);
    margin-top: 1.5em;
    width: 100%; /* Same as other notes. 2023.04. */
}
.warningtitle {
/*
    height:31px;
*/
    top:-1em;
    left:26px;
    position:relative;
	color: rgb(33,37,41);
	background-color:rgb(254,215,43); /* #51 2023.04. */
	padding: 3px 22px 3px 35px;
	border-radius: 1em;
    background-position: 19px 4px; /* Adjusting the position of icons */
	background-image: url("img/danger.svg") !important;
    font-size: 14px;
    background-size: 1em;
    line-height: 1.2em;
}
.warningspan,
.noticespan,
.dangerspan,
.otherspan { /* #80 2023.04. */
	display: inline-block;
	margin-left: 26px; /* 2021.11.29 */
	margin-right: 26px;
	margin-top: 0;
	margin-bottom: 1em;
	width: calc(100% - 26px);    /* #21. Corresponding to overflow of note content. 2023.04. */
}
li .warningspan *,
li .noticespan *,
li .dangerspan *,
li .otherspan * { /* add. rm#24667 2023.05. */
	margin-right: 26px;
}

/*
 * ------------------------------------------------------------------
 *  
 * note notice
 * 
 */
.note.notice,
.note.caution {/* 重要 */
    background-color:#FFFFFF;
    border-color:#00A7B6;
    /* #75.
    file:///D:/roland-data/VG3_USE_JP/out/Japanese230324/xfv1657861688645.html
    では、
    margin-left: -13px;
    が有効で
    width: 100%;
    が無効が正しい．
 */   
    width: 100%; /* #21. 2023.04. */
}
.step.li .note {
    margin-left: -13px;
    width: auto;
}
.ol.substeps > li .note  {
    margin-left: 0px;
    width: auto;
}
.steps .stepresult .note {
    margin-left: 0px;
    width: auto;
}
/*
.step.li .note.notice {
    margin-left: -13px;
    width: auto;
}
.step.li .note.warning {
    margin-left: -13px;
    width: auto;
}
.step.li .note.danger {
    margin-left: -13px;
    width: auto;
}
.step.li .note.caution {
    margin-left: -13px;
    width: auto;
}
.step.li .note.other {
    margin-left: -13px;
    width: auto;
}
*/
.cautiontitle,
.notetitle,
.noticetitle {
    /* add 2021.11.25 */
    top:-1em;
    left:26px;
    position:relative;
    color:#FFFFFF;
    background-color:#00A7B6;
	background-image: none !important;
	padding: 3px 18px 3px 18px;
	border-radius: 0.8em;
}
.remembertitle,
.tiptitle
 {
    top:-1em;
    left:26px;
    position:relative;
    color:#00A7B6;
    border:1pt solid #00A7B6;
    background-color:#FFFFFF;
	background-image: none !important;
	padding: 3px 18px 3px 18px;
	border-radius: 0.8em;
}
span.related-linktitle{
	margin-left: 0px;
    color: #ffffff;
	background-image: none !important;
    background-color: rgb(72, 71, 71);
	padding: 3px 18px 3px 18px;
	border-radius: 0.8em;
}

/*
 * ------------------------------------------------------------------
 *  
 * note remember , tip
 * 
 */
.note.remember,
.note.tip{ /* メモ */
    background-color:#FFFFFF;
    border-color:#00A7B6;
    width: 100%;
}
.step.li .note.remember {
    margin-left:-13px;
}
.step.li .note.tip {
    margin-left:-13px;
}
.step.li .note.caution {
    margin-left:-13px;
}

.note.remember > span.notetitlespan,
.note.danger > span.notetitlespan,
.note.warning > span.notetitlespan,
.note.notice > span.notetitlespan,
.note.tip > span.notetitlespan,
.note.other > span.notetitlespan { /* #80 2023.04. */
	display: block;
	margin-bottom: 0px;
}

/* @outputclass="nosymbol */
.note.nosymbol {
    border: none;
    background-color: inherit;
    margin-left: 0px;
    margin-bottom: 0px;
}

.note.nosymbol .warningspan,
.note.nosymbol .noticespan,
.note.nosymbol .dangerspan,
.note.nosymbol .cautionspan {
    margin-bottom: 0px;
}
/* No content note */
.note.empty {
    top: 0px;
    left: 0px;
    margin: 0px;
}


.rememberspan,
.cautionspan,
.tipspan {
	display: block;
	margin-left: 26px; /* 2021.11.29 */
    margin-right: 26px;
	margin-top: 0;
	margin-bottom: 1em;
}

/* Change the style of step 2021.11.30 */
.ol.steps {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: li_count;
}
.li.step::before {
    display:inline-block;
    padding-left:0px;
    text-indent:0px;
    font-size: 18px;
    counter-increment: li_count;
    content: counter(li_count)".";
    color:#0062B1;
    font-weight:bold;
    margin-right: 21px;
    vertical-align: top;
}

.li.step >*{
    text-indent: 0px;
}

.li.step {
    padding-top: 5px;
    padding-bottom: 5px;
    /* Use "::before" width to make it independent of the width of the character type. */
    padding-left:calc(15px + 21px + 20pt);
    text-indent:calc(-21px - 20pt);
    margin-left: 0px;
    margin-bottom: 20px;
    border-left: solid #0062B1 8px;
}

/* table cell border. 2021.12.03 */
.entry.diagonal {
    background-image: url("img/diagonal-rightdown.svg") !important;
}
/* Table header background color specification. 2021.12.03 */
thead {
    background-color:lightgray;
}
.wh_tools {
/* #40. To fix the breadcrumb list. 2023.04.
    margin-top: 13px;
    */
    margin-top: 0px;
    background-color: rgb(240,241,241);
}
.wh_search_input {
    display: none;
    justify-content: flex-end;
    z-index: 2000;
}
#searchForm > div{
    /* width: 430px; */
    background-color: rgba(62,75,79,0.5);
    padding: 15px;
    display: flex;
    flex-wrap: nowrap;
    /* width: 40vw; not responsive */
    width: 400px;
    margin: 0 auto;
    margin: auto 0;
    margin: 0 0 0 auto;
}

#searchForm > div > input{
    width: 70%;
    margin: auto 0 0 0;
}
.wh_search_button2 {
/* 2022.02.24
    right: 120px;
    top: -10px;
*/
	color: white;
	background-color: rgb(28,128,196);
	border-radius: 0 .5em .5em 0;
    height:3em; /* #1. 2023.04. */
    width:3em; /* #1. 2023.04. */
	border: none;
    border-radius: 0;
    padding-top: 0.5em;
    padding-left: 0.5em;
}
.wh_search_button2:after{
    font-family: "oXygen WebHelp", serif;
    content:"f";
    font-size: 30px; /* #23. change icon size. xx-large; */
    padding-left: 0.2em;
    padding-top: 0.1em; /* #1. 追加．*/
}
.wh_search_textfield {
    height: 38.3px;
    width: 90%;
    display: inline-block;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.wh_publication_title > a > span.booktitle {
    color: white;
    font-size: 32px;
}

/* Increase the priority of the selector to output the top menu to the block below the company name.. 2022.1.13 */
@media only screen and (min-width : 768px) {
	.navbar-nav > .wh_top_menu_and_indexterms_link.navbar-collapse {
	/* #16. 2023.04.
        display: block !important;
     */
        display: flex;
		text-align: center;
        flex-basis: 100%;
	}
}

/* index
   Stop using the book symbol and make it a string. */
.wh_indexterms_link {
    display: flex;
    /* #40.
    text-align: center;
    padding-left: 42px;
    padding-right: 40px;
    */
    /* #40.
    margin-left: 20%; */ /* #16. add 2023.04. */
    /* 40.
    width: 80%; */ /* #16. add 2023.04. */
    /* background-color: rgb(28,128,196); */
    background-color: rgb(28,128,196);
    text-align: center;
    /* #40. add 2023.04. */
    margin-bottom: 10px;
}
.wh_indexterms_link a:before {
    content: none;
}
.wh_indexterms_link a span {
    display:block;
    color: rgb(255, 255, 255);
    white-space: nowrap;
    width: 145px;
    padding-top: 4px;
    padding-bottom: 4px;
    border: 1px solid rgb(255, 255, 255);
}
.wh_search_button.wh_search_button2 {
    height: auto;
    background-color: rgb(28,128,196);
}

div.footer-container {
    display: flex;
    justify-content: space-between;
    gap: 50px;
    flex-wrap: wrap;
/* 2022.02.24
    align-items: flex-end;
*/
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
    max-width:1600px;
    width: 100%;
}

    
/*
/////////////////////////////////////////
*/

/* Hamburger icon Erase the border and make the line white.*/
.navbar-light .navbar-toggler{
        border-color: rgba(0,0,0,0);
}
.navbar-light .navbar-toggler-icon { /* #23.Change the image of the hamburger icon and adjust the position of the top edge. (e.g. "M4 7" to "M4 2"...) Increase the width of the icon to 30 (from h22 to h34). 2023.04. */
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='3' stroke-miterlimit='10' d='M4 2h34M4 10h34M4 18h34'/%3E%3C/svg%3E");
}

.wh_header_flex_container {
    flex-wrap: nowrap;
    align-items: stretch;
    align-content: stretch;
    margin-top: 12px;
    line-height: 0.5em;
}

div.wh_publication_title {
    text-align: center;
    margin: 0 auto;
    line-height: 0.8;
}
/* #45.
@media only screen and (min-width : 768px) {
*/
@media only screen and (min-width : 992px) {

	.wh_top_menu_and_indexterms_link.navbar-collapse {
	        margin-left: 15%;
	        display: flex !important;
	        /* #40. 2023.04.
	        justify-content: inherit;
	        */
	        justify-content: space-between;
	}

    .wh_top_menu {
        display: flex;
    }
    .wh_indexterms_link {
        display: flex;
        width: auto;
        margin-left: auto;
    }
    .wh_top_menu ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        font-weight: normal;
    }
    #wh_menu_mobile_close_button2 {
    	display: none;
    	}
}

.wh_close_search_button {
    border:none;
    background: transparent;
}
.wh_search_button:after{
    font-size: 120%;
}

.wh_close_search_button:after {
    font-family: "oXygen WebHelp", serif;
    font-size: 120%;
    content: "g";
    color: rgb(255,255,255);
    border: none;
}

.title_and_search_button {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
/* 2022.02.24
    align-items: flex-end;
*/
    align-items: center;
}

#wh_menu_mobile_close_button{
    display:none;
}

div .mobile_menu_close {
    background-color:rgb(28,128,196);
    border: none;
    border-radius: 0;
    text-align: right;
    margin-bottom:0.5em;
    padding-right: 0;
}

.mobile_menu_close:after {
    font-family: "oXygen WebHelp", serif;
    font-size: 200%;
    content: "g";
    color: rgb(255,255,255);
    border: none;
}
.mobile_menu_close {
    margin-left: auto;
    /* margin-right: -10px; */
}

.wh_logo_and_publication_title_container { /*#23. Center the display at the top and bottom. 2023.04. */
        display: flex;
	justify-content: flex-end;
}

/* #40. Case of nev menu overflow. */
@media only screen and (max-height: 800px) {
    .wh_top_menu_and_indexterms_link {
    	font-size: 11px;
    }
    .wh_indexterms_link a span {
    	font-size: 1.1em;
    }
}


.wh_top_menu ul li.active > ul {
    background-color: rgb(28,128,196);
}
.wh_tile a {
    margin-top: 10%;
}


.ulchildlink {
    line-height: 2.4em;
}
.glyphicon-arrow-left::before, .oxy-icon-arrow-left::before,
.glyphicon-arrow-right::before, .oxy-icon-arrow-right::before,
.glyphicon-print::before, .oxy-icon-print::before {
    font-size: 150%;
}
a.xref:not([dita-type = "fn"])::before {
    content: none;
}
a.xref:not([dita-type = "fn"]) {
    display: inherit;
}

span.xref.title-only:not([dita-type = "fn"])::before,
span.xref.title-only:not([dita-type = "fn"])::after {
    content: none;
}
a.xref:not([dita-type="fn"]) {
    text-indent: 1em;
    list-style-type: none;
}

/* headerを固定 */
.wh_header {
    position: sticky;
    top: 0px;
    z-index: 3000;
    background-color: rgb(28,128,196);
}
/*#23. Change the left and right padding of the header. 2023.04. */
.col-12-padding {
    padding-right: 17.5px; /* #23. In bootstrap, the box of the button element has 7.5px padding on the left and right, so adjust for 25px. 2023.04. */
    padding-left: 25px;
}

#wh_publication_toc {
    margin-left: -28px;
}
.wh_publication_toc li{
/* 2022.02.28
    padding-top: 1em;
    padding-bottom: 1em;
*/
    position: relative;
    margin: 0px;
}

.wh_publication_toc li a{
    display: block;
    width: 100%;
}
.wh_publication_toc li a::after{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
/*    bottom 0;*/
    z-index: 1;
}
.wh_publication_toc > ul > li{
    border: #cccccc solid 1px;
    border-bottom: none;
}
.wh_publication_toc > ul > li:last-child{
/* #46. 2023.04. 
    border-bottom: #878787 solid 1px; 
*/
    border-bottom: #cccccc solid 1px; 
}
/* product logo 2022.02.24 */
.wh_logo {
    /* #23. Correct logo position．2023.04. 
    padding-top: 12px;
    */
}
    /* #24. The size of the product logo image is adjusted on the authoring. 2023.04. 
.wh_logo img{
    height: 32px;
    width: auto;
}
    */
.organization > span {
    line-height: 2em;
}

/* 2022.02.24 */
.wh_top_menu ul li:hover {
    background-color: rgba(28,128,196,0.85);
}

/* ボタン枠を消す 2022.02.24 */
button:focus-visible {
    outline: none;
}
button:focus {
    outline: none;
}
.wh_publication_toc .title{
    margin-bottom: 0.8em;
    width: 100%;
}
.wh_search_button2_div {
/*    padding-left: 10%; #1. 2023.04. */
}
.wh_search_textfield {
	background-color: rgba(255,255,255,0.85);
}
td .note {
    text-align: left;
}
h2.title.topictitle2.level5 { /* when jump to h2 from side menu, adjustment for header height */
 margin-top:-130px;
 padding-top:130px;
}
/* #26. Correct the position of the text on the back to top icon.2023.04. */
#go2top {
    padding-left: 13.5px;
}
/* #69. The title of the table should not have a label ．2023.04. */
.table--title-label {
    display:none;
}
/* #47. Expand the left side of the expand-button.  2023.04. */
.wh-expand-btn:before{
    margin-left: 4px;
}
/* #17. No need for horizontal rules on tables．*/
.rowsep-0 {
    border-bottom: 0px solid #ffffff !important;
}
.table td, .table th {
    border-top: 0px solid #ffffff !important;
    border-color: unset !important;
}
/* #40. Fixed breadcrumb list. 2023.04. */
.container-fluid > .row {
	position: sticky;
	top: 79px; /* When resizing, get the size of the header and make its position variable. */
	z-index:20;
	display: block;
}
.container-fluid > .row > .wh_tools_topspace {
	height:30px;
	background-color:white;
	font-size:1px;
	/* ">&nbsp;</div> */
}
/* #40. */
.indexterms_container {
	display:block;
	margin-top: 10px; /* #40. Adjustment of the index position in the PC. 2023.04. */
}

/* #40. 2023.04. */
.indexterms_container.for_mobile {
	display:none;
}

 /* #40. Adjustment of the index position in the PC. 2023.04. */
.wh_top_menu_and_indexterms_link .navdiv {
    display: flex;
    /* #40. add 2023.04. */
    width: 990px;
    justify-content: center;
}

.wh_publication_toc .topicref {	/* add. 2023.05. */
    padding-right: 10px;
}
.s_button_b_button { /* chg auto to 20%. #24663. 2023.05 */
	width: 20%;
}
.wh_logo_and_publication_title_container {
        width: 20%; /* chg auto to 20%. #24663. 2023.05 */
}


/* 
@media /////////////////////////////////////////
*/

/*#45. test 767px->991px */
@media only screen and (min-width: 991px) {
    .wh_top_menu ul li a {
        padding-left: 1em;
        padding-right: 0em;
        padding-top: 0em;
        padding-bottom: 0em;
    }
}

/* sub menu title 2022.02.24 */
@media only screen and (min-width: 768px) {
    .wh_top_menu ul li ul a {
        padding-top: 0.5em;
        padding-bottom: 0.5em;
        padding-right:1.5em;
    }
}

/*#45. test 767px->991px */
@media only screen and (min-width: 991px) {
    .wh_top_menu > ul > li {
        margin-top: 0.5em;
        margin-bottom: 0.5em;
        margin-left: 0.5em;
        margin-right: 0.5em;
    }
    /* #49. Gray ">>" is changed to white ">". 2023.04. */
    .wh_top_menu ul ul li.has-children:after{
        color:white;
        /* 不要な ">" 2023.05
        content:"\003E";
        */
    }
}

@media only screen and (max-width: 1200px){
    .wh_tiles {
        margin-left: 13%;
        margin-right: 13%;
        margin-top: 40px;
        justify-content: space-between;
    }
}

/*#45. 767px->991px */
@media only screen and (max-width: 991px) {
	/* #40. 2023.04. */
	.indexterms_container{
		display:none;
	}
	.indexterms_container.for_mobile {
		display:block;
	}
	.indexterms_container.for_mobile .wh_indexterms_link {
    	    padding-left: 42px;
           padding-right: 40px;
	}
	
    .wh_logo_and_publication_title_container { /*#23. Remove width:100% so that the manual name is centered. 2023.04. */
        /* width: auto; rm#24663. 2023.05. */
        width: 20%; /* chg auto to 20%. #24663. 2023.05 */
        justify-content: left; /* add. rm#24663. 2023.05. */
        display: flex;
    }
    /* add "s_button_b_button" class. rm#24663. 2023.05. */
    /* 以下は topページ以外では常に有効にするため、@media制限は外す->skin24.cssに移動
    .s_button_b_button {
        width: 20%;
        display: flex;
        justify-content: right;
    }
    */
    
    #wh_menu_mobile_close_button{
    /* #16. 2023.04.
        display:block;
     */
    /* display: inline-flex; */
	    display: flex;
	    font-size: 20px;
    }

    .wh_top_menu {
        font-weight: normal;
        /* #40. Disabled the menu from appearing on the small screen. 2023.04.
        width: 780px;*/ /* 2022.02.25 */
        margin-top: 0px;	/* add. rm##24664 2023.05. */
    }

    .wh_top_menu_and_indexterms_link .navdiv {
        /* #16. 2023.04.
        display: flex;
        width: auto;
        width: 80%;
        */
/*        margin-left: 20%;  *//*#16. add 2023.04. */
        justify-content: start;
        /* #40.
        margin-top: 40px;
        margin-bottom: 18px;
        */
        background-color: rgb(0,137,199); /* #16. 2023.04. */
        /* #40. Adjustment of index position for mobile display. 2023.04. */
	 margin-bottom: 80px;
        display: block;
    }

    .wh_indexterms_link a span {
        margin-bottom: 15px;
        /* #16. add 2023.04. */
        padding-top: 9px; /*12.5px;
        padding-bottom: 12.5px;
        */
        height: 40px;
        width: 150px;  /* change width. rm##24664 2023.05. */ 
        font-size:15px;
    }

    .wh_top_menu_and_indexterms_link {
        border-top: 0px solid #ddd;
        /* #40. Add the following. 2023.04. 
    	position: fixed;
        */
    	position: absolute;
        right: -100%;
        /*
        display: none;
        */
        visibility: hidden;
        transition: 0.3s ease-in-out;
    }

    /* #40. Add the following 2023.04. */
    .wh_top_menu_and_indexterms_link.nav_open {
    	right: 0;
    	position: absolute;
    	width: 80%;
        visibility: visible;
    	display: block;
    	/* Allow scrolling of the menu. */
    	overflow-y: auto;
    	height: 100vh;
       background-color: rgb(0,137,199); /* add. rm#24664 2023.05. */
    }

    .for_mobile_nav {
    	overflow-x: clip;
    	overflow-y: clip;
    }

    .wh_top_menu ul li a {
    /* #16. 2023.04.
        color: rgb(137,137,137);
        background-color:white;
    */
        color: white; /* #16. 2023.04. */
        background-color: rgb(0,137,199); /* #16. 2023.04. */
        font-size: 0.9em;
        padding-top: 1.8em;
        padding-bottom: 1.8em;
    }

    /* #40. For ">" mark in front of hamburger menu. 2023.04.
   */
   .wh_top_menu ul>li>span.topicref>span.title>a:before{
	 white-space: pre-wrap;
	 /* 2024.09.19 無効化
        content:"\00A0\00A0\00A0\00A0\00A0";
        */
        padding-left: 2em;
    }

    .wh_top_menu ul>li.has-children.active[role="menuitem"]>span.topicref>span.title>a:before{
	 font-family: "oXygen WebHelp", serif;
        color:white; 
        content: "p";
	 padding-left: 20px;
    	 padding-right: 14px;
    }

    .wh_top_menu ul>li.has-children:not(.active)[role="menuitem"]>span.topicref>span.title>a:before{
	 font-family: "oXygen WebHelp", serif;
        color:white; 
        content:"q";
	 padding-left: 20px;
    	 padding-right: 14px;
        }

    .wh_top_menu a:hover {
    /* #16. 2023.04.
        color: rgb(137,137,137);
     */
    }

    .wh_top_menu ul ul li a:hover {
    /* #16. 2023.04. 
        background-color: white;
     */
    }

    .wh_top_menu ul li a:before {
    	color: rgba(62,75,79,0.5);
    }

    /* 2022.02.24 */
    .wh_top_menu > ul > li {
    /*	border: #cccccc solid 1px;
    	border-bottom: none;
    */
    	border-bottom: #ffffff solid 1px; /* change color. rm##24664 2023.05. */ 
    }

    .wh_top_menu > ul > li:last-child {
    /* #40.
    	border-bottom: #878787 solid 1px;
    	*/
    	border-bottom: none;
    }

    .wh_top_menu ul ul li a:hover {
     	background-color: rgb(0,137,199);
    }
    #searchForm > div {
        width: 50vw;
    }
    /* #7. 767 -> 991px  */
	.wh_tile {
		max-width: 360px;
        min-width: 100px;
		width: calc(calc(100% - 30px) * 0.45);
	}
    .wh_search_textfield {
        width: 75%;
	}
    .wh_top_menu ul li+ li {
        border-left: 0px;
    }
	/* #40. */
	.wh_indexterms_link {
		background-color: rgb(0,137,199);
		padding-bottom: 250px;	 /* change 40px to 250px. rm##24664 2023.05. */ 
	}
	div .mobile_menu_close {
	    background-color: rgb(0,137,199);
	}
	.col-12-padding {
	    padding-right: 25px;
	    /*
	    padding-left: 25px; */
	}
	/*#45. test 767px->991px */

    .wh_header_flex_container {
        flex-direction: row; /* #23. Place the product logo and menu side by side. 2023.04. */
	/*
        flex-direction: column;
	*/
        align-items: stretch;
    }
    .wh_header {
        text-align: left;
    }
	/* #23. Correct the size (height) of the logo image. 2023.04. 
    		in #45、Switching from 768px to 991. */
    .wh_logo img{
        height: 20px;
    }
    div.note { /* If you make it smaller, the note will stick out. 2023.04. */
	    margin-right: 1px; /* Adjust the width of the table to be equal to the width of the table. */
    }
    /* #40. Adjustment of the position on the index during mobile output. 2023.04. */
   .indexterms_container {
	margin-top: 30px;
   }

  .wh_top_menu ul li:hover {
    	background-color: rgba(0,137,199,0);
   }
   .wh_top_menu ul li a{
    	background-color: rgba(0,137,199,0);
   }
  .wh_top_menu a:hover {
       text-decoration: none;
   }
  .wh_top_menu ul li.active > ul {
    	background-color: rgba(0,137,199,0);
  }
}

@media only screen and (max-width: 830px){
    .wh_tiles {
        margin-left: 5%;
        margin-right: 5%;
    }
}

/* Render search area for devices smaller than 767px */
@media only screen and (max-width: 767px) {
	.wh_search_input {
		padding: 0;
	}
}

/* for SP 2022.01.12 
    max-width:600px
    Style when the screen width of the window is 600px or less (SP)
*/
@media only screen and (max-width: 600px) {
    .wh_rdg_tile_title_cell {
    	font-size: 17px;
        word-break: break-word; /* #18. Allow line breaks because the title protrudes from the tile. 2023.04. */
    }
    .wh_rdg_tile_image {
        min-width: 21%;
        min-height: 21%;
    }
    div.footer-container {
        display: table;
    }
    .wh_footer_logo,
    .copyright_years,
    .organization {
        margin: 0 auto;
    }
    .wh_publication_title > a > span.booktitle {
        font-size: 25px;
        font-size: clamp(20px,1vw,25px);
        word-break: break-word; /* #18. Added because the hamburger icon is kicked out when the title is long. 2023.04. */
    }
}
/* #12. tableは、960px以下でスクロールするようにするため、以下を追加 2023.04. */
@media only screen and (max-width: 960px) {

    .table-wrap {
        max-width: 960px;
        overflow-x: auto;
		transform: rotateX(180deg); /* #31. add. 2023.04. */
    }
    /* Always show scrollbars if visible. 2023.04. */
	.table-wrap::-webkit-scrollbar { 
	  height: 5px; 
	} 
	.table-wrap::-webkit-scrollbar-track { 
		margin: 0 2px; 
	  	background: #ccc; 
	  	border-radius: 5px; 
	} 
	.table-wrap::-webkit-scrollbar-thumb { 
	  	border-radius: 5px;
	  	background: #666; 
	}

    /* #31. add. 2023.04. */
    .table,
    .simpletable,
    .choicetable {
		transform: rotateX(180deg); /* #31. add. 2023.04. */
		min-width: 960px;
	}
	table>caption {
	    margin-top: 0em;
	}

}

@media only screen and (max-width: 591px) {
	.wh_tile {
		max-width: 450px;
        min-width: 100px;
		width: calc(calc(100% - 30px) * 0.45);
	}
}

@media only screen and (max-width: 576px) {
    #wh_publication_toc_mobile {
        display: none;
    }
}

@media only screen and (max-width: 445px) {
    .wh_tiles:after {
        content: "";
        display: block;
        width: 50%;
    }
	.wh_tile {
		max-width: 400px;
        min-width: 100px;
		width: calc(calc(100% - 30px) * 0.40);
        flex: 1;
        height: auto;
	}
}

@media only screen and (max-width: 376px) { /* iphone se */
    .wh_content_area {
        min-height: 310px;
    }
    .wh_tiles {
        justify-content: center;
    }
	.wh_tile {
		max-width: 400px;
        min-width: 131px;
		width: calc(calc(100% - 30px) * 0.40);
/* #36. The frames are spaced 1px apart so that they do not overlap and appear thicker. 2023.04.
        margin: 0;
*/
        margin: 1px;
	}
	.wh_search_input {
		left: 0;
	}
}

@media only screen and (max-width: 376px) {
    #searchForm > div {
        width: 100vw;
    }
}

/* #23.#24 Overwrite bootstrap with left and right padding. 2023.04. */
.col-md-12 {
	padding-right: 25px;
	padding-left: 25px;
    }
/* add for #24668. 2023.05. */
@media only screen and (min-width: 992px) {
	#wh_publication_toc {
		height: 100vh;
		overflow: auto;
		scrollbar-width: none; /* not display scroll bar for Firefox */  
	    	-ms-overflow-style: none;/* not display scroll bar for Internet Explore */   
	}
	#wh_topic_body{
		height: 100vh;
		overflow: auto;
		scrollbar-width: none; /* not display scroll bar for Firefox */  
	    	-ms-overflow-style: none;/* not display scroll bar for Internet Explore */   
	}
	.wh_content_area nav.d-sm-none::-webkit-scrollbar {
		display: none;
	}
	.wh_content_area div.col-lg-9::-webkit-scrollbar {
		display: none;
	}
}