@charset "UTF-8";

/* Mystyle and protfolio */
#portfolio-menu{ width:890px; height:auto; margin:0 0; text-align:center; background: transparent url(/mystyle/img/cg08.gif) no-repeat scroll left top; }

.ms-wrapper .ms-pckup{ width:145px; height:180px; margin:0 4px 0 0; height:auto; float:left; overflow:hidden; display:block; }
.ms-wrapper .ms-pckup-end{ width:145px; height:180px; margin:0 0; height:auto; float:left; overflow:hidden; display:block; }

.ms { padding:0; margin:0; height:100%;}
.ms li { width:149px; height:192px; margin:0;float:left;list-style:none; background: url(/mystyle/img/cg02.gif) no-repeat left bottom}
.ms li img { vertical-align:top}
.ms .ms-end {width:145px; height:192px; margin:0 0;float:left; overflow:hidden; display:block; }

.ms-cmt { padding:0 0 0 7px; margin:20px 42px 30px 42px; border-left: solid 3px #ccc; font-size:92%}
.ms-cmt dt{ padding:2px 0; margin:0; font-weight:bold}
.ms-cmt dd{ padding:2px 0; margin:0 }

.pf-section{ width:850px; height:auto; margin:20px 10px 0 30px; }
.pf-section .pf-cell{ width:212px; height:105px; margin:0 0 10px 0; float:left; overflow:hidden; display:block; }
.pf-section .pf-cell .ig{ width:115px; height:105px; float:left; overflow:hidden; display:block; }
.pf-section .pf-cell .ig img{ width:102px; height:95px; border:3px solid #c0c0c0; }
.pf-section .pf-cell .cm{ width:97px; height:105px; float:right; overflow:hidden; display:block; }
.pf-section .pf-cell .cm p{ padding:2px 6px 0 0; font-size:85%; color:#2f2f2f; line-height:1.4em; }

/* Portfolio */
.portfolio-oview { display:inline-block; border:solid 1px #c7c7c7;}
.portfolio-cmt h5{ font-weight:bold; text-align:right; font-size:92%; color:#808080; margin:10px 0 10px 0; }
.portfolio-cmt h3{ font-weight:bold; font-size:122%; color:#404040; line-height:1.5em; margin:30px 0 10px 20px; }
.portfolio-cmt p{ font-size:100%; color:#404040; line-height:1.5em; margin:20px 0 0 20px; }

.portfolio-dc{ width:272px; height:auto; float:left; overflow:hidden; display:block; }
.portfolio-dc .ig{ width:272px; height:182px; background-color:#c7c7c7; overflow:hidden; }
.portfolio-dc .ig img{ width:270px; height:180px; margin:1px 1px; }
.portfolio-dc .cmt{ margin:3px 0 15px 0; border-left:3px solid #38b5ab; }
.portfolio-dc .cmt p{ padding:3px 0 3px 5px; font-size:85%; color:#404040; line-height:1.3em; }

/* mystyle content */

.ta{ background: transparent url(/mystyle/img/ta.gif) no-repeat scroll left top; color:#3a3a3a; padding:4px 4px 0 27px; }
.tr{ background: transparent url(/mystyle/img/tr.gif) no-repeat scroll left top; color:#3a3a3a; padding:27px 4px 0 4px; }
.yo { background: transparent url(/mystyle/img/yo.gif) no-repeat scroll left top; color:#3a3a3a; padding:4px 4px 0 27px; }

.ms-staff-wrapper{ width:400px; height:auto; margin:15px 25px 0 30px; }
.ms-staff-wrapper .ph{ width:81px; height:auto; height:auto; float:left; overflow:hidden; display:block; }
.ms-staff-wrapper .ph p{ margin:4px 0 0 0; font-size:85%; font-weight:bold; color:#3a3a3a; line-height:1.5em; }
.ms-staff-wrapper .ct{ width:319px; height:auto; height:auto; float:right; overflow:hidden; display:block; }
.ms-staff-wrapper .ct p{ margin:0 0 10px 7px; font-size:85%; color:#3a3a3a; }

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}


/* Recommend */
#recommend-area {
	border:solid 1px #ccc; background:#eee url(/mystyle/img/rec-bg.gif) repeat-x 0 0;
	margin:0 10px;
	height:auto;
}
#recommend-area h2 { width:200px; float:left; text-align:center}
#recommend-area ul { padding:0; margin:0}
#recommend-area ul li { padding:5px 0; margin:0; list-style:none; width:220px; float:left; font-size:85%;}
#recommend-area ul li img { border:solid 2px #ccc; float:left; margin:0 5px 5px 0}
#recommend-area ul li a { text-decoration:none}
#recommend-area ul li a:hover img {border: solid 2px #cc6666;}

#recommend-area ul li p{ padding:0 30px 0 0; color:#666}