:root{
    --main-bg:transparent;
    --main-fg:#315c9d;
    /* --main-bg  :#4aaab0;
    --main-fg  :#459da4; */
    --submit-fg:#459da4;
    --submit-bg:#459da4;
    --action-fg:#315c9d;
    --action-bg:#315c9d;
    --cancel-fg:#a44545;
    --label-bg :#515151;
    --label-fg :#f5f5f5;
}
body{ font-size:16px;color:#555;background:#f7f7f7;opacity:0; }
header{  }
main{ max-width:600px;margin:0 auto;margin-top:15px;padding-bottom:80px; }
/*-------------------------------------------------------*/
h2{ color:var(--main-fg);font-size:17px;margin-bottom:15px;font-size:98%; }
h2.info:before    { content:"\F249" !important; }
h2.expart:before  { content:"\F4DB" !important; }
h2.personal:before{ content:"\F4D7" !important; }
h2.confirm:before { content:"\F26B" !important; }
h2.list:before    { content:"\F477" !important; }
h2.voice:before   { content:"\F249" !important; }
/*-------------------------------------------------------*/
p{ font-size:85%;color:#666; }
/*-------------------------------------------------------*/
.logo{ position:fixed;width:200px;top:50%;left:5%;z-index:-1;transform:translateY(-50%); }
.logo img{ width:100%; }
/*-------------------------------------------------------*/
.thumbs{ display:flex;flex-wrap:wrap;margin:13px 0; }
.box{ background:#eee;border:0px var(--main-bg) solid;box-shadow:#999 0px 0px 2px;background:#fff;border-radius:2px; }
.info_box .row{ width:100%;margin-bottom:30px;padding-bottom:30px; }
.info_box .thumbs .img{ width:calc(10% - 4px);aspect-ratio:1/1;overflow:hidden;border:1px #ddd solid;border-radius:6px;margin:2px;cursor:pointer; }
.info_box .thumbs img{ width:100%;height:100%;object-fit:cover;object-position:center center; }
.info_box .files .file{ display:block;width:100%;padding:2px 2px;color:var(--main-fg);cursor:pointer; }
.info_box .files .file:before{ font-family:'bootstrap-icons';content:"\F356";position:relative;top:4px;margin-right:4px;font-size:120%; }
.info_box .subj{ color:var(--main-fg);;width:100%;font-size:95%;border-bottom:1px var(--main-fg) solid;padding-bottom:2px;margin-bottom:2px; }
.info_box .body{ margin-bottom:4px;height:fit-content;overflow:hidden; }
.info_box .date{ font-size:85%;text-align:right;opacity:0.8;padding:4px; }
/*-------------------------------------------------------*/
.dialog_template .box{ border:none; }
.dialog_template p{ color:#f5f5f5; }
/*-------------------------------------------------------*/
.expart_row{ width:98%;margin:0 auto;display:flex;gap:10px;align-items:flex-start;margin-bottom:15px;flex-wrap:wrap; }
.expart_row .icon{ width:15%;cursor:pointer; }
.expart_row .icon .image img{ width:100%;object-fit:cover;aspect-ratio:1/1.4;border-radius:7px; }
.expart_row .icon .bt_detail{ display:inline-block;color:var(--submit-fg);border-radius:7px;font-size:90%;line-height:100%;width:100%;text-align:center; }
.expart_row .info{ width:calc(85% - 10px);align-items:flex-start; }
.expart_row .info .name{ font-size:110%;color:var(--main-fg);cursor:pointer; }
.expart_row .comm{ width:100%;font-size:95%; }
.expart_row.detail .info{ gap:2px 10px; }
.expart_row.detail .info .name{ font-size:140%;cursor:auto;color:#555; }
.expart_row.detail .info .field{ margin-bottom:10px; }
.bt_expart_more{ display:inline-block;margin:20px auto;border:1px #999 solid;border-color:var(--main-fg);color:var(--main-fg);padding:10px 20px;border-radius:100px;font-size:90%; }
/*-------------------------------------------------------*/
#cc_dialog .review{ background:#fff;color:#555;padding:13px;border-radius:7px;font-size:95%; }
.bt_copy_reply{ display:inline-block;background:transparent;color:#f5f5f5;border-radius:3px;padding:3px 20px;position:relative;top:5px;left:50%;transform:translateX(-50%);font-size:85%;z-index:1500;border:1px #fff solid;margin:0 auto;cursor:pointer; }
.bt_copy{ display:inline-block;background:#666;color:#f5f5f5;border-radius:3px;padding:3px 20px;font-size:85%;margin:0 auto;cursor:pointer; }
/*-------------------------------------------------------*/
.login_form{ width:400px;margin-top:20%; }
.login_form .form_item{ width:100%; }
.login_form .login_icon{ background:#fff;width:80px;height:80px;text-align:center;margin:0 auto;border-radius:400px; }
.login_form .login_icon i{ font-size:50px;color:#666; }
.cookie_wrap{ display:flex;justify-content:right;gap:10px; }
.cookie_wrap .label{ line-height:170%; }
/*-------------------------------------------------------*/
.cc_toggle{ position:relative;display:inline-block;width:50px;height:28px; }
.cc_toggle input{ display:none; }
.cc_toggle .slider{ position:absolute;top:0;left:0;right:0;bottom:0;background-color:#ccc;border-radius:34px;transition:0.3s;cursor:pointer; }
.cc_toggle .slider::before { content:"";position:absolute;width:22px;height:22px;left:3px;bottom:3px;background-color:white;border-radius:50%;transition:0.3s;box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);}
.cc_toggle input:checked + .slider { background-color:#4cd964; }
.cc_toggle input:checked + .slider::before { transform:translateX(22px); }
/*-------------------------------------------------------*/
@media (max-width:640px){
    body{ font-size:14px; }
    .box{ border:none;padding:15px; }
    .info_box .thumbs .img{ width:calc(20% - 4px); }
    .expart_row{ align-items:center; }
    .expart_row.detail .icon{ width:100%; }
    .expart_row.detail .icon .image{ width:80px;margin:0 auto; }
    .expart_row.detail .info{ width:100%; }
    .sp_justify{ text-align:justify;white-space:nowrap; }
}