﻿/* reset */
body,div,p,h1,h2,h3,h4,h5,h6{margin:0;padding:0;}


/* ===========================================================

   基本構造

=========================================================== */
body{
font-family:"メイリオ", Meiryo, "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size:16px;
}
a{
color:#479abd;
}
a:hover{
text-decoration:none;
opacity:0.7;
}
/*
a[href^="http"]{
*/
a.icon{
padding-left:24px;
background:url(../img/icon_target_blank.png) no-repeat 0 3px;
}


/* ===========================================================

   ヘッダー　#header

=========================================================== */
div#header{
/*
box-shadow:0 0 15px 0 rgba(0,0,0,0.3);
*/
border-bottom:1px #ccc solid;
}
div#header > div{
width:1100px;
margin:0 auto;
overflow:hidden;
}
div#header > div > a{
margin:15px 0 22px 0;
float:left;
}
div#header > div a.inq{
display:block;
width:250px;
margin:20px 0 7px 0;
padding:5px 0;
color:#fff;
text-align:center;
text-decoration:none;
border-radius:5px;
background:#39b;
float:right;
box-shadow:0 1px 0 1px rgba(0,0,0,0.3);
}
div#header > div a.inq:hover{
opacity:0.7;
}
div#header > div a.inq span{
padding-right:10px;
font-size:140%;
vertical-align:-2px;
}
div#header > div ul{
display:table;
margin:0 0 7px 0;
padding:0;
font-size:82%;
list-style:none;
clear:both;
}
div#header > div ul li{
display:table-cell;
padding:0 5px;
vertical-align:middle;
border-right:1px #ccc solid;
border-width:0 1px;
}
div#header > div ul li:last-child{
margin-right:0;
border:none;
}
div#header > div ul li a{
display:block;
padding:0 15px;
text-decoration:none;
vertical-align:middle;
}
div#header > div ul li a:hover{
color:#fff;
border-radius:5px;
background-color:#39b;
}
div#header > div ul li.here{
}
div#header > div ul li.here a{
padding:11px 15px 10px 15px;
color:#fff;
border-radius:5px;
background-color:#39b;
background-position:-277px 50%;
box-shadow:0 1px 0 1px rgba(0,0,0,0.3);
}
div#header > div ul li.here a:hover{
text-decoration:none;
}



/* ===========================================================

   キービジュアル　#kv

=========================================================== */
/* bxslider */
.bx-wrapper .bx-viewport{
border:none;
background:none;
box-shadow:none;
left:auto;
}
ul.bxslider{
margin:0;
padding:0;
}
.bx-wrapper img{
max-width:1920px !important;
float:right;
}

/* kv area */
div#kv{
height:530px;
overflow:hidden;
position:relative;
}
div#kv > div#text{
width:770px;
height:100%;
color:#333;
background:url(../img/kv_textbg.png) no-repeat 100% 0;
position:absolute;
top:0;
left:0;
z-index:10;
}
div#kv > div#text:before{
content:" ";
display:block;
width:15px;
/*height:40%;*/
height:100%;
background:#fff000;
position:absolute;
/*top:30%;*/
top:0;
left:20px;
}
div#kv > div#text h1{
margin:0;
padding:0;
font-size:42px;
font-weight:normal;
line-height:1.2;
position:absolute;
top:190px;
left:55px;
}
div#kv > div#text p{
margin:0;
padding:0;
font-size:16px;
position:absolute;
top:270px;
left:55px;
}



/* ===========================================================

   お知らせ　#news

=========================================================== */
div#news{
background:#eff7ff ;
}
div#news > div{
width:800px;
margin:0 auto 20px auto;
padding:20px 0 0 0;
padding-bottom:20px;
}
div#news h2{
margin:20px 0 30px 0;
font-size:200%;
}
div#news dl{
padding:5px 20px;
border:1px #ccc solid;
border-radius:10px;
background:#fff;
overflow:hidden;
}
div#news dl dt{
width:100px;
margin:0;
padding:12px 0 7px 0;
border-top:1px #999 dotted;
float:left;
clear:both;
}
div#news dl dd{
width:640px;
margin:0;
padding:12px 0 7px 18px;
border-top:1px #999 dotted;
float:right;
}
div#news dl dt:first-child,
div#news dl dt:first-child + dd{
border:none;
}
div#news dl dd a{
display:block;
}


/* ===========================================================

   技術情報　#tech

=========================================================== */
div#tech{
background:#ffffff ;
}
div#tech > div{
width:800px;
margin:0 auto 20px auto;
padding:20px 0 0 0;
padding-bottom:20px;
}
div#tech h2{
margin:20px 0 30px 0;
font-size:200%;
}
div#tech dl{
padding:5px 20px;
border:1px #ccc solid;
border-radius:10px;
background:#fff;
overflow:hidden;
}
div#tech dl dt{
width:100px;
margin:0;
padding:12px 0 7px 0;
border-top:1px #999 dotted;
float:left;
clear:both;
}
div#tech dl dd{
width:640px;
margin:0;
padding:12px 0 7px 18px;
border-top:1px #999 dotted;
float:right;
}
div#tech dl dt:first-child,
div#tech dl dt:first-child + dd{
border:none;
}
div#tech dl dd a{
display:block;
}



/* ===========================================================

   コンテンツ　#contents

=========================================================== */

/* 基本構造
------------------------------------------------------------*/
div#contents{
margin:50px 0 0 0;
}
div#contents > div{
padding:20px 0;
overflow:hidden;
}
div#contents > div:nth-of-type(even){
background:#f3f3f3;
}
div#contents > div > div{
width:800px;
margin:0 auto 20px auto;
}

/* 見出し
------------------------------------------------------------*/
/* 通常見出し */
div#contents h1{
font-size:300%;
}
div#contents h2{
margin:40px 0 20px 0;
font-size:250%;
}
div#contents h3{
margin:40px 0 20px 0;
font-size:180%;
}
div#contents h4{
margin:40px 0 20px 0;
font-size:140%;
}
/* 特殊見出し */
div#contents > h1{
width:810px;
margin:0 auto;
padding:0 20px;
font-size:300%;
border-left:10px #fff000 solid;
}
div#contents > h1 + p{
width:800px;
margin:20px auto 50px auto;
}
div#contents > h2,
div#contents > p{
width:800px;
margin:0 auto;
}

/* テキスト
------------------------------------------------------------*/
div#contents p{
margin-bottom:20px;
}

/* 日付付きリスト
------------------------------------------------------------*/
div#contents > div div.newslist dl{
margin:0 0 30px 0;
padding:5px 20px;
border:1px #ccc solid;
border-radius:10px;
background:#fff;
overflow:hidden;
}
div#contents > div div.newslist dl dt{
width:100px;
margin:0;
padding:12px 0 7px 0;
font-weight:normal;
border-top:1px #999 dotted;
float:left;
clear:both;
}
div#contents > div div.newslist dl dd{
width:640px;
margin:0;
padding:12px 0 7px 18px;
border-top:1px #999 dotted;
float:right;
}
div#contents > div div.newslist dl dt:first-child,
div#contents > div div.newslist dl dt:first-child + dd{
border:none;
}
div#contents > div div.newslist dl dd a{
display:block;
}

/* リスト
------------------------------------------------------------*/
div#contents ul{
margin:0 0 20px 0;
padding:0 0 0 1.5em;
}
div#contents ol{
margin:0 0 20px 0;
padding:0 0 0 1.5em;
}
div#contents dl{
margin:0 0 20px 0;
padding:0;
}
div#contents dl dt{
font-weight:bold;
}
div#contents dl dd{
margin:0 0 0.5em 1em;
}

/* ===========================================================

   コンテンツ　#partners

=========================================================== */

/* 基本構造
------------------------------------------------------------*/
div#partners{
margin:50px 0 0 0;
}
div#partners > div{
padding:20px 0;
overflow:hidden;
}

div#partners > div > div{
width:800px;
margin:0 auto 20px auto;
}

/* 見出し
------------------------------------------------------------*/
/* 通常見出し */
div#partners h1{
font-size:300%;
}
div#partners h2{
margin:40px 0 20px 0;
font-size:250%;
}
div#partners h3{
margin:40px 0 20px 0;
font-size:180%;
}
div#partners h4{
margin:40px 0 20px 0;
font-size:140%;
}
/* 特殊見出し */
div#partners > h1{
width:810px;
margin:0 auto;
padding:0 20px;
font-size:300%;
border-left:10px #fff000 solid;
}
div#partners > h1 + p{
width:800px;
margin:20px auto 50px auto;
}
div#partners > h2,
div#partners > p{
width:800px;
margin:0 auto;
}

/* テキスト
------------------------------------------------------------*/
div#partners p{
margin-bottom:20px;
}

/* 日付付きリスト
------------------------------------------------------------*/
div#partners > div div.newslist dl{
margin:0 0 30px 0;
padding:5px 20px;
border:1px #ccc solid;
border-radius:10px;
background:#fff;
overflow:hidden;
}
div#partners > div div.newslist dl dt{
width:100px;
margin:0;
padding:12px 0 7px 0;
font-weight:normal;
border-top:1px #999 dotted;
float:left;
clear:both;
}
div#partners > div div.newslist dl dd{
width:640px;
margin:0;
padding:12px 0 7px 18px;
border-top:1px #999 dotted;
float:right;
}
div#partners > div div.newslist dl dt:first-child,
div#partners > div div.newslist dl dt:first-child + dd{
border:none;
}
div#partners > div div.newslist dl dd a{
display:block;
}

/* リスト
------------------------------------------------------------*/
div#partners ul{
margin:0 0 20px 0;
padding:0 0 0 1.5em;
}
div#partners ol{
margin:0 0 20px 0;
padding:0 0 0 1.5em;
}
div#partners dl{
margin:0 0 20px 0;
padding:0;
}
div#partners dl dt{
font-weight:bold;
}
div#partners dl dd{
margin:0 0 0.5em 1em;
}


/* テーブル
------------------------------------------------------------*/
table{
width:100%;
margin:0 0 30px 0;
border-collapse:collapse;
border:1px #ccc solid;
background:#fff;
}
table th{
padding:10px 10px 8px 10px;
text-align:left;
white-space:nowrap;
border:1px #ccc solid;
background:#eff7ff ;
}
table td{
padding:10px 10px 8px 10px;
border:1px #ccc solid;
}
table.th_autowrap th{
white-space:normal;
}
table.th_center th{
text-align:center;
}
table.th_right th{
text-align:right;
}
table.th_normal th{
font-weight:normal;
}
table.table_width_auto{
width:auto;
}

/* リンクボタン
------------------------------------------------------------*/
div.button_small,
div.button_large{
text-align:center;
overflow:hidden;
}
div.button_small a,
div.button_large a{
display:inline-block;
margin:0 0 20px 0;
padding:10px 40px;
color:#fff;
text-decoration:none;
border-radius:5px;
box-shadow:0 1px 0 1px rgba(0,0,0,0.3);
background:#39b url(../img/icon_button_arrow_wh.png) no-repeat 98% 50%;
}
div.button_large a{
font-size:170%;
background:#39b url(../img/icon_button_arrow_wh.png) no-repeat 98% 50%;
}
div.button_small.gray a{
color:#fff;
background:#828282 url(../img/icon_button_arrow_wh.png) no-repeat 98% 50%;
}
div.button_large.gray a{
color:#fff;
background:#828282 url(../img/icon_button_arrow_wh.png) no-repeat 98% 50%;
}

/* 画像
------------------------------------------------------------*/
div#contents img{
width:100%;
}
div#contents img + p{
margin:0;
padding-top:5px;
font-size:82%;
line-height:1.5;
color:#666;
}

/* セパレート
------------------------------------------------------------*/
/* 画像エリア　右　回り込み */
div#contents div.left{
width:350px;
margin:0 20px 20px 0;
float:left;
}
/* 画像エリア　左　回り込み */
div#contents div.right{
width:350px;
margin:0 0 20px 20px;
float:right;
}

div#contents div.separate02,
div#contents div.separate03,
div#contents div.separate04,
div#contents div.separate05,
div#contents div.separate06{
overflow:hidden;
}
div#contents div.separate02 div{
width:390px;
margin:0 20px 20px 0;
}
div#contents div.separate02 div:last-child{
margin:0 0 20px 0;
}
div#contents div.separate03 div{
width:256px;
margin:0 16px 20px 0;
}
div#contents div.separate03 div:last-child{
margin:0 0 20px 0;
}
div#contents div.separate04 div{
width:188px;
margin:0 15px 20px 0;
}
div#contents div.separate04 div:last-child{
margin:0 0 20px 0;
}
div#contents div.separate05 div{
width:148px;
margin:0 15px 20px 0;
}
div#contents div.separate05 div:last-child{
margin:0 0 20px 0;
}
div#contents div.separate06 div{
width:120px;
margin:0 15px 20px 0;
}
div#contents div.separate06 div:last-child{
margin:0 0 20px 0;
}
div#contents div.separate06 div a{
padding:5px 20px;
}
div#contents div.separate02 div,
div#contents div.separate03 div,
div#contents div.separate04 div,
div#contents div.separate05 div,
div#contents div.separate06 div{
float:left;
}
div#contents div.separate02 div h4,
div#contents div.separate03 div h4,
div#contents div.separate04 div h4,
div#contents div.separate05 div h4,
div#contents div.separate06 div h4{
margin:10px 0;
padding:0;
text-align:center;
}
div#contents div.separate02 div h4.left,
div#contents div.separate03 div h4.left,
div#contents div.separate04 div h4.left,
div#contents div.separate05 div h4.left,
div#contents div.separate06 div h4.left{
text-align:left;
}
div#contents div.separate03 div p.
div#contents div.separate04 div p{
font-size:92%;
}
div#contents div.separate05 div p{
font-size:82%;
}
div#contents div.separate06 div p{
font-size:78%;
}
div#contents div.separate06 div a{
padding:5px 20px 5px 10px;
font-size:82%;
}



/* ===========================================================

   ページトップへ戻るボタン　#pagetop

=========================================================== */
div#pagetop{
width:50px;
height:38px;
padding:12px 0 0 0;
color:#fff;
font-size:30px;
text-align:center;
line-height:1;
background:#111;
position:fixed;
right:20px;
bottom:-100px;
opacity:0.7;
box-shadow:0 1px 0 1px rgba(0,0,0,0.3);
transition:.5s ease-in-out;
}
div#pagetop:hover{
cursor:pointer;
opacity:1;
}


/* ===========================================================

   フッター　#footer

=========================================================== */
div#footer{
background:#545454;
}
div#footer > p{
width:800px;
margin:0 auto;
padding:10px 0;
color:#fff;
font-size:78%;
text-align:center;
}
