@charset "UTF-8" ;

body{
	width: auto;
	margin-top: 0;
	margin-right: 30px;
	margin-bottom: 0;
	margin-left: 20px;
	padding-top: 0px;
	padding-right:20px;
	padding-bottom: 0px;
	padding-left: 0px;
}

header {
	width: auto;
	position: relative;
	text-align: center;			/* 上下の余白 */
	margin-bottom: 2em;			/* 他のブロックとのスペース */
	margin-top: 0;
	margin-right: 0px;
	margin-left: 0px;
	padding-top: 1em;
	padding-right: 0px;
	padding-bottom: 1em;
	padding-left: 0px;	
}
header header_inner {
	min-width: 320px;
	margin: 0 auto;
	position: relative;
	width: auto;
}

header header_inner img { 
	width: auto;
	margin:10px;
	
}

.container {
	width: auto;
	height: auto;
	margin: 0;
	overflow: hidden ;
}

.container img{
	max-width: 300px;
	margin: 0;
	overflow: hidden;
	height: auto;
}
 
div.div_1 {
 
             display: inline-block;
 
}
 
div.div_2 {
 
              display: inline-table;
 
}
 
header nav {
	text-align: center;
	background: #efefef;
	float: inherit;
}
header nav ul {
	margin: 0;
	padding: 0.05em;
	list-style-type: none;
}
header nav ul li {
	display: inline;
	margin-left: 1em;
}

header nav ul li img{
	height: auto;
	margin: 5px;
	width: auto;
}

header nav ul li:first-child {
	margin-left: 10px;
}
header nav ul li ul {
	display: none;
}

nav {
	text-align: center;
	background: #efefef;
	float: inherit;
}
nav ul {
	margin: 0;
	padding: 0.05em;
	list-style-type: none;
}
nav ul li {
	display: inline;
	margin-left: 1em;
}

nav ul li img{
	height: auto;
	margin: 10px;
	width: auto;
}

nav ul li:first-child {
	margin-left: 6px;
}
nav ul li ul {
	display: none;
}






/* overrides decoration from previous rule for hovered links */
h1 {
	font-size: 28px;
	font-weight: 100;
	text-align: center;
}

h2 {
font-size: 18px;
font-weight: 100;
margin-top: 40px;
}

h3 {
font-size: 18px;
font-weight: 100;
margin-top: 40px;
}

h2, h3, h4, h5, h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
}
.perle-header1 {
	font-size: 18px;
	font-family: メイリオ;
	font-weight: bold;
	color: #003366;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	width: auto;
	position: relative;
	text-align: left;
	margin: 10px;
}

.prodimg{
	height: auto;
	margin: 5px;
	float: left;
	padding-right: 30px;
	max-width: 250px;
	padding-top: 20px;
	padding-left: 10px;
	padding-bottom: 20px;
}	

#clear {
clear: left;
}

.content {
	position: relative;
	padding: 10px;
	
}

.content p{
	font-family: "メイリオ";
	font-size:14px;
	margin: 10px;
	padding: 0px;
		
}

#feature {
	float:none;
}


.bullet-style1 {
	font-family: メイリオ;
	list-style-type: disc;
	text-align: left;
	width: auto;
	font-size: 12px;
	padding-top: 0px;
	padding-left: 20px;
	float: none;
}

.bullet-style1 ul {
	float: none;
	font-family: メイリオ;
	list-style-type: circle;
	}
.bullet-style1 ul li {
	float: none;
	font-family: メイリオ;
	list-style-type: circle;
	text-align: left;
	width: auto;
	}

/* フッター */
.footer
{
	border-top: 3px solid #888 ;		/* 枠線 */
	text-align: center ;					/* 他のブロックとのスペース */
	padding: 1em 0 ;					/* 上下の余白 */
	background: #e8e8e8 ;
}

.clearfix{
float:right;
}


table.type1{
	border-collapse: collapse;
	border-spacing: 0;
	background-color: #FFFFFF;
	empty-cells: show;
	border: 1px solid #9196A6;
	font-family: メイリオ;
	font-size: 10pt;
	font-style: normal;
	position: relative;
	
}
.type1 th{
	text-align:center;
	border-right-style: none;
	border-bottom-style: solid;
	border-bottom-color: #9196A6;
	border-top-color: #9196A6;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-left-style: none;
	padding-top: 0.5em;
	padding-right: 0em;
	padding-bottom: 0.5em;
	padding-left: 0em;
	background-color: #E1EEF4;
}	

.table-header1 {
	font-weight: bold;
	color: #003366;
	background-color: #A9C0F8;
}
	
.type1 td{
	padding: 0.3em 1em;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #9196A6;
	border-right-color: #9196A6;
	border-bottom-color: #9196A6;
	border-left-color: #9196A6;
}

.type1 td img {
	display: inline;
	border: thin solid #FFFFFF;
	height: auto;
	width:auto
	max-width:150px;
	
}

table.type2{
	border-collapse:collapse;
	border-spacing:0;
	background-color:#ffffff;
	empty-cells:show;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	border: 1px solid #9196A6;
	float: right;
	margin-right: 10px;
}
.type2 th{
	text-align:center;
	border-right-style: none;
	border-bottom-style: solid;
	border-bottom-color: #9196A6;
	border-top-color: #9196A6;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-left-style: none;
	padding-top: 0.5em;
	padding-right: 0em;
	padding-bottom: 0.5em;
	padding-left: 0em;
	background-color: #E1EEF4;
}	
.type2 td{
	padding: 0.3em 1em;
	text-align:center;
	border-right-style: none;
	border-bottom-style: none;
	border-bottom-color: #9196A6;
	border-top-style: none;
	border-left-style: none;
	
}	

.table-header2 {
	font-weight: bold;
	color: #003366;
	background-color: #DAEEFE;
}

.type2 td img {
	display: inline;
	border: thin solid #FFFFFF;
	height: auto;
	width:auto
	max-width:150px;
	min-width:20%;
}

.list{
	height:30px;
	padding:0;
	list-style-type:none;
	font-size: 12px;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 10px;
 }
 .list li{
	float:left;
	list-style-type:none;
	margin-right: 0px;
	font-weight: bold;
	background-color: #A5E6FE;
	left: -30px;
 }
 .list li a{
	display:block;
	padding:3px 0 0;
	color:#0033CC;
	font-size:12px;
	text-align:center;
	background-color:#eeeeff;
	width: 100px;
	margin-right:0px;
	padding-right:0px;
 }
 .list li a:link,
 .list li a:visited{
   text-decoration:none;
   height:20px;
   margin:0px 0 0 0;
 }
 .list li a:hover,
 .list li a:active{
   text-decoration:underline;
   margin:0;
 }

.video-responsive{
    overflow:hidden;
    padding-bottom:40%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    float:right;
		margin-right: 10px;
		left:0;
    top:0;
    
    position:absolute;
}

/* ▼タブ */
#tabcontrol a {
	display: inline-block;              /* 枠線の色：黒色 */
	border-radius: 0.5em 0.5em 0 0; /* 枠線の左上角と右上角だけを丸く */
	padding: 0.5em 0.5em;              /* 内側の余白 */
	text-decoration: none;            /* リンクの下線を消す */
	color: black;                     /* 文字色：黒色 */
	background-color: #D9ECFF;          /* 背景色：白色 */
	font-weight: normal;                /* 太字 */
	position: relative;               /* JavaScriptでz-indexを調整するために必要 */
	border-top-width: medium;
	border-right-width: thin;
	border-bottom-width: 0px;
	border-left-width: thin;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #3399FF;
	border-right-color: #3399FF;
	border-bottom-color: #3399FF;
	border-left-color: #3399FF;
}

/* ▼タブにマウスポインタが載った際（任意） */
#tabcontrol a:focus {
   border-top-width: medium;     /* top罫線を引く */
	 border-top-color: #FF9900;　 /* オレンジ線を引く */
	 text-decoration: underline;   /* リンクの下線を引く */
	 background-color: #FFFFFF;       /* 背景色：白色 */
	 color: #000000;                  /* 文字色：黒 */
}

/* ▼タブが アクティブの際（任意） */
#tabcontrol a:hover {
   text-decoration: underline;   /* リンクの下線を引く */
	 background-color: #E8E8E8;          /* 背景色：薄灰色 */
	 color: #FF9900;                  /* 文字色：オレンジ */
}

/* ▼タブの中身 */
#tabbody div {
   margin-top: -1px;        /* 上側にあるタブと1pxだけ重ねるために「-1px」を指定 */
   padding: 0.5em;            /* 内側の余白量 */
   background-color: white; /* 背景色：白色 */
   position: relative;      /* z-indexを調整するために必要 */
   z-index: 0;              /* 重なり順序を「最も背面」にするため */
}
/* ▼タブの配色 */
#tabcontrol a:nth-child(1), #tabbody div:nth-child(1) { background-color: #FFFFFF; }/* 1つ目のタブとその中身用の配色 */
#tabcontrol a:nth-child(2), #tabbody div:nth-child(2) { background-color: #FFFFFF; }/* 2つ目のタブとその中身用の配色 */
#tabcontrol a:nth-child(3), #tabbody div:nth-child(3) { background-color: #FFFFFF; }/* 3つ目のタブとその中身用の配色 */
#tabcontrol a:nth-child(4), #tabbody div:nth-child(2) { background-color: #FFFFFF; }/* 4つ目のタブとその中身用の配色 */
#tabcontrol a:nth-child(5), #tabbody div:nth-child(3) { background-color: #FFFFFF; }/* 5つ目のタブとその中身用の配色 */



/***********************************************/
/* Layout Divs                                 */
/***********************************************/


@media screen and ( max-width:670px )
{

body{
	width: auto;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0;
	margin-left:10px;
	padding-top: 0;
	padding-right:10px;
	padding-bottom: 0;
	padding-left: 0px;
	font-size: 14px ;	/* 文字サイズ */
	line-height: 1.618 ;	/* 行の高さ */
}	

.container img {
	max-height:180;
	float: none;
	padding-right:5px;
	max-width: 180px;
	padding-top: 5px;
	padding-left: 5px;
}	


.prodimg{
height: auto;
width: auto;
float: none;
}	


.bullet-style1 {
	float:none;
	font-family: メイリオ;
	list-style-type: disc;
	text-align:left;
	clear:left;
}

.container {
	width: 100%;
	text-align: center;
	position: relative;
	height: auto;
	margin: 0;
}

.content {
	position: relative;
	padding: 0px;
}

.content p{
	font-family: "メイリオ";
	font-size:12px;
	margin: 10px;
	padding: 0px;
		
}

table.type1{
	margin: 0px;
	border-collapse: collapse;
	border-spacing: 0;
	background-color: #ffffff;
	empty-cells: show;
	border: 1px solid #9196A6;
	font-family: メイリオ;
	font-size: 10pt;
	font-style: normal;
	position: relative;
	
}

.type1 td{
	padding: 0.3em 1em;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #9196A6;
	border-right-color: #9196A6;
	border-bottom-color: #9196A6;
	border-left-color: #9196A6;
	min-width: 60px;
}

.type1 td img {
	width:80%;
	height: auto;
}

.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

table{
width:100%;
}
.scroll{
overflow: auto;　　　　/*tableをスクロールさせる*/
white-space: nowrap;　　/*tableのセル内にある文字の折り返しを禁止*/
}
.scroll::-webkit-scrollbar{　　/*tableにスクロールバーを追加*/
 height: 10px;
}
.scroll::-webkit-scrollbar-track{　　/*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {　　/*tableにスクロールバーを追加*/
 background: #BCBCBC;
}

span.aks {
   white-space: nowrap;
}


}
