@charset "UTF-8";
@import url("../../modules/new_base.css");

h1 img {max-width:100%;height:auto;max-height:200px;object-fit:scale-down;}

/* ---RIGHT--- */
#column_R {}
#column_nav {}
#column_nav a {display:block;text-decoration:none;}
#column_nav ol {list-style-type: none;padding:0;margin:0;letter-spacing: .3em;}
#column_nav ol li {text-align:center;margin-bottom:0.5em;font-size:0.8rem;}
#column_nav ol li a {padding:0.5em 0;border:2px solid #f5f5ff;border-radius:0.5em;}
#column_nav ol li a:hover {border:2px solid #a0a0ee;}
#column_nav ol li:first-child {font-size:1.4rem;}
#column_nav ol li:first-child a {background-color:#f5f5ff;padding:2em 0;}
#column_nav img {object-fit:scale-down;width:100%;height:auto;}

div.R_pic {margin-top:1em;}


/* ---LEFT--- */
#column_L {}
nav#table_of_contents {
    background-color: #f5f5ff;
    padding:1em;margin:0.5em;border-radius: 1em;
}
nav#table_of_contents a {display: block;text-decoration:none;}
nav#table_of_contents a:hover {text-decoration:underline;}
nav#table_of_contents h2 {text-align: center;border:2px solid #a0a0ee;background-color:#ffffff;color:#a0a0ee;padding:0.5em;border-radius:0.5em;}
nav#table_of_contents h3 {background-color:#a0a0ee;}
nav#table_of_contents h3 a {color:#ffffff;padding:0.25em 0.5em;}
nav#table_of_contents hr {border:none;height:0.25em;background-color:#a0a0ee;margin:2em auto;}
nav#table_of_contents ol {line-height:1.5;list-style-type:none;padding:0;margin:0;}
nav#table_of_contents ol li {margin:0.5em 0;border-bottom:2px dashed #a0a0ee;}
nav#table_of_contents ol li a {color:#333333;margin:.2em 0;padding:0.25em 0.5em;}
nav#table_of_contents ol li a:hover {background-color: #ffffff;}

ul.toc_nav {
    list-style-type: none;margin: 1em 0.5em;padding: 0;
    font-size:0.8em;
    border-top:1px dotted #a0a0ee;border-bottom:1px dotted #a0a0ee;
    display:flex;justify-content:space-between;
}
ul.toc_nav li{flex-grow:1;text-align:center;}

nav.gap_nav {margin:2em 0.5em;}
nav.gap_nav a {display:block;text-decoration:none;}
nav.gap_nav ul {
        list-style-type: none;margin: 0;padding: 0;
        display:flex;justify-content:space-between;
    }
nav.gap_nav ul li {flex-grow:1;text-align: center;}
nav.gap_nav ul li a {padding:0.25em 0;margin:2px;border:2px solid #f5f5ff;}
nav.gap_nav ul li a:hover {border:2px solid #a0a0ee;}
nav.gap_nav ul li:first-child {flex-grow:2;}
nav.gap_nav ul li:first-child a {background-color:#f5f5ff;}



/* -- -- category box -- -- */
article.category_box {margin:4em 0;}
article.category_box h2 {
    text-align: center;font-size:2em;
    background-color: #cccccc;color:#000000;
    margin-bottom:0.5em;padding:0.25em 0;
}
article.category_box h2 a {text-decoration:none;color:#000000;display:block;}
article.category_box h2 a:hover {text-decoration:underline;}

/* -- box -- */
section.box {
    margin:0.5em 0 5em 0;padding:0.5em;
    border:0.2em solid #cccccc;border-radius:0.5em;
}
section.box h3 {
    color:#4b4bc7;font-size:1.5em;
    border-top:0.2em solid #4b4bc7;border-bottom:0.2em solid #4b4bc7;
    margin-bottom:1em;padding:0.5em;
}
section.box h4 {border-bottom:2px dotted #cccccc;}

section.box strong {color:#cc0000;}
section.box p.Answer {font-size:1.5em;color:#ec6517;font-weight:bold;text-decoration: #ec6517 wavy underline;}


section.box div.box_img {text-align:center;margin:0.5em auto;color:#666666;font-size:0.8em;}
section.box div.box_img :is(img,video) {max-width:100%;height:auto;}

section.box div.box_link {font-size:0.8em;margin: 2em auto 0.5em auto;max-width:700px;}
section.box div.box_link h4 {
    font-size:1em;padding:0.25em 0.5em;
    border:1px solid #cccccc;color:#333333;
    background: linear-gradient(transparent 50%, #eeeeee 0%);
}
section.box div.box_link ul {margin:0.5em 0;padding:0;list-style-type: none;}
section.box div.box_link ul li {border-bottom:1px dotted #999999;padding:0.25em 0.5em;}
section.box div.box_link ul li a {display:block;}
section.box div.box_link ul li a:hover {background-color:#ffffcc;}



/* ==== ==== [[[ Media Queries ]]] ==== ==== ==== ==== ==== ==== */
/* ---- window size [ smartphone ] ---- ---- ---- ---- ---- ---- */
@media screen and (max-width: 599px) {
    #column_R {display:none;}

    nav#table_of_contents {padding:0.5em;border-radius: 0.5em;}
    nav#table_of_contents ol {font-size:0.8em;}

    nav.gap_nav {font-size:0.8rem;}
    nav.gap_nav ul {flex-wrap: wrap;}
    nav.gap_nav ul li {width:30%;flex-grow:1;}
    nav.gap_nav ul li:first-child {flex-grow:1;}

    article.category_box {margin:4em 0.5em;}
    article.category_box h2 {font-size:1.3em;}
    section.box h3 {font-size:1em;}
}


/* ---- window size [ tablet & pc ] ---- ---- ---- ---- ---- ---- */
@media screen and (min-width: 600px) and (max-width: 899px) {

}


/* ---- window size [ wide monitor ] ---- ---- ---- ---- ---- ---- */
@media screen and (min-width: 900px) {

}


/* ---- window  [ print ] ---- ---- ---- ---- ---- ---- */
@media print {}