﻿@charset "UTF-8";

/*=======================
　ヘッダー
=======================*/

/*--ヘッダー（PC）--*/

#bg_title{
	position: relative;
	width: 100%;
	min-height: 150px;
	background: url(../img/ieaatatistics/bg_title.jpg) 50% 50% no-repeat;
	background-size: cover;
}

header h2{
	position: absolute;
	display: block;
	padding: 1% 1% 0;
	width: 20%;
	min-width: 150px;
	margin: 0 auto;
	background-color: #fff;
	text-align: center;
	font-weight: normal;
	font-size: 2.4rem;
	line-height: 100%;
	font-family: "Times","Times New Roman","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	left: 3px;
	right: 0;
	bottom: -2rem;
	
}

header h2 p{
	font-size:0.8rem;
}

/*--ヘッダー（SP・TB）--*/

@media only screen and (max-width:767px){
	#bg_title{
		min-height:100px;
	}
	
	header h2{
		font-size:2rem;
	}

}

/*=======================
　コンテンツ
=======================*/

#contents{
	margin-top:15rem;
}

@media (max-width: 63em) {
	#contents{
		margin-top:0;
	}
}

/*--サブメニュー--*/

#navigation{
  position: relative;
  margin:5rem 0;
  text-align:center;
}

#navigation li{
	display:inline-block;
	margin:0 1rem;
}

#navigation li a{
	color:#000;
	text-decoration:none;
}

#slide-line{
    position: absolute;
	margin:0 1rem;
    bottom: -0.5rem;
    height: 5px;
    background-color:#000;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}

@media only screen and (max-width:767px){
	
	#navigation::after{content:""; clear:both; display:block;}
	
	#navigation{
		width:90%;
		margin:2rem auto;
		text-align:center;
	}
	
	#navigation li{
		display:block;
		box-sizing:border-box;
		margin-bottom:1rem;
		width:46%;
		margin:1% 2% 1rem;
		line-height:300%;
		float:left;
	}
	
	#navigation li a{
		display:block;
		padding:1%;
		background-color:#1095c4;
		color:#fff;
		transition:background 1s ease 0;
	}
	
	#navigation li a:hover{
		background-color:#000;
	}
	
	#slide-line{
		display:none;
	}
}

/*--電子プロダクト--*/

#service01{
	padding:0 1.5% 3%;
	background-color:#eee;
}

#service01_list::after{content:""; clear:both; display:block;}

#service01_list li{
	box-sizing:border-box;
	width:30%;
	margin:1.5%;
	padding:2%;
	background-color:#fff;
	float:left;
}

#service01_list li img{
	width:auto;
	margin:0 auto 1rem;
}

@media only screen and (max-width:767px){
	#service01_list li{
		width:47%;
		font-size:0.8rem;
		line-height:150%;
	}
}

/*--工業規格--*/

#service02{
	padding:0 1.5% 3%;
}

#service02_list::after{content:""; clear:both; display:block;}

#logo_ieaatatistics{
	max-width:663px;
	margin:1rem auto;
}

#service02_list{
	text-align:center;
}

#service02_list li{
	display:inline-block;
	width:15%;
	margin:2%;
}

#btn_association{
	box-sizing:border-box;
	width:100%;
	margin-bottom:2rem;
	line-height:300%;
	color:#fff;
	font-size:1.2rem;
	cursor:pointer;
	background-image:url(../img/service/icon_plus.png);
	background-position : right 15px top 50%;
	background-size:20px;
	background-repeat:no-repeat;
	background-color:#999;
}

#btn_association:hover{
	background-color:#aaa;
}

#btn_association.active{
	background-image:url(../img/service/icon_minus.png);
	background-position : right 15px top 50%;
	background-size:20px;
	background-repeat:no-repeat;
	background-color:#999;
}

#association{
	box-sizing:border-box;
	width:100%;
	margin-bottom:2rem;
	border-spacing:0;
	border-right:1px solid #ccc;
	border-top:1px solid #ccc;
	display:none;
}

#association tr{
	background-color:#fff;
}

.bg{
	background-color:#eee !important;
}

#association th{
	width:20%;
	padding:0.2%;
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
	font-weight:normal;
	font-size:0.8rem;
}

#association td{
	padding:0.2% 0.2% 0.2% 2%;
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
	font-size:0.8rem;
}

@media only screen and (max-width:767px){
	#logo_ieaatatistics{
		max-width:286px;
		margin:1rem auto;
	}

	#service02_list li{
		width:40%;
	}
}

/*--国際会議録--*/

#service03{
	padding:0 1.5% 3%;
	background-color:#eee;
}

#service03_list::after{content:""; clear:both; display:block;}


#service03_list li{
	box-sizing:border-box;
	width:30%;
	margin:1.5%;
	padding:2%;
	background-color:#fff;
	text-align:center;
	float:left;
}

#service03_list li img{
	width:auto;
	margin:0 auto 0.5rem;
}

@media only screen and (max-width:767px){
	#service03_list li{
		width:47%;
		font-size:0.8rem;
		line-height:150%;
	}
}

/*--分子構造模型--*/

#service04::after{content:""; clear:both; display:block;}

#service04{
	padding:0 0 8rem;
}

#service04_l{
	box-sizing:border-box;
	width:60%;
	padding:0 1.5%;
	float:left;
}

#service04_r{
	width:40%;
	min-height:500px;
	background:url(../img/service/cochranes.jpg) 50% 50% no-repeat;
	background-size:cover;
	float:right;
}

@media only screen and (max-width:767px){
	#service04_l{
		margin-bottom:1rem;
		width:100%;
		float:none;
	}
	
	#service04_r{
		width:100%;
		min-height:150px;
		float:none;
	}

}
