@charset "utf-8";


#menu-area #search label {
	display:none;
}

/* *****************************************************************************
   PC用のスタイル記述
***************************************************************************** */
@media screen and (min-width: 770px), print {
	
/* -----------------------------------------------------------------------------
 Menu
----------------------------------------------------------------------------- */
#bt-menu {
	display:none;
}

#menu-area .subt {
	display:none;
}

#menu-area #search {
	position:absolute;
	top:15px;
	right:0;
	width:250px;
	height:29px;
}

#menu-area #search .keyword {
	font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", Arial, Helvetica, sans-serif;
	width:200px;
	height:27px;
	padding:0 38px 0 10px;
	border:1px solid #34485d;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	float:left;
}

#menu-area #search .bt {
	position:absolute;
	top:0;
	right:0;
	width:28px;
	height:29px;
	background:url(../../img/bt_search.png) no-repeat;
	background-size:28px 29px;
	border:none;
	float:left;
	
	display: block;
	padding: 0;
	border: none;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	outline: none;
}


/* Sub */
#menu-area .sub,
#menu-area .sub2 {
	display:none;
}

#menu-area .main {
	position:absolute;
	top:90px;
	font-size:1.15em;
	font-weight:bold;
	width:auto;
	height:50px;
	background-color:#647383;
	border:2px solid #647383;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	overflow:hidden;
	float:none;
	clear:both;
}


/* Main */
#menu-area .main li {
	line-height:1.2em;
	border-right:1px solid #647383;
	float:left;
}
#menu-area .main li:last-child {
	border-right:none;
}

#menu-area .main li.activity,
#menu-area .main li.activity a {
	width:104px;
}
#menu-area .main li.award,
#menu-area .main li.award a {
	width:106px;
}
#menu-area .main li.ud_certification,
#menu-area .main li.ud_certification a {
	width:91px;
}
#menu-area .main li.dm,
#menu-area .main li.dm a {
	width:160px;
}
#menu-area .main li.conference,
#menu-area .main li.conference a {
	width:123px;
}
#menu-area .main li.network,
#menu-area .main li.network a {
	width:127px;
}
#menu-area .main li.ud_info,
#menu-area .main li.ud_info a {
	width:123px;
}
#menu-area .main li.member_report,
#menu-area .main li.member_report a {
	width:115px;
}

#menu-area .main li a {
	color:#34485d;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height:50px;
	padding-top:3px;
	background-color:#fff;
	text-decoration:none;
	text-align:center;
	vertical-align:middle;
	display:table-cell;
}

#menu-area .main li a:hover {
	background-color:#ff9900;
	text-decoration:none;
}

#menu-area .main li a.active {
	color:#fff;
	background-color:#647383;
	text-decoration:none;
}

#menu-area .main li a span {
	display:block;
}

#menu-area .main li .child {
	display:none;
}












}


/* *****************************************************************************
   スマートフォン用のスタイル記述
***************************************************************************** */
@media screen and (max-width: 770px) {

/* Menu Button */
#bt-menu {
  position:absolute;
	top:0;
	right:0;
  width:55px;
  height:55px;
  display:block;
	z-index:9999;
}

#menu-btn {
	color:#34485d;
  width:55px;
  height:50px;
  display:block;
}

#menu-btn.open {
	color:#fff;
}

#menu-btn-icon {
  display:block;
  position:absolute;
  top:34%;
  left:50%;
  width:16px;
  height:2px;
  margin:-1px 0 0 -7px;
  background:#34485d;
  transition:.2s;
}

#menu-btn-icon:before, #menu-btn-icon:after {
  display:block;
  content:"";
  position:absolute;
  top:34%;
  left:0;
  width:16px;
  height:2px;
  background:#34485d;
  transition:.3s;
}

#menu-btn-icon:before {
  margin-top:-34%;
}

#menu-btn-icon:after {
  margin-top:26%;
}

#menu-btn .close {
  background:transparent;
}

#menu-btn .close:before, #menu-btn .close:after {
  margin-top:0;
  background:#fff;
}

#menu-btn .close:before {
  transform:rotate(-45deg);
  -webkit-transform:rotate(-45deg);
}

#menu-btn .close:after {
  transform:rotate(-135deg);
  -webkit-transform:rotate(-135deg);
}

#menu-btn-txt {
  position:absolute;
	left:0;
	bottom:7px;
	font-size:0.71em;
	width:100%;
	text-align:center;
}

#menu-btn.open #menu-btn-txt {
	bottom:10px;
}


/* -----------------------------------------------------------------------------
 Menu
----------------------------------------------------------------------------- */
#menu-area {
	position:absolute;
	left:0;
	color:#fff;
	width:100%;
	background-color:#34485d;
	z-index:8888;
	display:none;
}

#menu-area .subt {
	font-size:0.85em;
	padding:20px 0 18px;
	line-height:1em;
}

#menu-area #search {
	position:relative;
	width:auto;
	height:37px;
	padding:8px 0 0;
	background-color:#b3bac2;
	display:block;
}

#menu-area #search .search-box {
	margin:0 30px;
}

#menu-area #search .keyword {
	font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", Arial, Helvetica, sans-serif;
	width:100%;
	height:29px;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding:0 38px 0 10px;
	border:1px solid #34485d;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}

#menu-area #search .bt {
	position:absolute;
	top:8px;
	right:30px;
	width:28px;
	height:29px;
	background:url(../../img/bt_search.png) no-repeat;
	background-size:28px 29px;
	border:none;
	float:left;
	
	display: block;
	padding: 0;
	border: none;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	outline: none;}


/* Sub */
#menu-area .sub li {
	position:relative;
	font-size:1.05em;
	text-align:left;
	line-height:1.2em;
}

#menu-area .sub li.home,
#menu-area .sub li.contact {
	width:50%;
	float:left;
}

#menu-area .sub li.about {
	width:100%;
	border-top:1px solid #001a33;
	float:none;
	clear:both;
}

#menu-area .sub li a {
	color:#fff;
	min-height:15px;
	padding:13px 20px 11px 47px;
	background-size:23px 23px !important;
	text-decoration:none;
	display:block;
}

#menu-area .sub li.home a {
	background:url(../../img/ico_home.png) 20px center no-repeat;
	border-right:1px solid #001a33;
}
#menu-area .sub li.contact a {
	background:url(../../img/ico_contact.png) 20px center no-repeat;
}

#menu-area .sub li.about a {
	background:url(../../img/ico_contact.png) 20px center no-repeat;
}

#menu-area .sub li .child {
	border-top:10px solid #001a33;
	border-bottom:10px solid #001a33;
	background-color:#001a33;
	display:none;
}

#menu-area .sub li ul li {
	border-top:none;
}

#menu-area .sub li .tit a {
	color:#fff;
	min-height:15px;
	padding:10px 20px 8px 50px;
	background:url(../../img/ico_menu_tit.png) 20px center no-repeat;
	background-size:23px 23px !important;
	text-decoration:none;
	display:block;
}

#menu-area .sub li .st {
	color:#fff;
	padding:9px 20px 0px 20px;
	text-decoration:none;
	display:block;
}

#menu-area .sub li ul li a {
	color:#fff !important;
	min-height:11px !important;
	padding:9px 20px 7px 47px !important;
	background:url(../../img/ico_menu_list.png) 20px center no-repeat !important;
	background-size:23px 23px !important;
	text-decoration:none !important;
	display:block !important;
}


/* Main */
#menu-area .main {
	font-size:1.05em;
	width:auto;
	text-align:left;
	border-top:3px solid #001a33;
	float:none;
	clear:both;
}

#menu-area .main li {
	position:relative;
	border-top:1px solid #001a33;
	line-height:1.2em;
}
#menu-area .main li:last-child {
	border-right:none;
}

#menu-area .main li a {
	color:#fff;
	min-height:15px;
	padding:13px 20px 11px 20px;
	background-size:23px 23px !important;
	text-decoration:none;
	display:block;
}

#menu-area .main li .child {
	border-top:10px solid #001a33;
	border-bottom:10px solid #001a33;
	background-color:#001a33;
	display:none;
}


#menu-area .main li ul li {
	border-top:none;
}

#menu-area .main li .tit a {
	color:#fff;
	min-height:15px;
	padding:10px 20px 8px 50px;
	background:url(../../img/ico_menu_tit.png) 20px center no-repeat;
	background-size:23px 23px !important;
	text-decoration:none;
	display:block;
}

#menu-area .main li .st {
	color:#fff;
	padding:9px 20px 0px 20px;
	text-decoration:none;
	display:block;
}

#menu-area .main li ul li a {
	color:#fff;
	min-height:11px;
	padding:9px 20px 7px 47px;
	background:url(../../img/ico_menu_list.png) 20px center no-repeat;
	background-size:23px 23px !important;
	text-decoration:none;
	display:block;
}

#menu-area .main li ul.ind {
	padding-left:20px;

}


.c-open-btn {
  position:absolute;
	top:13px;
	right:10px;
  width:23px;
  height:23px;
  display:block;
	z-index:9999;
}

.c-open-btn.open {
	color:#fff;
}

.c-open-btn-icon {
  display:block;
  position:absolute;
  top:34%;
  left:50%;
  width:12px;
  height:2px;
  margin:-1px 0 0 -7px;
  background:#fff;
  transition:.2s;
}

.c-open-btn-icon:before {
  display:block;
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:12px;
  height:2px;
  background:#fff;
  transition:.3s;
	transform:rotate(-90deg);
  -webkit-transform:rotate(-90deg);
}

.c-open-btn-icon:before {
  margin-top:0px;
}

.c-open-btn-icon:after {
  margin-top:5px;
}

.c-open-btn .close {
  background:transparent;
}

.c-open-btn .close:before {
  margin-top:0;
  background:#fff;
}

.c-open-btn .close:before {
  transform:rotate(0deg);
  -webkit-transform:rotate(0deg);
}


/* Sub2 */
#menu-area .sub2 {
	padding:6px 0;
	border-top:1px solid #001a33;
}

#menu-area .sub2 li {
	position:relative;
	font-size:1.05em;
	text-align:left;
	line-height:1.2em;
}

#menu-area .sub2 li.home,
#menu-area .sub2 li.contact {
	width:50%;
	float:left;
}
	
#menu-area .sub2 li.instagram,
#menu-area .sub2 li.linkedin {
	width:50%;
	padding: 10px 0 15px;
	float:left;
}
	
#menu-area .sub2 li.instagram {
	text-align:right;
}

#menu-area .sub2 li.about {
	width:100%;
	border-top:1px solid #001a33;
	float:none;
	clear:both;
}

#menu-area .sub2 li a {
	color:#fff;
	min-height:15px;
	padding:9px 20px 7px 47px;
	background-size:23px 23px !important;
	text-decoration:none;
	display:block;
}

#menu-area .sub2 li.policy a {
	background:url(../../img/ico_policy.png) 20px center no-repeat;
	border-right:1px solid #001a33;
}
#menu-area .sub2 li.sitemap a {
	background:url(../../img/ico_sitemap.png) 20px center no-repeat;
}

#menu-area .sub2 li.instagram a,
#menu-area .sub2 li.linkedin a {
	padding:9px 33px 7px 33px;
}
	
#menu-area .sub2 li.instagram a:hover img,
#menu-area .sub2 li.linkedin a:hover img {
	filter:alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
}










}

