@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700&display=swap&subset=japanese');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=BIZ+UDPGothic:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;900&display=swap');

html {
    margin: 0;
    padding: 0;
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    width: 100%;
    height: 100%;
    font-size: 62.5%;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", sans-serif;
    color: #000;
    font-size: 1.4rem;
    width: 100%;
    height: 100%;
    background: #fff;
}

_:-ms-lang(x)::-ms-backdrop body {
    font-family: "メイリオ", Meiryo, sans-serif;
}

div {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: #000;
}

a:hover {
    color: #484848;
}

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

img {
    width: 100%;
    height: auto;
}

input[type="text"],
input[type="email"],
select,
input[type="tel"] {
    -webkit-appearance:none;
}

input[type="text"] {
    font-size: 1.6rem;
}

select::-ms-expand {
    display: none;
}

input[type="submit"] {
    -webkit-appearance:none;
}

textarea {
    -webkit-appearance:none;
}

input[type="submit"]:focus {
    outline: 0;
}

::placeholder {
   color: #4b4b4b;
}

input:-webkit-autofill {
    transition: background-color 5000s ease-in-out 0s !important;
}

.-align_center {
    text-align: center !important;
}
.-align_right {
    text-align: right;
}

.-align_left {
    text-align: left;
}

.-mt_0 {
    margin-top: 0px !important;
}

.-mt_8 {
    margin-top: 8px !important;
}

.-mt_10 {
    margin-top: 10px !important;
}

.-mt_20 {
    margin-top: 20px !important;
}

.-mt_30 {
    margin-top: 30px !important;
}

.-mt_40 {
    margin-top: 40px !important;
}

.-mt_60 {
    margin-top: 60px !important;
}

.-mb_8 {
    margin-bottom: 8px !important;
}

.-mb_10 {
    margin-bottom: 10px !important;
}

.-mb_15 {
    margin-bottom: 15px !important;
}

.-mb_20 {
    margin-bottom: 20px !important;
}

.-mb_30 {
    margin-bottom: 30px !important;
}

.-mb_40 {
    margin-bottom: 40px !important;
}

.-pt_18 {
    padding-top: 18px !important;
}

.-fs_10 {
    font-size: 1.0rem !important;
}

.-fs_16 {
    font-size: 1.6rem !important;
}

.-fs_26 {
    font-size: 2.6rem !important;
}

.-mr_5 {
    margin-right: 5px !important;
}

.-mr_15 {
    margin-right: 15px !important;
}

.-ml_15 {
    margin-left: 15px !important;
}

.-f_small {
    font-size: 1.2rem !important;
}

.-fc_pink {
    color: #e53af6 !important;
}

.-fc_red {
    color: #c20025 !important;
}

.-fc_light_blue {
    color: #2e99e4 !important;
}

.-fc_link_blue {
    color: #3479b7 !important;
}

.-fw_normal {
    font-weight: 400;
}

.bold {
    font-weight: bold;
}
.underline {
    text-decoration: underline;
}

.-flex {
    display: flex;
}

.-flex_between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.-flex_center {
    display: flex;
    justify-content: center !important;
    align-items: center;
}

.fadein_sc {
    opacity: 0;
    transition: opacity .6s .1s;
}

.fadein_sc_up {
    opacity: 0;
    transform: translateY(120px);
    transition: opacity .6s .1s,transform .6s .1s;
}

.-w_100p {
    width: 100% !important;
}

.-w_50p {
    width: 50% !important;
}

.-w_auto {
    width: auto !important;
}

.-w_300 {
    width: 300px;
}

@media (min-width: 768px) {
    .-flex_between_pc {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
}

/*---------------------------------
 Common
---------------------------------*/
#wrapper {
    position: relative;
    min-height: 100%;
    height: auto;
    
    
    font-size: 1.6rem;
    line-height: 1.6;
}

.menu_area {
    display: none;
}

.logo {
    display: flex;
    align-items: center;
    color: #ECF0F1;
    font-weight: 400;
    font-size: 2.0rem;
    padding: 14px 0 0 10px;
    font-family: 'Montserrat', sans-serif;
}

.logo:hover {
    color: #ECF0F1;
}

.logo div {
    display: inline-block;
    border: 1px solid #EAEAEA;
    border-radius: 50%;
    margin: 0 5px 0 0;
    width: 28px;
    height: 28px;
    position: relative;
}

.logo i {
    font-size: 1.8rem;
    position: absolute;
    top: 3px;
    left: 3px;
}

.main_area {
    width: 100%;
    margin: 0 auto;
    background: #F7F7F7;
    position: relative;
}

.contents_header {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    background: #ededed;
    border-bottom: 1px solid #d9dee3;
}

.contents_footer {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    background: #fff;
    font-size: 1.2rem;
    line-height: 1;
    font-weight: 400;
    color: #73869c;
    padding: 0 36px;
}

.footer_area {
    width: 100%;
    height: 5px;
    margin: 0;
    padding: 0;
    background: #2b3f54;
    position: fixed;
    bottom: 0;
}
    
.container {
    width: 100%;
    padding: 10px;
    min-height: calc( 100vh - 105px );
}

.section {
    padding-top: 15px;
}

.display_pc {
    display: none;
}

.display_sp {
    display: inline-block;
}

.display_none {
    display: none;
}

h1, h2 {
    font-weight: 400;
    font-size: 2.2rem;
    color: #73869c;
    line-height: 1;
    border-bottom: 2px solid #e6e9ed;
    margin: 10px 0;
    padding: 0 0 16px 8px;
}

@media (min-width: 768px) {
    #wrapper {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }
    
    .menu_area {
        display: block;
        width: 230px;
        min-height: 100%;
        margin: 0;
        padding: 0;
        background: #2A3F54;
        animation: menu_area_stretch .6s cubic-bezier(0.77, 0, 0.175, 1) forwards;
    }
    
    .menu_area.load {
        animation: menu_area_load .0s;
    }

    .menu_area.is-short {
        animation: menu_area_shorten .6s cubic-bezier(0.77, 0, 0.175, 1) forwards;
    }
    
    .menu_area ul {
        margin: 10px 0 0;
    }
    
    .menu_area ul a {
        position: relative;
        display: block;
        padding: 12px 15px 12px 22px;
        color: #E7E7E7;
        font-size: 1.4rem;
        font-weight: 400;
    }
    .menu_area ul a i {
        margin: 0 5px 0 0;
        padding: 0;
    }
    
    .menu_area ul li.current {
        background: #4f6074;
        margin: 0px 0px 0px 12px;
        border-radius: 5px;
    }
    
    .menu_area ul li.current a {
        padding: 12px 15px 12px 10px;
    }
    
    .btn_menu_area_togge {
        color: #3479b7;
        font-size: 2.2rem;
        font-weight: 900;
        margin: 0 0 0 25px;
    }
    
    /*
    .menu_area ul a::before {
        position: absolute;
        top: 12px;
        left: 15px;
        content: "\f109";
        font-family: "Font Awesome 5 Free";
        font-weight: 700;
        font-size: 1.4rem;
        pointer-events: none;
    }
    
    .menu_area ul a.icon_user::before {
        content: "\f007";
    }
    
    .menu_area ul a.icon_cog::before {
        content: "\f085";
    }
    
    .menu_area ul a.icon_logout::before {
        content: "\f2f5";
        font-size: 1.7rem;
    }*/
    
    .main_area {
        width: calc( 100% - 230px );
        animation: main_area_stretch .6s cubic-bezier(0.77, 0, 0.175, 1) forwards;
    }
    
    .main_area.load {
        animation:main_area_load .0s;
    }

    .main_area.is-short {
        animation: main_area_shorten .6s cubic-bezier(0.77, 0, 0.175, 1) forwards;
    }
    
    .container {
        width: 100%;
        padding: 20px;
    }
    
}

@keyframes menu_area_shorten {
    0% {
        width: 230px;
    }
    100% {
        width: 80px;
    }
}

@keyframes menu_area_load {
    0% {
        width: 230px;
    }
}

@keyframes menu_area_stretch {
    0% {
        width: 80px;
    }
    100% {
        width: 230px;
    }
}

@keyframes menu_area_shorten {
    0% {
        width: 230px;
    }
    100% {
        width: 80px;
    }
}

@keyframes menu_area_load {
    0% {
        width: 230px;
    }
}

@keyframes menu_area_stretch {
    0% {
        width: 80px;
    }
    100% {
        width: 230px;
    }
}

@keyframes main_area_shorten {
    0% {
        width: calc( 100% - 230px );
    }
    100% {
        width: calc( 100% - 80px );
    }
}

@keyframes main_area_load {
    0% {
        width: calc( 100% - 230px );
    }
}

@keyframes main_area_stretch {
    0% {
        width: calc( 100% - 80px );
    }
    100% {
        width: calc( 100% - 230px );
    }
}





/*---------------------------------
 Btn
---------------------------------*/
.btn {
    display: inline-block;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 5px 16px 6px;
    border-radius: 4px;
    background: #3479b7;
    color: #fff !important;
    border: 1px solid #2f6da4;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    font-size: 1.3rem;
    letter-spacing: 1px;
    font-weight: 400;
}

a.btn:hover {
    color: #fff !important;
}

.btn_green {
    background: #27b999 !important;
    border: 1px solid #169f85 !important;
    color: #fff !important;
}

.btn_lightblue {
    background: #5cc1de !important;
    border: 1px solid #46b9d9 !important;
    color: #fff !important;
}

.btn_red {
    background: #cb444a !important;
    border: 1px solid #a7383d !important;
    color: #fff !important;
}

/*---------------------------------
 Form部品
---------------------------------*/

input[type="text"], input[type="password"] {
    position: relative;
    /*width: 100%;*/
    height: 34px;
    line-height: 34px;
    box-sizing: border-box;
    margin: 0;
    padding: 6px 12px;
    display: inline-block;
    color: #555;
    background: #fff;
    border: 1px solid #ccc;
    outline: none;
    -webkit-appearance: none;
    font-size: 1.4rem;
    font-weight: 400;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
}

textarea {
    position: relative;
    width: 100%;
    /*height: 100px;*/
    line-height: 1.5;
    box-sizing: border-box;
    margin: 0;
    padding: 6px 12px;
    display: inline-block;
    color: #555;
    background: #fff;
    border: 1px solid #ccc;
    outline: none;
    -webkit-appearance: none;
    font-size: 1.4rem;
    font-weight: 400;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
}

.form_search_area input[type="submit"], .form_login_area input[type="submit"], .form_input_area input[type="submit"] {
    display: inline-block;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 5px 16px 6px;
    border-radius: 4px;
    background: #3479b7;
    color: #fff;
    border: 1px solid #2f6da4;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    font-size: 1.3rem;
    letter-spacing: 1px;
    font-weight: 400;
    transition: background .3s;
    cursor: pointer;
}

.form_search_area {
    padding: 10px 16px 15px;
    background: #fff;
    border: 1px solid #E6E9ED;
    font-size: 1.2rem;
    line-height: 1.8;
    font-weight: 700;
    color: #73869c;
}

.form_search_flex_area {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.form_search_area .flex_col3, .form_search_area .flex_col6 {
    width: 100%;
}

.form_search_area .flex_col6 input[type="text"] {
    width: 100%;
}

.form_search_area .flex_col3 .-w_47p, .form_search_area .flex_col3 input[type="text"] {
    width: 100%;
}

.form_search_area .flex_half {
    width: 100%;
}



.form_check {
    display: flex;
    align-items: center;
}

.form_check input[type="checkbox"] + label {
    position:relative;
    margin: 0 0 0 2px;
    padding: 0 ;
    font-size: 1.2rem;
    line-height: 1;
    font-weight: 400;
    color: #73869c;
    white-space: nowrap;
}

.form_input_wrap {
    width: 100%;
    margin: 0 auto;
}

.form_input_area + .form_input_area {
    margin: 16px auto 0;
}

.form_input_area .form_input_area_label {
    display: flex;
    align-items: center;
    font-size: 1.5rem;
    width: 100%;
    font-weight: 500;
    margin: 0 0 10px;
}

.form_login_area .form_login_area_label {
    display: flex;
    align-items: center;
    font-size: 1.4rem;
    font-weight: 400;
    width: 100%;
    margin: 0 0 10px;
}

.form_input_area_contents {
    font-size: 1.5rem;
    font-weight: 400;
}

.formField_Error .form_input_area_label {
    color: #c20025;
}

.formField_Error.form_input_area_contents {
    color: #c20025;
}

.error_msg_area {
    font-size: 1.4rem;
    color: #c20025;
    background: #fff6f8;
    padding: 8px;
    border: 1px solid #cdc9ca;
}

#loader, .loader_keyword {
    text-align: center;
    margin: 30px 0 20px;
    display: none;
}

#loader i, .loader_keyword i {
    font-size: 6.0rem;
    color: #73869c;
}

@media (min-width: 768px) {
    
    .form_search_area {
    }
    
    .form_search_area .flex_half {
        width: 49%;
    }

    .form_search_area .flex_col3 {
        width: 33%;
    }

    .form_search_area .flex_col6 {
        width: 16%;
    }

    .form_search_area .flex_col3 .-w_47p,.form_search_area .flex_col3 input[type="text"] {
        width: 47%;
    }
    
    .form_input_area + .form_input_area {
        margin: 25px auto 0;
    }
    
    .form_input_wrap {
        max-width: 600px;
        width: 100%;
        margin: 0 auto;
    }
    
}

.form_result_area {
    margin: 30px 0 0;
    padding: 10px 16px 30px;
    background: #fff;
    border: 1px solid #E6E9ED;    
}

.form_result_area .operation_area {
    margin: 12px 0 15px;
}

.form_result_area .operation_area .btn + .btn {
    margin: 0 0 0 8px;
}

/* Report01 */
#order_table .landing_cel {
    display: none;
}

/* Report02 */
.report_half_divide_area {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.report_half_divide_left_area {
    width: 100%;
}

.report_half_divide_right_area {
    position: relative;
    width: 100%;
}

.report_half_divide_area .slide-arrow {
    width: 25px;
    height: 50vh;
    position: absolute;
    z-index:2;
    cursor: pointer;
    opacity: .8;
}

.report_half_divide_area .slide-arrow.prev-arrow {
    left: -20px;
    top: 0px;
    /*top: 50%;
    transform: translateY(-50%);*/
}

.report_half_divide_area .slide-arrow.next-arrow {
    right: 0px;
    top: 0px;
    /*top: 50%;
    transform: translateY(-50%);*/
}

@media (min-width: 768px) {
    .report_half_divide_area {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .report_half_divide_left_area {
        width: 49%;
    }

    .report_half_divide_right_area {
        position: relative;
        width: 49%;
    }

    .report_half_divide_right_area .slide-arrow {
        width: 25px;
        height: 50vh;
        position: absolute;
        z-index:2;
        cursor: pointer;
        opacity: .8;
    }

    .report_half_divide_right_area .slide-arrow.prev-arrow {
        left: -20px;
        top: 0px;
        /*top: 50%;
        transform: translateY(-50%);*/
    }

    .report_half_divide_right_area .slide-arrow.next-arrow {
        right: 0px;
        top: 0px;
        /*top: 50%;
        transform: translateY(-50%);*/
    }
}

/* Report04 */
.keyword_report_half_divide_area {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.keyword_report_half_divide_left_area {
    width: 49%;
}

.keyword_report_half_divide_right_area {
    position: relative;
    width: 49%;
}


/*---------------------------------
 Table
---------------------------------*/

.scroll table {
    width: 100%;
    white-space: nowrap;
}
.scroll table td {
    white-space: normal;
}
.scroll {
    overflow: auto;
    white-space: nowrap;
}
.scroll::-webkit-scrollbar {
    height: 5px;
}
.scroll::-webkit-scrollbar-track {
    background: #f0f0f0;
}
.scroll::-webkit-scrollbar-thumb {
    background: #cdcdcd;
}

.table {
    width: 100%;
    max-width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
    margin: 30px 0 0;
}

.table .is_hide {
    display: none;
}

.table th, .table td {
    padding: 10px 8px;
    line-height: 1.4em;
    vertical-align: middle;
    border-top: 2px solid #dddddd;
    border-bottom: 2px solid #dddddd;
    font-size: 1.24rem;
    color: #73869c;
    font-weight: 700;
    text-align: left;
}

.table td {
    border-bottom: 1px solid #dddddd;
    font-weight: 400;
}

.table a {
    color: #73869c;
}

table .nowrap {
    white-space: nowrap;
}

table .noborder th {
    border: none;
}

table .noborder_bottom {
    border-bottom: none;
}

@media (min-width: 768px) {
    .scroll table {
        width: 100%;
        white-space: normal;
    }
    
    /*

    .table th {
        padding: 10px 8px;
        font-size: 1.3rem;
    }

    .table td {
        padding: 10px 8px;
    }*/
}

/* order */
/*
.tablesorter-headerUnSorted {
    background-image: url('../img/icon_triangle_up.png');
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: center right;
}*/
.tablesorter-headerUnSorted, .tablesorter-headerAsc, .tablesorter-headerDesc {
    background-image: none;
}
.tablesorter-headerUnSorted .tablesorter-header-inner {
    display: inline-block;
    padding: 0 20px 0 0;
    background-image: url('../img/icon_triangle_up.png');
    background-size: 14px 14px;
    background-repeat: no-repeat;
    background-position: center right;
}
.tablesorter-headerAsc .tablesorter-header-inner  {
    display: inline-block;
    padding: 0 20px 0 0;
    background-image: url('../img/icon_triangle_up.png');
    background-size: 14px 14px;
    background-repeat: no-repeat;
    background-position: center right;
    border-bottom: none;
}
.tablesorter-headerDesc .tablesorter-header-inner  {
    display: inline-block;
    padding: 0 20px 0 0;
    background-image: url('../img/icon_triangle_down.png');
    background-size: 14px 14px;
    background-repeat: no-repeat;
    background-position: center right;
    border-bottom: none;
}

.sorter-false {
    background-image: none;
}

.report_html_info_area .read_more_wrap {
    display: block;
    overflow-y: hidden;
    margin: 0;
    color: #b5b5b6;
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 1.6;
}

.report_html_info_area .btn_read_more {
    width: 100%;
    display: inline-block;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 5px 16px 6px;
    border-radius: 4px;
    background: #27b999;
    color: #fff;
    border: 1px solid #169f85;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    font-size: 1.3rem;
    letter-spacing: 1px;
    font-weight: 400;
}



/*---------------------------------
 Login
---------------------------------*/

#login_wrapper {
    width: 100%;
    height: 100vh;
    background: #F7F7F7;;
    margin: 0;
    display: flex;
    justify-content: center;
}

.login_area {
    width: 90%;
    margin: 0;
    padding: 100px 0;
}

.form_login_area + .form_login_area {
    margin: 15px 0 0;
}

.login_area input[type="text"], input[type="password"] {
    width: 100%;
}

@media (min-width: 768px) {

    .login_area {
        width: 480px;
        margin: 0;
        padding: 180px 30px 70px;
    }
    
}



.sort {cursor:pointer;}

.delete {display:none;}
.print_box {display:none;}
.analyze2_left {float:left;width:50%;}
.analyze2_right {float:right;width:50%;}
.clear {clear:both;}

table.site_table {word-break: break-all;}
table.site_table tbody tr th {width:120px;}
table.site_table tbody tr td span {height:18px;max-height:18px;overflow:hidden;display:block;}
table.site_table tbody tr td span.description {height:100px;max-height:100px;overflow:hidden;display:block;}

.heading_table_box {min-height:175px;}

.my-4 {margin-top:30px; margin-bottom: 30px;}
.mt-4 {margin-top:30px;}
.mb-4 {margin-bottom: 30px;}
.mx-4 {margin-left:30px; margin-right: 30px;}

p {font-size: 16px;}

.no_select td::selection,
.no_select a::selection,
.no_select input::selection,
.no_select label::selection,
.no_select div::selection {
    background: transparent;
    color: #73879C;
}

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {padding:10px;}
.btn.btn-dark {margin:0 5px;}