@charset "utf-8";

#boxMain {
  padding-bottom:50px;
}
#boxMain h1 {
  height:150px;
  text-align:center;
  background:#ccc url("../common/img/bg_page_title.jpg") no-repeat center center;
}
#boxMain h1 img {
  padding:35px 0;
}
#boxMain h2 {
  margin:0 0 24px 0;
  padding:12px 24px;
  color:#fff;
  font-size:28px;
  line-height:30px;
  background-color:#0085B2;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}

ul.sideMenu {
  margin:30px 0;
  padding:15px;
  list-style:none;
  background:#333;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}
ul.sideMenu li {
  float:left;
  list-style:none;
  border-right:1px solid #666;
}
ul.sideMenu li:last-child {
  border-right:none;
}
ul.sideMenu li.menuTitle {
  padding:5px 12px;
  font-size:15px;
  font-weight:bold;
  color:#fff;
  background:#f90;
}
ul.sideMenu li a {
  display:block;
  padding:5px 12px;
  font-size:13px;
  color:#fff;
  text-decoration:none;
  background:#000;
}
ul.sideMenu li a:hover {
  background:#0085B2;
}
ul.sideMenu li a#on {
  background:#0085B2;
}


#boxTopics {
  padding-bottom:50px;
}
#boxTopics ul {
  list-style:none;
  font-size:14px;
  line-height:20px;
}
#boxTopics ul li {
  float:left;
  margin:6px;
  width:350px;
  height:20.5em;
  overflow:hidden;
  list-style:none;
  border:1px solid #f0f0f0;
  border-top:3px solid #0085B2;
  background-color:#fff;
  cursor:pointer;
}
#boxTopics ul li:hover {
  border:1px solid #fc9;
  border-top:3px solid #f90;
  background-color:#fffff0;
  overflow-y:scroll;
}
#boxTopics ul li h3 {
  padding:12px 12px 6px 12px;
  color:#00A3D8;
}
#boxTopics ul li p {
  padding:0 12px 12px 12px;
  color:#333;
}
#boxTopics ul li p img {
  padding:12px 0;
}

.selectMenu {
  display:none;
}


/* ------------------------------------------------------------ */
/*   For SmartPhones                                            */
/* ------------------------------------------------------------ */
@media print, screen and (max-width: 640px) {

#boxMain h1 {
  height:100px;
  background-size:cover;
}
#boxMain h1 img {
  padding:20px 0;
  height:60px;
  width:auto;
}
#boxMain h2 {
  font-size:20px;
}

#boxTopics ul {
  padding:10px;
}
#boxTopics ul li {
  float:none;
  margin:0 0 2px 0;
  width:100%;
  height:auto;
  overflow:normal;
}
#boxTopics ul li:hover {
  overflow-y:auto;
}

.naviTopics a {
  float:none;
  padding:20px;
  font-size:15px;
  text-align:center;
}

#main_one {
  padding:0px 10px 0 10px;
}


.selectMenu {
  display:block;
  padding:20px 0;
}
.selectMenu select {
  padding:9px;
  width:100%;
  color:#fff;
  font-size:16px;
  text-align:center;
  -webkit-appearance:none;
  background:#000;
}
.selectMenu select option {
}



}
