@charset "utf-8";

@import url("../sub-common.css");

/* page sub menu */
.sub-menu ul li { width: 25%;}

@media all and (max-width: 768px) {
	.sub-menu ul li { width: 50%; float: left; }
}

.banner-wrap { position: relative; width: 100%; height: 320px; background: url(../../../img/sub/community/main_visual.png) no-repeat center 100%; padding-top: 90px; overflow: hidden;background-size: cover;}
.file-cursor { cursor: pointer;}

/* title-area */

.title-area {border-top:2px solid #333; border-bottom: 1px solid #e5e5e5; padding:15px 0;}
.title-area h3 {font-size:2.3rem; color:#555; padding-bottom: 10px;}
.title-area ul li{display: inline-block; padding:5px 25px 5px 0; font-size:1.4rem; color:#777; position: relative}
.title-area ul li:not(:last-child):after {content: ''; width:1px; height:13px; background-color:#d4d4d4; position: absolute; top:10px; right:11px;}

.title-area h3 span {background-color: #8e93ff; color:white; font-size:1.1rem; padding:2px 10px; border-radius: 3px; margin-right:7px; position: relative; top:-5px}
/* file-area */

.file-area {border-bottom: 1px solid #e5e5e5; padding-bottom: 15px; padding-top:15px;}
.file-area img{width:15px; margin-right:5px; position: relative; top:2px}

/* text-area */

.text-area {padding:25px 0; font-size: 1.6rem; line-height: 1.8; color:#666; border-bottom: 1px solid #333;}

/* board-controls */

.board-controls {font-size: 1.4rem;}
.board-controls ul li {padding:15px 0; border-bottom: 1px solid #e5e5e5;}
.board-controls ul li > div {float:left}
.board-controls ul li .left {font-weight: 600;}
.board-controls ul li i {font-size:0.75rem; margin-left:5px}

.board-controls ul li .right {padding-left:15px}
.board-controls ul li .right:hover {text-decoration: underline;}
.board-controls ul li .right a {text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display: block}

@media (max-width: 768px) {
	.title-area h3 {font-size:1.8rem}
	.title-area ul li {font-size:1.3rem}
	.file-area {font-size:1.3rem}
	.file-area img {width:12px;}
	.text-area {font-size:1.3rem; width:100%}
	.board-controls {font-size: 1.3rem;}
	.title-area ul li:not(:last-child):after {content: ''; height:12px}
	.title-area h3 span {top:-2px}
}