@charset "utf-8";


.tab5 { margin:40px 20px 48px 0; display: flex; border-top:2px solid #111; }
.tab5 li { flex:1 1 20%; border:1px solid #111; border-left:none; }
.tab5 li:first-child { border-left:1px solid #111; }
.tab5 li a { color:#111; display: flex; align-items: center; justify-content: center; font-size:16px; height:52px;  text-align:center; }
.tab5 li a.on { background:#111; color:#fff;  }
.total { font-size:14px; color:#111; padding:0 0 14px }

.boardWrap { padding-bottom:60px; }
.bWd15 { width:15%; }
.bWd60 { width:60%; }
.bWd35 { width:35%; }

/* board list */
.boardListTable thead th { font-size:14px; color:#111; text-align: center; border-top:1px solid #111; border-bottom:1px solid #d4d4d4; padding:15px 0; }
.boardListTable tbody td { font-size:13px; color:#666; text-align: center; border-bottom:1px solid #d4d4d4; padding:15px 0;}
.boardListTable tbody td.subject { text-align:left; }
.boardListTable tbody td.left { text-align:left;}

/* board view */
.boardViewTable thead th {
    font-size:14px; color:#111; text-align:left;
    border-bottom:1px solid #d4d4d4; padding:15px 30px;
}
.boardViewTable thead th.subject { border-top:1px solid #111; }
.boardViewTable thead th.th_title { background:#f7f7f7; }
.boardViewTable thead td { padding:15px 30px; border-bottom:1px solid #d4d4d4;}
.boardViewTable tbody td.boardContent {
    font-size:14px; color:#666;
    border-bottom:1px solid #111; padding:30px 30px;
    line-height: 1.7;
	word-break: break-all;
}
.boardViewTable tbody td.boardContent p { padding:1px 0; }
.boardViewTable tbody td.boardContent p a { text-decoration: underline; }
.bv-pt12 { padding-top:12px; }

/* board write */
.boardWriteDiv { padding:40px 0; border-top:1px solid #111; border-bottom:1px solid #111; }
.boardWriteDiv > div { display:flex; padding:10px 0; }
.boardWriteDiv > div label { flex:0 0 130px; padding-left:40px; font-size:14px; font-weight:500; color:#111; display: flex; align-items: center; }
.boardWriteDiv > div input { flex:0 0 250px; font-size:12px; color:#666; }
.boardWriteDiv > div input.wid-full { flex:0 0 80%; }
.boardWriteDiv > div textarea.texta2 { flex:0 0 80%; height:400px; }
.boardWriteDiv > div.content label { align-items: flex-start; }

.boardWriteDiv > div.fileFlex { width: 100%; }
.boardWriteDiv > div.fileFlex input { flex: 0 0 70%; }
.boardWriteDiv > div.fileFlex button { flex: 0 0 calc(10% - 10px) ; margin-left:10px; }
.pt25 { padding-top:25px; }

.boardProList { position:relative; flex-wrap: wrap; display: flex; padding:30px 0; }
.boardProList::before { content:""; width: calc(100% - 20px); position: absolute; left: 0; top: 0; background:#111; height:1px; }
.boardProList li{ flex: 0 0 calc(33.3333% - 20px); margin-right:20px;}
.boardProList li a { display: block; padding-bottom:30px; }
.boardProList li a img { width:100%;}
.boardProList li a div em { font-weight:500; font-size:17px; display: block; padding: 18px 0 5px; line-height: 1.5; }
.boardProList li a div i { display: block; font-style: normal; font-size: 13px; color: #666; }

.comList { display: flex; position: relative; flex-wrap: wrap; padding:10px 0 0; }
.comList li{ flex: 0 0 calc(25% - 20px); margin-right:20px;}
.comList li a { display: block; padding-bottom:40px; }
.comList li a img { width:100%;}
.comList li a strong { color:#666; font-weight:400; font-size:13px; display: block; padding: 12px 0; line-height: 1.2; text-align: center; }

.myPageArea > ul { margin-right:20px; }

@media only screen and (max-width:1150px){
    .myPageArea > ul { margin-right:0; }
    .comList { display: flex; position: relative; flex-wrap: wrap; padding:10px 0 0; }
    .comList li{ flex: 0 1 50%; width:50%; padding-right:10px; margin-left:0; margin-right:0; }
    .comList li:nth-child(2n){ padding-left:10px; padding-right:0;}
    .comList li a { display: block; padding-bottom:40px; }
    .comList li a img { width:100%;}
    .comList li a strong { color:#666; font-weight:400; font-size:13px; display: block; padding: 12px 0; line-height: 1.2; text-align: center; }
    .tab5 li a { font-size:14px; height:52px; }

    .boardListTable thead th { font-size:12px; padding:15px 0; }
    .boardListTable tbody td { font-size:12px; padding:15px 0;}

    .boardViewTable tbody td.boardContent img { width:100%;}
    .boardViewTable thead th { font-size:12px; padding:15px 10px; }
    .boardViewTable thead td { padding:15px 10px; font-size:12px; }

    .boardWriteDiv { padding:40px 0; border-top:1px solid #111; border-bottom:1px solid #111; }
    .boardWriteDiv > div { display:flex; padding:10px 0; }
    .boardWriteDiv > div label { flex:0 0 80px; padding-left:0; font-size:12px; font-weight:500; color:#111; display: flex; align-items: center; }
    .boardWriteDiv > div label:nth-of-type(2) { margin-left:10px;}
    .boardWriteDiv > div input { flex:1 1 120px !important; width:120px !important; font-size:12px; color:#666; }
    .boardWriteDiv > div textarea.texta2 { flex:1 1 100%; height:300px; }
    .boardWriteDiv > div.fileFlex button { flex: 0 0 calc(20% - 10px) ; margin-left:10px; font-size:12px; }

    .boardProList { position:relative; flex-wrap: wrap; display: flex; padding:30px 0; }
    .boardProList::before { content:""; width: calc(100%); position: absolute; left: 0; top: 0; background:#111; height:1px; }
    .boardProList li{ flex: 0 0 calc(50%); padding-right:10px; margin-left:0; margin-right:0;}
    .boardProList li:nth-child(2n) { padding-right:0; padding-left:10px;}
    .boardProList li a { display: block; padding-bottom:30px; }
    .boardProList li a img { width:100%;}
    .boardProList li a div em { font-weight:500; font-size:17px; display: block; padding: 18px 0 5px; line-height: 1.5; }
    .boardProList li a div i { display: block; font-style: normal; font-size: 13px; color: #666; }

}