@charset "utf-8";

/**/
.tit-wrap{position:relative; width:100%; border-bottom:2px solid #000}

/* coding list */
.page-codinglist{padding:0}
.page-codinglist .h1 .ver{font-size:12px; display:inline-block; margin-left:10px; font-weight:500; background:#222; color:#fff; padding:0 2px; border-radius:4px}
.page-codinglist .h1 .ver-date{font-size:12px; display:inline-block; margin-left:10px; color:#000; font-weight:500;}
    
/* table */
.type-discription col.n1{width:150px}
.type-discription col.n2{width:auto}
.tbl-base.type-discription td,
.tbl-base.type-option td{text-align:left}
.tbl-base.type-discription th,
.tbl-base.type-option th{text-align:center}
.type-option{table-layout:auto !important}
.type-option .nec,
.type-option .nec th,
.type-option .nec td{background:#fdfdfd}
.type-option .bou th,
.type-option .bou td{border-bottom:1px solid #000}
.type-option .un,
.type-option .un th,
.type-option .un td{opacity:0.7}

/* box */
.box-code{width:100%; margin:10px 0; padding:0 20px 4px; background:#fcfcfc; border:1px solid #969696}
.box-code pre{padding:0; margin:-5px 0 0; overflow:auto}
.box-code code{font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; color:#272727; line-height:1.5}
.box-code .si{color:#a00}
.box-code .nc{color:#0a8}
.box-code .nt{color:#2f6f9f}
.box-code .na{color:#4f9fcf}
.box-code .s{color:#d44950}
.box-code .c{color:#999}

.box-iconguide{width:auto; margin:10px 0; padding:20px; background:#b1b1b1; border:1px solid #969696}
.list-guideimg{overflow:hidden; width:100%;}
.list-guideimg li{float:left; margin:5px; overflow:hidden;}

/* ui codinglist */
.ui-codinglist{width:100%; margin:0 0 50px}
.ui-codinglist table{width:100%;}
.ui-codinglist thead th{background:#3a3a3a; color:rgb(241, 241, 241); border:1px solid #222; padding:4px 10px; font-size:10px; letter-spacing:1px;}
.ui-codinglist th,
.ui-codinglist td{border:1px solid #e4e4e4; padding:2px 5px; text-align:left; font-weight:400; font-size:12px;}
.ui-codinglist col{width:auto;}
.ui-codinglist col.col1{width:55px;}
.ui-codinglist col.col2,
.ui-codinglist col.col3,
.ui-codinglist col.col4{width:60px;}
.ui-codinglist col.col5{width:40px;}
.ui-codinglist col.col8{background:#f2f2f2;}
.ui-codinglist col.col8.n1{width:50px;}
.ui-codinglist thead th:nth-child(1),
.ui-codinglist thead th:nth-child(2),
.ui-codinglist thead th:nth-child(3),
.ui-codinglist thead th:nth-child(4),
.ui-codinglist thead th:nth-child(5), 
.ui-codinglist .state,
.ui-codinglist .date,
.ui-codinglist .enddate,
.ui-codinglist .name,
.ui-codinglist .img{text-align:center; word-break:keep-all;}
.ui-codinglist .d{color:#ccc;}
.ui-codinglist .end .d{color:#e48dad;}
.ui-codinglist .c1 .d1,
.ui-codinglist .c2 .d2,
.ui-codinglist .c3 .d3,
.ui-codinglist .c4 .d4,
.ui-codinglist .c5 .d5,
.ui-codinglist .c6 .d6,
.ui-codinglist .c7 .d7,
.ui-codinglist .c8 .d8{color:#000;}
.ui-codinglist .hidden span{display:none;}
.ui-codinglist .hidden{border:0 !important; display:none;}
.ui-codinglist .ing{background:#c3f1ff;}
.ui-codinglist .ing td{border-bottom:1px solid #b9dff3;}
.ui-codinglist .tst{background:#fff9da;}
.ui-codinglist .tst td{border:1px solid #fdea86;}
.ui-codinglist .chk{background:#e5daff;}
.ui-codinglist .chk td{border:1px solid #c7b8ff;}
.ui-codinglist .trm{background:#f9d5e2;}
.ui-codinglist .end{background:#ffbdd5;}
.ui-codinglist .end td{border:1px solid #f1a3c0;}
.ui-codinglist .end a,
.ui-codinglist .end button{color:#fe0980 !important;}
.ui-codinglist td button{text-decoration:none; letter-spacing:-1px; font-size:12px; }
.ui-codinglist td a{text-decoration:none; letter-spacing:-1px; font-size:12px}
.ui-codinglist .del span{opacity:0.1;}
.ui-codinglist .del{background:#f7f7f7;}
.ui-codinglist .overlap{color:#ccc !important;} 
.ui-codinglist .overlap span{font-size:12px; opacity:0.5;}
.ui-codinglist .img img{width:20px;}
.ui-codinglist-sel{display:none}
.ui-codinglist-info{margin:10px 0; padding:0 1.0rem}
.ui-codinglist-info li{display:inline-block; padding:5px}
.ui-codinglist-sel a,
.ui-codinglist-sel button,
.ui-codinglist-sel select{margin:0 5px 5px 0; padding:0 20px 0 0}
.ui-codinglist .overl{display:block; opacity:0.5; letter-spacing:-1px}
.ui-codinglist tr:hover{outline:1px dashed red}
    .ui-m .ui-codinglist thead,
    .ui-m .ui-codinglist-sel .btn-base,
    .ui-m .ui-codinglist-info{display:none}
    .ui-m .ui-codinglist tr{display:block; width:100%; border-bottom:1px solid #d8d8d8; overflow:hidden; padding:5px; box-sizing:border-box; margin:0}
    .ui-m .ui-codinglist .end{border-color:#f1a3c0;}
    .ui-m .ui-codinglist .ing{border-color:#52b2e9;}
    .ui-m .ui-codinglist td{display:none; float:left; border:0; padding:3px;}
    .ui-m .ui-codinglist .id{display:block; margin-left:0; clear:both;}
    .ui-m .ui-codinglist .d{display:block; color:#222; padding:0; font-size:10px}

    .ui-m .ui-codinglist td.id{width:100%;}
    .ui-m .ui-codinglist td.id span{display:inline-block; margin-right:10px; }
    .ui-m .ui-codinglist td.id button,
    .ui-m .ui-codinglist td.id a{font-size:14px}
    .ui-m .ui-codinglist td.id button:before{content:"P"; display:inline-block; width:10px; height:10px; font-size:9px; vertical-align:super; border:1px solid #52b2e9; background:skyblue; color:#fff}
    
    .ui-m .ui-codinglist .d.d1 span:before{display:none}
    .ui-m .ui-codinglist .d span:before{content:"→"; display:inline-block; margin:0 0.2rem; color:#555}
    .ui-m .ui-codinglist .hidden span{display:none;}
    .ui-m .ui-codinglist .hidden{border:0 !important; display:none;}


.list-define{font-size:1.6rem}
.list-define dt{margin-bottom:5px}
.list-define dd{color:#555; }
.list-define span{display:block; margin-bottom:5px}
.h3{margin:20px 0 0}

.sample-tab{width:100%; overflow-x:scroll;overflow-y:hidden}
.sample-tab div{width:2100px; overflow:hidden;}
.sample-tab button{width:300px; float:left; border:1px solid #ccc; height:100px}

.guide-color-line,
.guide-color-txt,
.guide-color-bg{display:flex; flex-wrap:wrap}
.guide-color-txt li,
.guide-color-line li,
.guide-color-bg li{flex:0 80px; min-width:80px; display:flex; margin:5px; align-items:center; text-align:center; width:80px; height:80px; border-radius:50%; vertical-align:middle;}
.guide-color-txt li span,
.guide-color-line li span,
.guide-color-bg li span{flex:0 100%; display:inline-block; width:100%; text-align:center; height:auto}
.guide-color-bg li{color:#fff}
.guide-color-txt li{font-size:1.6rem; font-weight:500}
.guide-color-txt li{border:1px dashed #ccc}

#stickySearch.ui-fixed-top .wrap-form-item{background:#fff; padding:1.5rem 1.5rem 0}
#stickySearch.ui-fixed-top .ui-floating-wrap{box-shadow: 0 0 10px rgba(0,0,0, 0.2)}
#srchCode{border:0}