@charset "utf-8";
/* CSS Document */


#devsumi {
	font: 15px/1.4 "Meiryo", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "MS P Gothic", "ＭＳ Ｐゴシック", Osaka, Helvetica, Arial, sans-serif;
	color:#333333;
}
.sns {
	background:#eee;
	padding:6px;
}
#devsumi .container {
	width:1000px;
	padding-right: 15px;
padding-left: 15px;
}
#devsumi .navbar.navbar-devsum.navbar-fixed-top .container {
	width: 1170px;
}
#devsumi .navbar.navbar-devsum.navbar-fixed-top .container .navbar-collapse.collapse .pull-right table {
	margin-top:28px;
}
#devsumi .navbar-devsum {
	background-color: #fff;
	border-bottom:1px solid #E7E7E7;
}
#devsumi .navbar-brand {
	height:auto;
}
#devsumi .navbar-nav > li > a {
	padding-top:28px;
	color:#666;
	padding-left:7px;
	padding-right:7px;
}
#devsumi .nav > li > a:hover, .nav > li > a:focus {
	text-decoration: none;
	background: #fff url(/static/images/conference/1/images/navi.png) no-repeat center bottom;
	color:#09C
}
#devsumi .nav > li.active > a, #devsumi .nav > li.active > a:hover, #devsumi .nav > li.active > a:focus {
	text-decoration: none;
	background: #fff url(/static/images/conference/1/images/navi.png) no-repeat center bottom;
	color:#0CC;
}
#devsumi .navbar-collapse {
	max-height:inherit;
}
#devsumi .navbar-toggle {
	background-color:#00A5BF;
}
#devsumi .navbar-toggle .icon-bar {
	background-color:#FFF;
}

#devsumi section {
	margin-bottom: 60px;
	overflow:hidden;
}
#devsumi p {
	margin-bottom: 1.4em;
	line-height: 1.7em;
}
#devsumi h2 {
  position: relative;
  text-align: center;
  border-bottom:none
}
#devsumi h2 span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  background-color: #fff;
  text-align: left;
}
#devsumi h2:before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #ccc;
}
#devsumi .bo_circle a {
	display: block;
	width: 300px;
	height: 300px;
	padding: 0px;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	text-decoration: none;
	background:#eee;
	line-height: 300px;
	margin-bottom: 20px;
}
#devsumi .bo_circle a:hover {
	width: 300px;
	height: 300px;
	line-height: 300px;
}
a:hover.circle1 {
	background-color:#3399CC;
}
a:hover.circle2 {
	background-color:#FF9900;
}
a:hover.circle3 {
	background-color:#E95A77;
}
a:hover.circle4 {
	background-color:#339900;
}
a:hover.circle5 {
	background-color:#B1986A;
}

#devsumi section ul {
	margin-bottom: 40px;
}
#devsumi section ul li {
	margin-bottom: 1.4em;
	line-height: 1.7em;
}
#devsumi section ul li:last-child {
	margin-bottom:0;
}

a:hover.blue {
	background-color:#3399CC;
}
a:hover.orange {
	background-color:#FF9900;
}
a:hover.green {
	background-color:#339900;
}
a:hover.brown {
	background-color:#B1986A;
}
a:hover.pink {
	background-color:#EE8296;
}
#devsumi .line {
    margin-bottom: 15px;
}
#devsumi .line:last-child {
    margin-bottom: 0;
}
#devsumi .balloon-left {
    position: relative;
    display: inline-block;
    margin: 1.5em 0 1.5em 15px;
    padding: 20px 20px;
    min-width: 120px;
    max-width: 100%;
    color: #555;
    font-size: 16px;
    background: #00A5BF;
    border-radius: 5px;
}
#devsumi .balloon-left:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -30px;
    margin-top: -15px;
    border: 15px solid transparent;
    border-right: 15px solid #00A5BF;
}
#devsumi .balloon-left p {
    margin: 0;
    padding: 0;
	color:#fff;
}

#devsumi .face{
  display: table-cell;
  vertical-align: middle;
  padding-right:10px;
  width:150px;
}
#devsumi .comment{
  display: table-cell;
  vertical-align: middle;
}

#devsumi .button {
margin: 10px;
padding: 30px;
text-align: center;
text-transform: uppercase;
transition: 0.5s;
background-size: 200% auto;
color: white;
text-shadow: 0px 0px 10px rgba(0,0,0,0.2);
box-shadow: 0 0 20px #eee;
border-radius: 60px;
    font-size: 30px;
display: block;
}
#devsumi .button:last-child {
    margin-bottom: 0;
}

#devsumi .button {background-image: linear-gradient(to right, #00A0C4 0%, #BCD65C 51%, #00A0C4 100%)}
#devsumi .button:hover { background-position: right center;     text-decoration: none;}

 @media screen and (max-width: 1024px) {
#devsumi .container {
	width:auto;
}
#devsumi .navbar.navbar-devsum.navbar-fixed-top .container {
	width:auto;
}
}
 @media screen and (max-width: 767px) {
#devsumi .navbar-brand {
	padding: 5px 5px 5px 15px;
}
#devsumi .navbar-nav > li > a {

	padding:15px ;
}
#devsumi .nav > li > a:hover, .nav > li > a:focus {
	text-decoration: none;
	background: #F4F4F4 url(none);
	color:#09C
}
#devsumi .nav > li.active > a, .nav > li.active > a:hover, .nav > li.active > a:focus {
	text-decoration: none;
	background: #F4F4F4 url(none);
	color:#0CC;
}
#devsumi .navbar.navbar-devsum.navbar-fixed-top .container .navbar-collapse.collapse .pull-right table {
	margin-top:10px;
}
#devsumi .bo_circle a  { margin-bottom:10px;
}

#devsumi h2 {
	font-size:20px;
}
#devsumi .balloon-left {
    position: relative;
    display: inline-block;
    padding: 7px 10px;
    min-width: 120px;
    max-width: 100%;
    color: #555;
    font-size: 16px;
    background: #00A5BF;
	margin:1.5em 0;
}
#devsumi .balloon-left:before {
    content: "";
    position: absolute;
    top: -30px;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-bottom: 15px solid #00A5BF;
    margin-top: 0;
}
#devsumi .face  {
	display:block;
	margin:auto;
}
#devsumi .comment {
	display:block;
}
#devsumi .button {
    line-height: 21px;
    font-size: 21px;
    padding: 15px;
}
}
