/* 共通 css */
@charset "UTF-8";

html {
    width:100%;
    height:100%;
    min-height: 100%;
    margin:0;
    padding:0;
    /*overflow-y:scroll;*/
    
}

body {
    width:100%;
    height:100%;
    min-height: 100%;
    
    margin:0;
    padding:0;
    
    background-color:#F6F6F6;
    
    font-size:14px;
    font-family:Meiryo, helvetica, sans-serif;
}


body * {
    
    font-size:100%;
    font-family:inherit;
    box-sizing:border-box!important;
    -webkit-box-sizing:border-box!important;
    -moz-box-sizing:border-box!important;
    -o-box-sizing:border-box!important;
    
    margin:0;
    padding:0;
    
    position:relative;
    
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -ms-touch-callout: none;
    /*-ms-touch-action: none;*/
    -moz-user-select: none;
    
    touch-callout: none;
    user-select: none;
    /*touch-action: none;*/
    
    box-sizing:border-box;
}

body td,
body th,
body tr,
body thead,
body tbody
{
    position:static;
}

input, textarea, .allow_select
{
    user-select: auto;
    -webkit-user-select: auto;
    -ms-user-select: auto;
    -moz-user-select: auto;
}

*, input, select, textarea, option, button {
    outline: none!important;
}

input.hide_spin::-webkit-inner-spin-button,
input.hide_spin::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance:textfield;
}

input.border_navy,
textarea.border_navy,
select.border_navy {
    border: 2px solid #32354f;
}

label.checkbox_wrapper > *
{
    pointer-events:none;
}


select option:disabled {
    color:#aaa;
}

::-webkit-calendar-picker-indicator {
    margin-left:0px;
}

.progress .progress-bar.no-transition
{
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
}

.font_frame_navy{
    text-shadow: 1px 1px 0 #155697,
                 -1px -1px 0 #155697,
                 -1px 1px 0 #155697,
                 1px -1px 0 #155697,
                 0px 1px 0 #155697,
                 0px -1px 0 #155697,
                 -1px 0 0 #155697,
                 1px 0 0 #155697;
}

.step_text_font{
    color:#203964;
    font-style: italic;
}

.step_num_font{
    color:#c45911;
}

.small_text {
    font-size:90%!important;
}

.smaller_text {
    font-size:80%!important;
}

.f8px {
    font-size:8px!important;
}

.f10px {
    font-size:10px!important;
}

.f12px {
    font-size:12px!important;
}

.f14px {
    font-size:14px!important;
}

.f16px {
    font-size:16px!important;
}

.f18px {
    font-size:18px!important;
}

.f20px {
    font-size:20px!important;
}

.f22px {
    font-size:22px!important;
}

.mw100p {
    max-width:100%;
}

.f24px {
    font-size:24px!important;
}

.pre_wrap
{
    white-space:pre-wrap!important;
}

.pc_hide
{
    display:none!important;
}

@media(max-width:767px) {
    
    .pc_hide
    {
        display:unset!important;
    }
    
    .sp_hide
    {
        display:none!important;
    }

    .sp_hidden{
        visibility: hidden!important;
    }


}

.pointer
{
    cursor:pointer;
}



#wrapper {
    width:100%;
    min-height: 100vh;
    /*height:100%;*/
}

/* ヘッダー */
#common_header {
    width:100%;
    height:64px;
    border-radius:0;
    margin-bottom:0px;
    
    background-color:#008000;
    
    z-index:5;
}

#common_header .inner {
    width:1250px;
    margin:0 auto;
}

#common_header .header_title {
    position:absolute;
    top:15px;
    left:0;
    padding-left:15px;
    width:100%;
    
    text-align:left;
    
}

#common_header .header_logout,
#common_header .header_person {
    height:100%;
    line-height:64px;
    
    padding-right:15px;
    
    text-align:right;
    
    color:#FFFFFF;
    
}

#common_header .header_person {
    padding-right:30px;
}

    #common_header .header_person img {
        width:42px;
        height:42px;
        border-radius:50%;
    }


    #common_header .header_logout a {
        color:#FFFFFF;
    }
    
    


/* コピーライトヘッダー */
#footer_copyright {
    clear:left;
    width:100%;
    border-radius:0;
    margin-top:0;
    margin-bottom:0px;
    padding:0.5em 0;
    background-color:#008000;
    z-index:1;
    
}

    #footer_copyright .inner {
        width:1250px;
        margin:0 auto;
        padding:0.5em 20px;
        
        text-align:center;
        line-height:1.5em;
        color:#fff;
        
    }


#common_body {
    width:100%;
    height:100%;
}

#common_body .inner {
    width:1250px;
    margin:0 auto;
    background-color:#FFFFFF;
    padding:20px;
    min-height: 100vh;
    padding-top:84px;
    margin-top:-64px;
}

#common_body .inner:after {
    content:"";
    clear:both;
    display:table;
}

#side_menu_column {
    
    display:block;
    
    float:left;
    
    width:270px;
    margin-left:0;
    margin-right:20px;
    
    
}

#main_column {
    
    float:left;
    width:920px;
    margin-left:0;
    
    
}

#main_column.one_column {
    
    float:none;
    
    width:100%;
    margin-left:auto;
    margin-right:auto;
    
    
}

#breadcrumb {
    position:relative;
    width:100%;
    min-height:auto;
    margin-left:auto;
    margin-right:auto;
}

#breadcrumb .video_manual_icon {
    position:absolute;
    right:0px;
    border: solid 2px #cf433f;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2px;
}

.manual_container {
    display:flex;
    justify-content:right;
    align-items: center;
    padding-right: 115px;
}

.manual_container.under_color_title {
    margin-top: 20px;
}

.manual_container .step_text_base_font{
    position: absolute;
    top: -20px;
    font-weight: bold;
    color: #333;
    right: 7px;
    width: 165px;
    text-align: center;
    white-space: nowrap;
    min-width: fit-content;
}

.manual_container .to_video_manual
{
    line-height:1.3em;
    white-space:nowrap;
    padding-left:2px;
    padding-right:2px;
    width:60px;
    display:block;
    pointer-events:auto;
    font-size:10px;
    height: 43.2px;
    margin-left: 4px;
}

.manual_container .to_video_manual .video_manual_name
{
    font-size: 12px;
    line-height: 1.8em;
}

.manual_container .to_video_manual img
{
    width:14px;
    margin-left:2px;
    top: -2px;
}

#common_header .header_title img
{
    height: 38px;
    margin-left: 37px;
}

@media(max-width:1280px)
{
        #common_header .header_title img
    {
        margin-left: -24px;
    }
}

@media(max-width:1022px)
{
        #common_header .header_title img
    {
        margin-left: -5px;
    }
}

@media(max-width:766px)
{
        #common_header .header_title img
    {
        margin-left: 0px;
    }
}

@media(max-width:1280px)
{

    #common_header .inner,
    #footer_copyright .inner
    {
        width:970px;
    }
    
    #common_body .inner {
        width:1000px;
        padding-left:10px;
        padding-right:10px;
    }

    #side_menu_column {
        width:200px;
        margin-right:10px;
    }

    #main_column {
        width:770px;
        margin-left:0;
    }

    #main_column.one_column {
        width:100%;
    }
    
    #breadcrumb {
        width:100%;
    }
}

@media(max-width:1023px)
{
    #common_header .inner,
    #footer_copyright .inner
    {
        width:768px;
    }
    
    #common_body .inner
    {
        width:768px;
        padding-left:10px;
        padding-right:10px;
        padding-top:72px;
    }

    #side_menu_column {
        width:180px;
        margin-right:10px;
        font-size:90%;
    }
    
    #main_column
    {
        width:550px;
    }

    #main_column.one_column
    {
        width:100%;
    }
    
    #breadcrumb {
        margin-bottom:10px;
    }

}




@media(max-width:767px), print
{
    
    #common_header
    {
        height:40px;
        
    }
    
    #common_header .inner,
    #footer_copyright .inner
    {
        width:95%;
    }
    
    #footer_copyright {
        padding-bottom:80px;
    }
    
    #common_header .header_title
    {
        top:10px;
        left:0;
        padding-left:5px;
    }
    
    
    #common_header .header_title img
    {
        height: 26px;
    }
    
    #common_header .header_logout,
    #common_header .header_person
    {
        line-height:40px;
        
        padding-right:10px;
    }
    
    
    #common_header .header_person img {
        width:32px;
        height:32px;
    }
    
    
    #wrapper {
        min-height: -webkit-fill-available;
    }
    
    #common_body .inner
    {
        width:100%;
        padding-left:5px;
        padding-right:5px;
        padding-bottom:80px;
    }

    #side_menu_column {
        position:absolute;
        left:0;
        display:none;
        width:100%;
        min-height:100%;
        padding-left:5px;
        padding-right:5px;
        padding-bottom:80px;
        
        background:#ffffff;
        transform:translateX(-100%);
        transition:transform 0.15s ease-out 0.1s;
        
        z-index:2;
        
        font-size:110%;
        
    }
    
    #side_menu_column.show {
        display:block;
        transform:translateX(0%);
    }

    #main_column
    {
        width:100%;
    }

    #main_column.one_column
    {
        width:100%;
    }
    
    #breadcrumb
    {
        display:none;
    }
    
    
    #breadcrumb .video_manual_icon {
        position:relative;
        float:right;
    }    
}




/* 編集用パネル */
.edit_container
{
    padding:2em;
}

.edit_container table
{
    width:100%;
}

.edit_container table th,
.edit_container table td
{
    padding-bottom:1em;
}

.edit_container table th
{
    white-space:nowrap;
    width:4em;
    min-width:4em;
    
    padding-right:1em;
    text-align:right;

}

.edit_container table th.vt {
    vertical-align:top;
}


.edit_container .sp_label {
    display:none;

}

.edit_container .portrait_container {
    width:100%;
    margin-bottom:10px;
}

.edit_container .portrait_container img {
    width:128px;
    height:128px;
    border-radius:15%;
}

@media(max-width:767px) {

    .edit_container
    {
        padding:0.5em;
    }

    .edit_container .sp_label {
        display:block;
        margin-top:0.5em;
        margin-bottom:0.4em;
    }
    
    .edit_container .form-inline input,
    .edit_container .form-inline select
    {
        display:inline-block;
    }
    
}





/* アラートエリア */
#alert_area .alert {
    margin-bottom:0.5em;
    padding-top:0.5em;
    padding-bottom:0.5em;
}

a.list-group-item.selected,
a.list-group-item.selected:hover
{
    background-color:#f5f5f5;
    color:#000;
}

a.list-group-item.selected
{
    text-shadow:1px 1px 0px rgb(255,255,255);
}




/* ページ移動メニュー */
#page_menu
{
    position:fixed;
    display:block;
    bottom:10px;
    right:10px;
    z-index:100;
    
    transform:scale(0);
    
    pointer-events:none;
    
    transition:transform 0.1s 0.1s linear;
    
}

#page_menu.on
{
    transform:scale(1);
    pointer-events:auto;
}

#page_bottom_menu
{
    display:none;
}

@media(max-width:767px) {
    
    body
    {
        background:#FFFFFF;
    }
    
    #page_menu
    {
        display:none!important;
        width:0;
        height:0;
    }
    
    #page_bottom_menu
    {
        display:block;
        position:fixed;
        bottom:8px;
        bottom:calc(8px + constant(safe-area-inset-bottom));
        bottom:calc(8px + env(safe-area-inset-bottom));
        right:0;
        
        height:80px;
        
        text-align:center;
        
        z-index:1000;
    }
    
        #page_bottom_menu a
        {
            display:inline-block;
            width:58px;
            height:58px;
            margin:11px 5px;
            
            text-align:center;
            
            line-height:12px;
            
            border-radius:20%;
            box-shadow:1px 2px 3px rgba(0,0,0,0.2);
            
            background-color:#5aa2e0;
            color:#FFF;
            
            overflow:hidden;
            
        }
        
        #page_bottom_menu a.disabled
        {
            background-color:#606060;
            opacity:0.2;
        }
        
        #page_bottom_menu a img
        {
            display:block;
            margin:12px auto 0px auto;
            width:24px;
            height:24px;
        }
        
        #page_bottom_menu a .icon
        {
            display:block;
            margin-top:10px;
            font-size:24px;
        }
        
        #page_bottom_menu a .text
        {
            font-weight:bold;
            font-size:8px;
        }
        
        #page_bottom_menu a:hover,
        #page_bottom_menu a:active,
        #page_bottom_menu a:visited
        {
            text-decoration:none;
        }
        
        
        #page_bottom_menu .display_menu_icon {
            display:inline;
        }
        
        body.side_menu_show #page_bottom_menu .display_menu_icon {
            display:none;
        }
        
        #page_bottom_menu .hide_menu_icon {
            display:none;
        }
        
        body.side_menu_show #page_bottom_menu .hide_menu_icon {
            display:inline;
        }
        

}

@media print {
    
    #page_bottom_menu {
        display:none!important;
    }
    
    tr, .list-group-item
    {
        page-break-inside:avoid;
    }
    
    .print_hide
    {
        display:none!important;
    }
}



/* 管理者用進捗一覧表 */
table.common_list_table
{
    width:auto;
    margin:1em auto 5px


}


table.common_list_table th
{
    text-align:center;
    vertical-align:middle!important;
    
    padding: 0.6em 0.5em;
    color: #FFFFFF;
    font-size: 90%;
    font-weight: normal;
    text-align: center;
    text-shadow: 1px 1px 0px rgba(0,0,0,0.2);
    background-color: #17a757;
    
    white-space:nowrap;

}

#current_news_table tbody
{
    border: solid #17a757 2px;
}

#current_news_table th
{
    background-color: #17a757;
}

#saved_news_table th
{
    background-color: #a6a6a6;
}


table.common_list_table th.sort
{
    cursor:pointer;
}

table.common_list_table th span.glyphicon
{
    font-size:80%;
}

table.common_list_table td
{
    vertical-align:middle!important;
    white-space:nowrap;
}






/* ルビ関連 */
body.hide_ruby rp, body.hide_ruby rt {
    display:none;
}

body:not(.hide_ruby) ruby {
    display: inline-table;
    border-collapse: collapse;
    height: 2em;
    margin: 0;
    padding: 0;
    border: none;
    white-space: nowrap;
    text-indent: 0;
    vertical-align: 1em;
    text-decoration: inherit;
    text-align: center;
    line-height: 1em;
    }

/* 上ルビ */
body:not(.hide_ruby) ruby>rtc {
    display: table-header-group;
    height: 25%;
    margin: 0;
    padding: 0;
    border: none;
    font: inherit;
    font-size: 50%;
    line-height: 1em;
    }

/* 下ルビ(括弧類がある場合とない場合でセレクタが異なる) */
body:not(.hide_ruby) ruby>rtc+rtc,
body:not(.hide_ruby) ruby>rtc+rp+rtc {
    display: table-footer-group;
    height: 25%;
    margin: 0;
    padding: 0;
    border: none;
    font: inherit;
    font-size: 50%;
    text-decoration: none;
    line-height: 1em;
    }

/* 各文字に対応するルビ */
body:not(.hide_ruby) ruby>rtc>rt {
    display: table-cell;
    margin: 0;
    padding: 0 0.125em;
    border: none;
    font-size: 100%;
    text-align: center;
    line-height: 1em;
    }

/* ルビ対象テキスト */
body:not(.hide_ruby) ruby>rb {
    display: table-cell;
    max-height: 75%;
    margin: 0;
    padding: 0 0.125em;
    border: none;
    font: inherit;
    text-decoration: none;
    text-align: center;
    line-height: 1em;
    vertical-align: top;
    }

/* 単純な<ruby>要素での<rt>要素 */
body:not(.hide_ruby) ruby>rt {
    display: table-header-group;
    height: 25%;
    margin: 0;
    padding: 0 0.125em;
    border: none;
    font: inherit;
    font-size: 50%;
    text-align: center;
    line-height: 1.5em;
    }

/* <ruby>要素入れ子の場合 */
body:not(.hide_ruby) ruby>ruby {
    vertical-align: 0em;
    }

/* <ruby>要素が入れ子でない場合のルビテキストと、*/
/* <ruby>要素が入れ子の場合の上位<ruby>要素のルビテキスト、*/
body:not(.hide_ruby) ruby>ruby+rt,
body:not(.hide_ruby) ruby>ruby+rp+rt {
    display: table-footer-group;
    }

/* <ruby>要素直下に<rt>要素が二つある場合 */
body:not(.hide_ruby) ruby>rt+rt {
    display: table-footer-group;
    }

body:not(.hide_ruby) rt {
    font-size:50%;
}




/* loadingエフェクト */
.three_dot_loader,
.three_dot_loader:before,
.three_dot_loader:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: three_dot_load 1.8s infinite ease-in-out;
  animation: three_dot_load 1.8s infinite ease-in-out;
}
.three_dot_loader {
  color: inherit;
  font-size: 100%;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:4em;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
.three_dot_loader:before,
.three_dot_loader:after {
  content: '';
  position: absolute;
  top: 0;
}
.three_dot_loader:before {
  left: -4.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.three_dot_loader:after {
  left: 4.5em;
}
@-webkit-keyframes three_dot_load {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes three_dot_load {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

.side-menu-panel select.select_in_list
{
    border:none;
    padding:10px 15px;
    height:auto;
}

.side-menu-panel select.select_in_list.light_green
{
    background-color:#f7fbf0;
}

/* スピーカーアイコン */

.speaker_icon {
    background:#aaf;
    border-radius:50%;

    opacity:1;
    transform:scale(1);
    
    transition:opacity 0.1s linear 0s, transform 0.1s linear 0s;
    
    cursor:pointer;

}

.speaker_icon.fadeout {
    opacity:0;
    transform:scale(0.3);
}

.speaker_icon.clicked {
    transform:scale(0.8);
    transition:none;
}


.speaker_icon .speaker {
    width:100%;
    height:100%;
    background-image:url(/resource/images/speaker.png);
    background-repeat:no-repeat;
    background-size:cover;
    transform:scale(0.5);
}

.speaker_icon.no_transition {
    transform:none;
}
.speaker_icon.no_transition .speaker {
    transform:none;
    background-size:18px;
    background-position:4px 4px;
}

.speaker_icon.disabled .speaker {
    background-image:url(/resource/images/speaker_disabled.png);
}

.speaker_icon.disabled {
    pointer-events:none;
    opacity:0.8;
}

.disabled_area{
    pointer-events: none;
    opacity: 0.65;
}

.speaker_icon .speaker.playing {
    /*animation*/
    -webkit-animation:pump 0.15s 0.15s infinite alternate;
       -moz-animation:pump 0.15s 0.15s infinite alternate;
        -ms-animation:pump 0.15s 0.15s infinite alternate;
         -o-animation:pump 0.15s 0.15s infinite alternate;
            animation:pump 0.15s 0.15s infinite alternate;
}

.speaker_icon.no_transition .speaker.playing {
    background-size:cover;
    background-position:0 0;
    transform:scale(0.5);
}
/* マイクアイコン */

.microphone_icon {
    background: #ff6700;
    border-radius:50%;
    
    opacity:1;
    transform:scale(1);
    
    transition:opacity 0.1s linear 0s, transform 0.1s linear 0s;
    
    cursor:pointer;
    
}

.microphone_icon.fadeout {
    opacity:0;
    transform:scale(0.3);
}

.microphone_icon.clicked {
    transform:scale(0.8);
    transition:none;
}


.microphone_icon .microphone {
    width:100%;
    height:100%;
    background-image:url(/resource/images/microphone.png);
    background-size:cover;
    transform:scale(0.5);
    
}

.microphone_icon.disabled .microphone {
    background-image:url(/resource/images/microphone.png);
}

.microphone_icon .microphone.recording {
    /*animation*/
    -webkit-animation:pump 0.15s 0.15s infinite alternate;
       -moz-animation:pump 0.15s 0.15s infinite alternate;
        -ms-animation:pump 0.15s 0.15s infinite alternate;
         -o-animation:pump 0.15s 0.15s infinite alternate;
            animation:pump 0.15s 0.15s infinite alternate;
}


/* 音声認識アイコン */

.speech_recognition_icon {
    background:#476847;
    border-radius:50%;
    
    opacity:1;
    transform:scale(1);
    
    transition:opacity 0.1s linear 0s, transform 0.1s linear 0s;
    
    cursor:pointer;
    
}

.speech_recognition_icon.fadeout {
    opacity:0;
    transform:scale(0.3);
}

.speech_recognition_icon.clicked {
    transform:scale(0.8);
    transition:none;
}


.speech_recognition_icon .recognition {
    width:100%;
    height:100%;
    background-image:url(/resource/images/speech_recognition.png);
    background-size:cover;
    transform:scale(0.7);
    
}


.speech_recognition_icon .recognition.recording {
    /*animation*/
    -webkit-animation:pump 0.15s 0.15s infinite alternate;
       -moz-animation:pump 0.15s 0.15s infinite alternate;
        -ms-animation:pump 0.15s 0.15s infinite alternate;
         -o-animation:pump 0.15s 0.15s infinite alternate;
            animation:pump 0.15s 0.15s infinite alternate;
}



/* ダウンロードアイコン */
.download_icon {
    background:#db8d1f;
    border-radius:50%;
    
    opacity:1;
    transform:scale(1);
    transition:opacity 0.1s linear 0s, transform 0.1s linear 0s;
    cursor:pointer;
    
}

.download_icon .download {
    width:100%;
    height:100%;
    background-image:url(/resource/images/download.png);
    background-size:cover;
    transform:scale(0.5);
}

/* アップロードアイコン */
.upload_icon {
    background:#db8d1f;
    border-radius:50%;
    
    opacity:1;
    transform:scale(1);
    transition:opacity 0.1s linear 0s, transform 0.1s linear 0s;
    cursor:pointer;
    
}

.upload_icon .upload {
    width:100%;
    height:100%;
    background-image:url(/resource/images/upload.png);
    background-size:contain;
    background-repeat:no-repeat;
    background-position:50% 50%;
    transform:scale(0.7);
}

.upload_icon .upload.finished {
    background-image:url(/resource/images/upload_finished.png);
}

/* ローディングアイコン */
.loading_icon {
    background:#939393;
    border-radius:50%;
    
    opacity:1;
    transform:scale(1);
    transition:opacity 0.1s linear 0s, transform 0.1s linear 0s;
    cursor:pointer;
}


@-webkit-keyframes pump {
    from{
        -webkit-transform:scaleY(0.7);
        transform:scale(0.7);
    }
    to{
        -webkit-transform:scaleY(0.6);
        transform:scale(0.6);
    }
}
@-moz-keyframes pump {
    from{
        -moz-transform:scaleY(0.7);
        transform:scale(0.7);
    }
    to{
        -moz-transform:scaleY(0.6);
        transform:scale(0.6);
    }
}
@-ms-keyframes pump {
    from{
        -ms-transform:scaleY(0.7);
        transform:scale(0.7);
    }
    to{
        -ms-transform:scaleY(0.6);
        transform:scale(0.6);
    }
}
@-o-keyframes pump {
    from{
        -o-transform:scaleY(0.7);
        transform:scale(0.7);
    }
    to{
        -o-transform:scaleY(0.6);
        transform:scale(0.6);
    }
}
@keyframes pump {
    from{
        transform:scale(0.7);
    }
    to{
        transform:scale(0.6);
    }
}


.empty_row.hide_if_empty_table
{
    display:none;
}

.field_row + .empty_row.hide_if_empty_table
{
    display:table-row;
}

ul.large_disc_blue
{
    list-style:none;
}

ul.large_disc_blue > li
{
    position:relative;
}

ul.large_disc_blue > li::before
{
    position:absolute;
    content:'●';
    left:-1.1em;
    color:#244e79;
}


body .toast_alert
{
    position:fixed;
    bottom:5px;
    right:5px;
    display:inline-block;
    width:auto;
    min-width:30%;
    z-index:9999;
    opacity:1;
    transition:opacity 0.2s 0s linear;
}
body .toast_alert.before
{
    opacity:0;
}


.restore_test_dialog h2.title
{
    display: block;
    width: 640px;
    max-width: 100%;
    margin: 20px auto 30px auto;
    text-align: center;
    padding: 0.6em 1em 0.5em 1em;
    color: #fff;
    background-color: #007cb7;
    font-size: 22px;
    font-weight: bold;
    border-radius: 5px;
}

.restore_test_dialog input[type=text]
{
    border:none;
}

input.radio_red{
    accent-color: #c24e51;
}

/*
#restore_target_test_table td
{
    background-color:#fff;
}

*/

.content_title_container
{
    display:flex;
    justify-content:center;
    flex-wrap:nowrap;
    margin-top:30px;
}

.content_title_container .spacer
{
    width:20px;
    margin-right:8px;
    background-color:#006899;
    display: none;
}

.content_title_container h2.content_title
{
    margin: 0;
    background-color: #595959;
    padding: 0.5em 1em 0.4em 2em;
    color: #fff;
    font-weight: bold;
    font-size: 24px;
    border-radius: 13px;
    border: solid 4px #cbc9c9;
}

.content_title_container h2.content_title::after
{
    content: "\25CF";
    position: absolute;
    top: 8px;
    left: 14px;
    font-size: 30px;
}

/* 全教材 */
.content_title_container h2.content_title::after
{
    color: #eb701d;
}

/* ICTテスト */
.content_title_container h2.content_title.color_47::after,
.content_title_container h2.content_title.color_54::after
{
    color: #4472c4;
}

/* speaking&writingテスト */
.content_title_container h2.content_title.color_44::after
{
    color: #cc3300;
}

.content_title_container h2.content_title.color_63::after
{
    color: #32354F;
}

.content_title_container h2.content_title.color_64::after
{
    color: #FF7715;
}

.content_title_container h2.content_title.color_65::after
{
    color: #2B81B6;
}

/* ICTトレーニング */
.content_title_container h2.content_title.color_57::after
{
    color: #0e466b;
}


/* 色付きテーブル */
.color_table
{
    width:auto;
    margin-left:auto;
    margin-right:auto;
    background-color:#fff;
    border-collapse:separate;
    border-spacing:3px;
    border:none;
}

.color_table th
{
    text-align:center;
    vertical-align:middle!important;
    padding: 0.9em 0.5em 0.8em 0.5em!important;
    color: #FFFFFF;
    font-size: 90%;
    font-weight: normal;
    font-weight: bold;
    text-align: center;
    /*text-shadow: 1px 1px 0px rgba(0,0,0,0.2);*/
    white-space:nowrap;
    border:none!important;
}

.color_table.blue th
{
    /* background-color:#006899; */
    background-color:#0d1241;
}

.color_table.orange th
{
    background-color:#d75200;
}

.color_table th.sort
{
    cursor:pointer;
}


.color_table th span.glyphicon
{
    font-size:80%;
}


.color_table td
{
    vertical-align:middle!important;
    white-space:nowrap;
    border:none!important;
    /* background-color:#dfefda; ～2023/08/30まで適用していた色*/
    background-color: #eeeeee;
}

.test_list_title_container
{
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    align-items:flex-end;
    padding:0 3px;
}

.test_list_title_container .test_list_title
{
    font-weight:bold;
    font-size:120%;
    margin-bottom:0em;
    margin-top:0em;
    color:#006899;
}

.test_list_title_container.blue .test_list_title
{
    /* color:#006899; */
    color: #0d1241;
}

.test_list_title_container.orange .test_list_title
{
    color:#d75200;
}

.test_list_title_container .test_transfer_buttons
{
    white-space:nowrap;
}

.test_list_title_container .test_transfer_buttons button
{
    /* color:#006899; */
    color:#0d1241;
    font-weight:bold;
    border-radius:10px;
    border-width:2px;
    /* border-color:#2391b0; */
    border-color:#0d1241;
    line-height:1.1em;
    padding:0.6em 1.2em;
    
}

.test_list_title_container .test_list_description
{
    color:#006899;
    font-weight:bold;
    font-size:90%;
}

.test_list_title_container.blue .test_list_description
{
    /* color:#006899; */
    color: #0d1241;

}

.test_list_title_container.orange .test_list_description
{
    color:#d75200;
}

.test_process_notice_container
{
    
    display:inline-block;
    width:785px;
    margin:40px auto 0px auto;
    padding:1em 1.2em;
    border:1px solid #6e8ba7;
    border-left-width:8px;
    max-width: 100%;
    
}

.test_process_notice_container .test_process_notice_table
{
    width:auto;
    padding:0;
    margin:0;
}

.test_process_notice_container .test_process_notice_table td
{
    padding:1em 1.2em 0.2em 0em;
    text-align:left;
    vertical-align:middle;
    
}

.test_process_notice_container .test_process_notice_table .test_process_notice_title
{
    font-size: 18px; 
    color: #333;
}

.test_process_notice_container .test_process_notice_table td .label
{
    font-size: 12px;
}

.test_process_notice_container .test_process_notice_table td.blue
{
    color:#165596;
}

.border_button
{
    border-radius:8px;
    border-width:3px;
    border-style:solid;
}

.border_button.thin_border
{
    border-radius:6px;
    border-width:2px;
}


.border_button.border_blue,
.border_button.border_blue:hover
{
    border-color:#2f528f;
}

.border_button.border_orange,
.border_button.border_orange:hover
{
    border-color:#f08300;;
}

.border_button.border_green,
.border_button.border_green:hover
{
    border-color:#92d050;
}

.border_button.border_navy,
.border_button.border_navy:hover
{
    border-color:#32354F;
}

.border_button.border_bluegreen,
.border_button.border_bluegreen:hover
{
    border: solid 2px #20897d;
}

.border_button.border_primary,
.border_button.border_primary:hover
{
    border: solid 2px #337ab7;
}

.border_button.border_danger,
.border_button.border_danger:hover
{
    border: solid 2px #d9534f;
}

.border_button.border_success,
.border_button.border_success:hover
{
    border-color: #35b935;
}

.btn-default.btn_back{
    border-color: #55bddc;
    border-radius: 50px;
}

.btn_try_again{
    height: 32px;
    line-height: 30px;
    width: 7.5em;
    font-size: 16px;
}

.btn_try_again.disabled {
    opacity:0.3;
    pointer-events:none;
}

/* マニュアル開閉ボタン */
.btn_manual{
    border-color: #cf433f;
    border-width: 2px;
    font-weight: bold;
    display: flex;
    align-items: center;
    padding: 0px 10px;
}
.btn_manual:hover{
    border-color: #cf433f;
}
.btn_manual img{
    width: 40px;
    margin-right: 5px;
}
.btn_manual .manual_btn_memo_text{
    line-height: 14px;
}

.manual_btn_area{
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 1;
}

.manual_btn_area.manual_btn_right{
    position: relative;
    display: flex;
    justify-content: right;
}


#group_test_term_edit_dialog .manual_btn_area{
    right: 50px;
    top: 8px;
}

.manual_btn_area.manual_btn_test_list{
    top: 0;
    right: 0;
    position: relative;
    display: flex;
    justify-content: right;
}

/* 自作ボタン（※全カラー対応のため） */
/* ここから、文字カラー */
/* 白 */
.btn-make-white
{
    color: white!important;
    font-weight: bold;
    border: solid 1.5px black;
    border-radius: 4px;
    padding: 2px 15px;
}
.btn-make-white:hover
{
    opacity: 0.99;
    color: white!important;
    border-radius: 4px;
}
.btn-make-white:hover:disabled
{
    opacity: 0.2;
}
.btn-make-white::before
{
    background-color: #000;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    position: absolute;
    opacity: 0.2;
}
/* ここまで、文字カラー */


/* ここから、ボタンカラー */
/* 参考：https://www.i-iro.com/dic/ */
.btn-scarlet
{
    background-color: #ea5539;
    border-color:#c0270c;
}

.btn-cherry{
    background-color: #e04242;
    border-color: #952020;
}

.btn-wine
{
    background-color: #932e44;
    border-color:#450d19;
}

.btn-nikkeiiro {
    background-color: #c55a11;
    border-color: #a24404;
}

.btn-mandarin{
    background-color: #e99928;
    border-color: #cd892a;
}

.btn-daidaiiro{
    background-color: #f08300;
    border-color: #b86500;
}

.btn-gray {
    background-color: #666666;
    border-color: #8a8a8a;
}
.btn-gray:hover {
    background-color: #060606;
    border-color: #8a8a8a;
}

.btn-green{
    background-color: #3fff2f;
    border-color: #83bd7e;
}

.btn-malachite{
    background-color: #3c763d;
    border-color: #83bd7e;
}

.btn-blue{
    background-color: #2f44ff;
    border-color: #000f93;
}

.btn-cyan{
    background-color: #627a99;
    border-color: #bad7ec;
}

.btn-medium-green{
    background-color: #43843c;
    border-color: #bde2b7;
}

.btn-primary-make{
    background-color: #2c699f;
    border-color: #245580;
}
.btn-primary-make:hover{
    background-color: #123554;
    border-color: #000000;
}

.btn-warning-make{
    background-color: #efaa48;
    border-color: #e38d13;
}
.btn-warning-make:hover{
    background-color: #ff9500;
    border-color: #ff9600;
}

.btn-danger-make{
    background-color: #cf433f;
    border-color: #cf433f;
}

.btn-danger-make:hover{
    background-color: #bc2d28;
    border-color: #550c09;
}

.btn-light-red {
    background-color:#ff5d5d;
    border-color: #f2aa84;
}

.btn-light-red:hover {
    background-color:#ff5d5d;
    border-color: #f2aa84;
}

.btn-coral-red {
    background-color:#ff5050;
    border-color: #af1717;
}

.btn-coral-red:hover {
    background-color:#af1717;
    border-color: #af1717;
}

.btn-wine_2
{
    background-color: #a72323;
    border-color:#901630;
}

.btn-brains_navy{
    background-color: #32354F;
    border-color: #191d3d;
}


/* ここまで、ボタンカラー */


/* ここから、ボタンの形状 */
/* 丸角 */
.btn-radius,
.btn-radius:hover,
.btn-radius::before
{
    border-radius: 100px;
}

.btn-radius-10,
.btn-radius-10:hover,
.btn-radius-10::before
{
    border-radius: 10px;
}
.btn-radius-20,
.btn-radius-20:hover,
.btn-radius-20::before
{
    border-radius: 20px;
}
.btn-radius-30,
.btn-radius-30:hover,
.btn-radius-30::before
{
    border-radius: 30px;
}

.btn-radius_half,
.btn-radius_half:hover,
.btn-radius_half::before
{
    border-radius: 10px 4px 10px 4px;
}
/* ここまで、ボタンの形状 */


/* ここからボタンのサイズ */
.btn_biggest
{
    border-width: 2px;
    padding: 10px 20px;
    font-size: 18px;
}

.btn_bigger
{
    font-size: 16px;
    padding: 5px 15px;
    border-width: 2px;
}

.btn_smaller
{
    font-size: 12px;
    padding: 2px 8px;
    border-width: 2px;
}
/* ここまでボタンのサイズ */






/* 自作ラベル色 */
/* 白 */
.label-make-white
{
    display: inline-block;
    height: 25px;
    line-height: 26px;
    width: max-content;
    padding: 0px 15px;
    font-size: 16px;
    color: #fff;
}

.label-make-white-2{
    padding: 7px 0;
    font-size: 12px;
    background-color: white;
    color: #EFAA46;
    margin: 0 0 0 10px;
    vertical-align: middle;
    border-radius: 0;
    width: 6.4em;
    text-align: center;
    overflow: hidden;
}

.label-make-white-3{
    padding: 7px 0;
    font-size: 12px;
    background-color: white;
    color: #636363;
    margin: 0 0 0 10px;
    vertical-align: middle;
    border-radius: 0;
    width: 6.4em;
    text-align: center;
    overflow: hidden;
}

/* 橙色系 */
.label-make-orange-1{
    border-radius: 0;
    margin-right: 5px;
    padding: 9px 0;
    font-size: 12px;
    background-color: #EFAA46;
    color: white;
    vertical-align: middle;
    width: 6.4em;
    text-align: center;
    overflow: hidden;
}




/* ここから、ラベルカラー */
/* 参考：https://www.i-iro.com/dic/ */

.label-speaking{
    background-color: #205867;
}

.label-ai_speaking{
    background-color: #ff7715;
}

.label-writing{
    background-color: #3e8f3e;
}

.label-ai_writing{
    background-color: #cc3300;
}

.label-ai_talking {
    background-color: #ff5050;
}

.label-ai_image_talk {
    background-color: #2b9589;
}

.label-ai_conversation {
    background-color: #32354f;
}

.label-ai_essay {
    background-color:#2b81b6;
}

.label-ai_translate {
    background-color:#009172;
}

.label-scoring{
    background-color: #FFAAAA;
}
/* ここまで、ラベルカラー */


/* ここから、ラベルの形状 */
/* 丸角 */
.label-radius
{
    border-radius: 100px;
}
/* ここまで、ラベルの形状 */


/* ここからラベルのサイズ */
.label_bigger
{
}

.label_smaller
{
}
/* ここまでラベルのサイズ */


.color_dark_blue
{
    color:#1f3864;
}

.color_light_red
{
    color:#c45911;
}

.color_orange
{
    color:#ff5722;
}

.color_label
{
    display: inline-block;
    padding: 0.3em 0.7em 0.2em 0.7em;
    color: #fff;
    border-radius: 0.4em;
    font-size: 90%;
    width: 25em;
    text-align: left;
    font-weight: bold;
}

.color_label.label_blue
{
    background-color:#0070c0;
    background-color:#32354F;

}

.color_label.label_light_red
{
    background-color:#c55a11;/*既存カラー*/
    background-color:#ff771a;
    background-color:#32354F;
}

.modal_header_blue
{
    display: block;
    margin: -15px -15px 15px -15px;
    text-align: center;
    padding: 0.9em 1em 0.8em 1em;
    color: #fff;
    background-color: #007cb7;
    font-size: 22px;
    font-weight: bold;
}

.color_title
{
    display:block;
    width:100%;
    padding:0.9em 0.8em;
    text-align:center;
    font-weight:bold;
    font-size:18px;
    color:#fff;
    margin-bottom:0.5em;
}

.color_title.title_border
{
    border-radius: 10px;
}

.color_title.title_font_24px
{
    font-size: 24px;
}

.color_title.title_blue
{
    background-color:#155697; 
}

.color_title.title_wine
{
    background-color:#a72323; 
}

.color_title.title_gray_blue
{
    background-color:#8497b0;
}


.color_container
{
    padding:0.5em;
    margin-bottom:0.5em;
    border:2px solid #666;
}

.color_container.container_blue
{
    border-color:#19538f;
    background-color:#dee5ec;
}

.common_ol
{
    font-size:16px;
    padding-left:2.5em;
    margin: 10px auto;
}

.color_notice
{
    display: inline-block;
    text-align: left;
    width: auto;
    margin-top: 0.2em;
    margin-bottom: 30px;
    font-size: 16px;
    padding:1em 1em 1em 1em;
    background-color:#e2f0d9;
    border-radius:10px;
    font-weight: bold;
}

.color_notice.notice_gray_blue
{
    text-align:center;
    padding:1.4em 2em 1.5em 2em;
    font-size:16px;
    color:#fff;
    font-weight:bold;
    background-color:#8497b0;
    line-height:1.8em;
}

.color_notice ol
{
    display: inline-block;
    text-align: left;
    width: auto;
    padding-left:1.5em;
}

.color_notice ul
{
    display: inline-block;
    text-align: left;
    width: auto;
    padding-left:1.5em;
}


.color_notice li
{
    margin-bottom:0.5em;
}

.color_notice li:last-child
{
    margin-bottom:0;
}


.text_red
{
    color:red;
}

.text_blue
{
    color:#1b4d77;
}

.text_light_blue
{
    color:#2e73b5;
}


.border_label
{
    background-color:#e6f4e6;
    border:1px solid #5cb85c;
    color:#000;
}

.button_breadcrumb
{
    display:flex;
    justify-content:center;
    margin-bottom:15px;
}

@media(max-width:1023px)
{
    .button_breadcrumb
    {
        margin-top:10px;
    }
}

.button_breadcrumb a
{
    display:inline-block;
    margin:3px;
}

.edit_save_area
{
    margin-bottom:0.2em;
    display: flex;
    justify-content: right;
}

.save_apple
{
    background-image: url(/resource/images/icon_save_apple.png);
    height: 60px;
    aspect-ratio: 1 / 1;
    background-size: contain;
    transition: 0.2s;
    z-index: 1;
    opacity: 0.9;
}

.save_apple:hover
{
    animation: save_apple-shake 0.3s ease-in-out;
    transform: scale(1.2);
    opacity: 1;
    cursor: pointer;
}

@keyframes save_apple-shake {
    0%   { transform: scale(1) rotate(0deg); }
    25%  { transform: scale(1.2) rotate(-3deg); }
    50%  { transform: scale(1.2) rotate(3deg); }
    75%  { transform: scale(1.2) rotate(-3deg); }
    100% { transform: scale(1.2) rotate(0deg); }
}

.nav-tabs.thick
{
    border-bottom:2px solid #ddd;
}

.nav-tabs.thick > li > a
{
    margin-bottom:-2px;
}

.nav-tabs.thick > li > a
{
    margin-right: 4px;
    border: 1px solid transparent;
    border-bottom:2px solid #ddd;
    border-radius: 6px 7px 0 0;
    background-color:#eee;
    padding:15px 20px;
}

.nav-tabs.thick > li.active > a
{
    position:relative;
    border: 2px solid #ddd;
    border-bottom:2px solid #fff;
    background-color:#fff;
    pointer-events:none;
}

/*
.nav-tabs.thick > li.active > a:after
{
    position:absolute;
    left:50%;
    bottom:-0.8em;
    margin-left:-10px;
    content:'\e072';
    font-family:'Glyphicons Halflings';
    font-size:20px;
    transform:rotate(90deg);
    color:#666;
}
*/

table .ellipsis_cell
{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:0;
}

table .ellipsis_cell br
{
    display:none!important;
}

table .ellipsis_cell .ellipsis_hide
{
    display:none!important;
}

table .ellipsis_cell.clear_ellipsis
{
    white-space:unset;
}

.loading_spinner .spinner {
  -webkit-animation: rotate 2s linear infinite;
          animation: rotate 2s linear infinite;
  z-index: 2;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -25px 0 0 -25px;
  width: 50px;
  height: 50px;
}
.loading_spinner .spinner .path {
  stroke: #93bfec;
  stroke-linecap: round;
  -webkit-animation: dash 1.5s ease-in-out infinite;
          animation: dash 1.5s ease-in-out infinite;
}

@-webkit-keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}


#dialog-confirm-common .loading_spinner
{
    display:none;
}

#dialog-confirm-common.loading .loading_spinner
{
    display:block;
    position:fixed;
    top:40%;
    left:50%;
    margin-left:-64px;
    width:128px;
    height:128px;
}

#dialog-confirm-common.loading .modal-dialog
{
    display:none!important;
}

.triangle{
    border-top: 30px solid #8497b0;
    border-right: 30px solid transparent;
    border-left: 30px solid transparent;
    width: 0;
}

.subject_color-1 {
    background-color:#757070;
}
.subject_color-2 {
    background-color:#323f4f;
}
.subject_color-3 {
    background-color:#1f3864;
}
.subject_color-4 {
    background-color:#833c0b;
}
.subject_color-5 {
    background-color:#525252;
}
.subject_color-6 {
    background-color:#7f6000;
}
.subject_color-7 {
    background-color:#1e4e79;
}
.subject_color-8 {
    background-color:#375623;
}
.subject_color-9 {
    background-color:#afabab;
}
.subject_color-10 {
    background-color:#8496b0;
}
.subject_color-11 {
    background-color:#2f5496;
}
.subject_color-12 {
    background-color:#c55a11;
}
.subject_color-13 {
    background-color:#7b7b7b;
}
.subject_color-14 {
    background-color:#bf9000;
}
.subject_color-15 {
    background-color:#2e75b5;
}
.subject_color-16 {
    background-color:#538135;
}


.subject_border_color-1 {
    border-color:#757070!important;
}
.subject_border_color-2 {
    border-color:#323f4f!important;
}
.subject_border_color-3 {
    border-color:#1f3864!important;
}
.subject_border_color-4 {
    border-color:#833c0b!important;
}
.subject_border_color-5 {
    border-color:#525252!important;
}
.subject_border_color-6 {
    border-color:#7f6000!important;
}
.subject_border_color-7 {
    border-color:#1e4e79!important;
}
.subject_border_color-8 {
    border-color:#375623!important;
}
.subject_border_color-9 {
    border-color:#afabab!important;
}
.subject_border_color-10 {
    border-color:#8496b0!important;
}
.subject_border_color-11 {
    border-color:#2f5496!important;
}
.subject_border_color-12 {
    border-color:#c55a11!important;
}
.subject_border_color-13 {
    border-color:#7b7b7b!important;
}
.subject_border_color-14 {
    border-color:#bf9000!important;
}
.subject_border_color-15 {
    border-color:#2e75b5!important;
}
.subject_border_color-16 {
    border-color:#538135!important;
}


label.round_check_box
{
    display:inline-flex;
    flex-wrap:nowrap;
    font-size:18px;
    font-weight:normal;
    padding-left:0px;
    vertical-align:middle;
    cursor:pointer;
}

label.round_check_box > *
{
    pointer-events:none;
}

label.round_check_box input
{
    display:none;
}

label.round_check_box input + span
{
    white-space:nowrap;
    opacity:1;
}

label.round_check_box input + span:before
{
    content: ' ';
    display: inline-block;
    position: relative;
    width: 24px;
    height: 24px;
    background: #f0f0f0;
    border: 2px solid #00633e;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
    top: -2px;
    box-shadow: inset 2px 2px 5px 0px rgba(0, 0, 0, 0.2);
    opacity: 0.7;
}

label.round_check_box input:checked + span:before
{
    content: '\e013';
    color: #fff;
    font-family: Glyphicons Halflings;
    background: #00633e;
    border-color: #00633e;
    box-shadow: none;
    text-align: center;
    font-size: 14px;
    opacity: 1;
}

label.round_check_box input:checked + span
{
    opacity:1;
}

label.round_check_box.navy input + span:before
{
     border-color: #000080;
}
label.round_check_box.navy input:checked + span:before
{
    background: #000080;
}



select.color_select
{
    padding:4px;
    padding-right:15px;
    border-radius:0;
    box-shadow:none;
    -webkit-appearance:none;
    appearance:none;
    border:1px solid #666;
}

select.color_select option
{
    color:#000;
}

select.color_select:focus
{
    background-color:#fff!important;
    color:#000!important;
}


select.color_select.selected:not(:focus)
{
    background-color: rgb(255, 0, 0);
    border-radius: 0.5em;
    border-color:transparent;
    text-align: center;
    color:#fff;
}

select.color_select + div.placeholder
{
    display:none;
    position:absolute;
    vertical-aling:top;
    top:1px;left:3px;
    width:auto;
    height:calc(100% - 2px);
    padding-left:3px;
    color:#333;
    pointer-events:none;
    background:transparent;
}

select.color_select.empty + div.placeholder
{
    display:block;
}

select.color_select.empty
{
    color:transparent;
}

select.color_select.empty:focus option
{
    color:#333;
}


.error_content_wrapper
{
    padding:0.5em;
}

.error_content_wrapper .error_content
{
    margin:30px auto;
    width:max-content;
    max-width:100%;
    text-align:center;
}

.error_content_wrapper .error_content .title
{
    width:max-content;
    max-width:100%;
    margin:1.5em auto 2em auto;
    font-size:28px;
    font-weight:bold;
    color:#008000;
    border:4px solid #008000;
    padding:0.3em 0.8em 0.2em 0.8em;
    text-align:left;
}

.error_content_wrapper .error_content .content
{
    width:max-content;
    max-width:100%;
    margin:0 auto 3em auto;
    font-size:18px;
    color:#222;
    text-align:center;
}

.error_content_wrapper .error_content .content p
{
    width:max-content;
    max-width:100%;
    margin:0 auto 0.2em auto;
    text-align:left;
}

.error_content_wrapper .solution
{
    width:max-content;
    max-width:100%;
    margin:0 auto;
    padding:2em 2em;
    font-size:16px;
    color:#222;
    text-align:left;
    background-color:#FDFFF5;
    border-radius:8px;
}

.error_content_wrapper .solution > p,
.error_content_wrapper .solution > div
{
    display:block;
    width:max-content;
    max-width:100%;
}

.error_content_wrapper .solution > p.center,
.error_content_wrapper .solution div.center
{
    margin:0 auto;
}


.hold_transition
{
    transition:none!important;
}

/* ブートストラップ3 打消し防止 */
.collapse{
    display: none !important;
}

.collapse.in{
    display: block !important;
}