@charset "utf-8";


/* ------------------------------------------------------------ common */
header { background: #fff; }
header nav ul li:nth-child(5) a { border-bottom: solid 2px #000; }
#fv { background: url(../images/list/fv.jpg) no-repeat center center/cover; }

.empty { text-align: center; font-size: 16px; padding: 100px 0 0; }
.tag_list a { font-size: 12px; color: #a2a2a2; float: left; display: block; padding: 0 5px 5px 0; }

/* ------------------------------------------------------------ aside */

#aside { width: 200px; float: left; }
#aside .category { padding: 0 0 40px; }
#aside .category h3 { font-size: 19px; padding: 5px 0 5px 35px; background: url(../images/list/icn_category.gif) no-repeat left center; margin: 0 0 20px; }
#aside .category li { border-bottom: 1px solid #b4b4b4;  }
#aside .category li:first-child { border-top: 1px solid #b4b4b4; }
#aside .category li a { font-size: 14px; padding: 20px 0 20px 5px; display: block; background:url(../images/list/arrow_aside01.png) no-repeat 98% center; line-height: 160%; }
#aside .category ul li ul { border-top: 1px solid #b4b4b4; }
#aside .category ul li ul li { border: none; }
#aside .category ul li ul li:first-child { border: none; }
#aside .category ul li ul li a { display: block; width: 100%; padding: 20px 0 20px 35px; cursor: pointer; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }


#aside .navi { padding: 0 0 70px; }
#aside .navi li { padding: 0 0 0 25px; background: url(../images/list/arrow_aside02.png) no-repeat 5px center; margin: 0 0 15px; }
#aside .navi li a { font-size: 14px; }
#aside .bnr_area .bnr { padding: 0 0 25px; }
#aside .bnr_area .bnr img { width: 100%; }
#aside .bnr_area ul li { float: left; padding: 0 13px 0 0; }


#main { padding: 60px 0 0; }
#main #list { width: 810px; float: right; }
#main #list h3 { font-size: 29px; text-align: center; padding: 0 0 30px; }
#main #list h3 span { font-size: 14px; display: block; }
#main #list ul.list { margin: 0 0 0 -45px; padding: 0 0 55px; }
#main #list ul.list li { margin: 0 0 50px 45px; width: 240px; height: 410px; float: left; overflow: hidden; }
#main #list ul.list li:nth-child(3n+1) { clear: both; }
#main #list ul.list li a { display: block; margin: 0 0 15px;}
#main #list ul.list img { width: 100%; height: auto; }
#main #list ul.list li .detail { padding: 10px 0 0; }
#main #list ul.list li .detail small { font-size: 12px; color: #636363; height: 20px;}
#main #list ul.list li .detail h4 { font-size: 15px; margin: 5px auto 15px; max-height: 65px; overflow: hidden; line-height: 22px; }
#main #list ul.list li .detail p { text-align: right; font-size: 18px; padding: 0 0 5px; }



/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){

#fv { background: url(../images/list/fv.jpg) no-repeat center center; background-size: cover; }

.empty { text-align: center; font-size: 14px; padding: 30px 0 50px; }

/* ------------------------------------------------------------ aside */

#aside { width: 100%; float: none; padding: 0;}
#aside .category { padding: 0 0 40px; }
#aside .category h3 { font-size: 16px; padding: 0 0 0 35px; background: url(../images/list/icn_category.gif) no-repeat left center; margin: 0 0 20px; }
#aside .category li { border-bottom: 1px solid #b4b4b4; }
#aside .category li:first-child { border-top: 1px solid #b4b4b4; }
#aside .category li a { font-size: 14px; padding: 20px 0; display: block; line-height: 160%; }
#aside .navi { padding: 0 0 70px; }
#aside .navi li { padding: 0 0 0 25px; background: url(../images/list/arrow_aside02.png) no-repeat 5px center; margin: 0 0 15px; }
#aside .navi li a { font-size: 14px; }
#aside .bnr_area .bnr { padding: 0 0 25px; }
#aside .bnr_area .bnr img { width: 100%; height: auto;}
#aside .bnr_area ul li { float: left; padding: 0 13px 0 0; }


#main { padding: 30px 0 0; }
#main #list { width: 100%; float: none; }
#main #list h3 { font-size: 24px; text-align: center; padding: 0 0 10px; }
#main #list h3 span { font-size: 12px; display: block; }
#main #list ul.list { margin: 0 -2%; padding: 0 0 25px; }
#main #list ul.list li { margin: 0 0 30px; width: 46%; height: auto; padding: 0 2% 10px; }
#main #list ul.list li:nth-child(2n+1){ clear: both; }
#main #list ul.list li:nth-child(3n+1) { clear: none; }
#main #list ul.list li a { display: block; }
#main #list ul.list li img { width: 100%; height: auto;}
#main #list ul.list li .detail { padding: 10px 0 0; }
#main #list ul.list li .detail small { font-size: 12px; color: #636363; height: 20px;}
#main #list ul.list li .detail h4 { font-size: 14px; }
#main #list ul.list li .detail p { text-align: right; font-size: 14px; padding: 0 0 5px; }
#main #list ul.list li .detail span { font-size: 12px; color: #a2a2a2; }

}
