@charset "utf-8";

.header_pc_type{}

.header_pc_type .head_top{display: flex; justify-content: space-between; align-items: center; padding: 16px 0}

.header_pc_type .head_top .main_logo img{max-width: 150px}

.header_pc_type .content{text-align: right}

.header_pc_type .user_inner{font-size: 1.3rem;}
.header_pc_type .user_inner > *{display: inline-block; vertical-align: middle; color: #444}
.header_pc_type .user_inner > * + *{margin-left: 5px}
.header_pc_type .user_inner .adm{font-weight: 600; color: var(--df_color_highlight)}
.header_pc_type .user_inner .memo{position: relative;}
.header_pc_type .user_inner .memo *{text-align: left}
.header_pc_type .user_inner .memo .in_popup{position: absolute; left: 50%; top: 25px; transform: translateX(-50%); width: 350px; overflow: hidden; border: 1px solid #ddd; border-radius: 10px; background: #fafafa}
.header_pc_type .user_inner .memo .info_tit{padding: 10px; border-bottom: 1px solid #ededed; font-size: 1.4rem; font-weight: 500; background: #fff}
.header_pc_type .user_inner .memo .list{max-height: 385px; padding: 10px 10px 80px 10px; overflow: auto;}
.header_pc_type .user_inner .memo .list > li{padding: 10px; border: 1px solid #ededed; border-radius: 5px; opacity: 60%; cursor:pointer; background: #fff}
.header_pc_type .user_inner .memo .list > li.no_read{position: relative; opacity: 100%}
.header_pc_type .user_inner .memo .list > li.no_read::before{content: ''; position: absolute; left: 10px; top: 10px; width: 10px; height: 10px; border-radius: 50%; box-shadow: 0 0 10px 0 var(--df_color_background); background: var(--df_color_background);}
.header_pc_type .user_inner .memo .list > li + li{margin-top: 10px}
.header_pc_type .user_inner .memo .list .data{display: flex; justify-content: space-between; align-items: center}
.header_pc_type .user_inner .memo .list .send_user > *{vertical-align: middle}
.header_pc_type .user_inner .memo .list .send_user .img_box{width: 35px; height: 35px; margin-right: 8px; overflow: hidden; border-radius: 50%}
.header_pc_type .user_inner .memo .list .send_user .img_box img{width: 100%; height: 100%; object-fit: cover}
.header_pc_type .user_inner .memo .list .data .date{color: #777}
.header_pc_type .user_inner .memo .list .content{margin-top: 5px; padding-top: 5px; border-top: 1px solid #ededed}
.header_pc_type .user_inner .memo .more_btn{position: absolute; left: 0; bottom: 0; width: 100%;  padding: 20px 10px;  text-align: center; box-shadow: 0 -3px 10px 0 rgb(0 0 0 / 10%); background: #fafafa; color: #777}


.header_pc_type .search_form{margin-top: 16px}
.header_pc_type .search_form .search_input{font-size: 1.3rem}
.header_pc_type .search_form .search_input > *{}
.header_pc_type .search_form .text_input{width: 370px; height: 40px; padding: 0 16px; border: 1px solid #e1e1e1; border-radius: 5px}
.header_pc_type .search_form .this_btn{width: 65px; height: 40px; border-radius: 5px; background: var(--df_color_background); color: var(--df_color_font)}


.header_pc_type .head_nav{background: var(--df_color_background)}
.header_pc_type .head_nav.fixed{position: fixed; left: 0; top: 0; width: 100%;}
.header_pc_type .head_nav > *{display: flex; align-items: center}

.header_pc_type .menu_list{font-size: 1.6rem}
.header_pc_type .menu_list > li{position: relative; display: inline-block}
.header_pc_type .menu_list .menu{padding: 16px; color: var(--df_color_font)}
.header_pc_type .menu_list .sub_menu{ position: absolute; top: 48px; left: -5px; transform: translateY(-10px); width: 150px; overflow: hidden; border-radius: 10px; opacity: 0; visibility: hidden; font-size: 1.4rem; box-shadow: 0 0 10px 1px rgb(0 0 0 / 10%); background: #fff}
.header_pc_type .menu_list .sub_menu a{display: block; padding: 10px}


.header_pc_type .head_nav .full_menu_btn{position: relative; width: 20px; height: 30px; margin-right: 16px}
.header_pc_type .head_nav .full_menu_btn .line{position: absolute; left: 0; transition: all 0.5s; width: 100%; height: 2px; background: #fff}
.header_pc_type .head_nav .full_menu_btn .line_1{top: 6.5px;}
.header_pc_type .head_nav .full_menu_btn .line_2{top: 50%; transform: translateY(-50%)}
.header_pc_type .head_nav .full_menu_btn .line_3{bottom: 6.5px;}

.header_pc_type .menu_list > li:hover .sub_menu{transition: all 0.3s; transform: translateY(0); opacity:100; visibility: visible;}
.header_pc_type .menu_list .sub_menu a:hover{font-weight: 600; color: var(--df_color_highlight)}