@charset "utf-8";

/* ============================================================

[ information ]
概要 : 基本スタイル設定

[ index ]
■ デフォルトリセット
■ 音声ブラウザ用ナビゲーション
■ テキストリンク
■ レイアウトベース
■ ヘッダー
■ フッター
■ アドビなどダウンロード
■ floatクリア
■ ClearFix
■■レスポンシブ用sytle■■

============================================================ */


/* ---------------------------------------------------------
■ デフォルトリセット
--------------------------------------------------------- */
body ,div {
	margin: 0px;
	padding: 0px;
}
h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
table, th, td, img, form {
	margin: 0px;
	padding: 0px;
	font-weight: normal;
	font-style: normal;
	font-size: 100%;
	line-height: 1;
	border: none;
	list-style-type: none;
}
img { vertical-align: bottom;}
input, textarea { font-size: 100%; }

/* mozilla向けスクロールバー強制表示
------------------------------------ */
html { overflow-y:scroll; }

/* ---------------------------------------------------------
■ 音声ブラウザ用ナビゲーション
--------------------------------------------------------- */
.naviHidden {
	position: absolute;
	z-index: 100;
	top: 0px;
	right: 0px;
	display:inline;
	width: 1px;
	height: 1px;
	border-style: none;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}


/* ---------------------------------------------------------
■ テキストリンク
--------------------------------------------------------- */
a:link    { color: #0068b3; text-decoration: none; }
a:visited { color: #471f99; text-decoration: none; }
a:hover   { color: #0068b3; text-decoration: underline; }
a:active  { color: #0068b3; text-decoration: underline; }


/* ---------------------------------------------------------
■ レイアウトベース
--------------------------------------------------------- */
html {}
body {
	-webkit-text-size-adjust: 100%;
	font: 13px/1.231 "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3","Meiryo","メイリオ",Verdana,"MS PGothic","ＭＳ Ｐゴシック",Helvetica,sans-serif;
	color: #45484d;
	background-color: #ffffff;
    min-width: 960px;
}
input, textarea { font-family: "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3","Meiryo","メイリオ",Verdana,"MS PGothic","ＭＳ Ｐゴシック",Helvetica,sans-serif; }

#base {}

#wrap_01 {
	padding-bottom: 30px;
}

#wrap_02 {
	padding-top: 20px;
}

#wrap_03 {
}

#mainArea {
	margin: 0px auto;
	width: 950px;
}

#contentWrap {
	padding: 0px;
	min-height: 30em;
	background: #ffffff;
}
	* html #contentWrap { height: 30em; }

#contentNoSideNavi {
	margin-bottom: 60px;
	width: 950px;
}

#content {
	float: right;
	margin: 0px auto 60px;
	width: 725px;
}

#sideNaviWrap {
	float: left;
	width: 200px;
	padding-bottom: 15px;
}


/* ---------------------------------------------------------
■ ヘッダー
--------------------------------------------------------- */
#headerWrap {
/*	margin-bottom: 11px;
	padding-bottom: 6px;*/
	background-color: #fff;
}
#header {
	margin: 0px auto;
	width: 950px;
*height: 80px;
}

#header ul {
	margin: 0px;
	padding: 0px;
}

/* ヘッダー左
------------------------------------ */
#headerLeft {
	float: left;
	width: 300px;
}

#headerLeft p#tagLine {
	margin: 7px 0px 0px 12px;
	line-height: 1;
	font-size: 12px;
	color: #333366;
}

#headerLeft #logo {
	padding: 22px 0px 0px 2px;
	font-size: 0;
}

/* ヘッダー右
------------------------------------ */
#headerRight {
	float: right;
	width: 650px;
}

/* 関連リンク */
#headerRight ul#subLink {
	float: right;
	margin: 8px 0px 0px 0px;
}

#headerRight ul#subLink li {
	float: left;
	margin: 0px;
	padding: 0px;
	vertical-align: bottom;
	list-style: none;
	line-height: 1.2;
}

#headerRight ul#subLink li a {
	display: block;
	margin: 4px 0px 5px 25px;
	color: #0a101a;
/display: inline;
/zoom: 1;
/padding-bottom: 5px;
/margin: 4px 0px 5px 20px;
	margin: 4px 0px 5px 22px\9;
}
#headerRight ul#subLink li a:hover {
	text-decoration: none;
	color: #0068b3;
}
#headerRight ul#subLink li a img {
	margin-left: 3px;
}

/* utilityMenu */
#headerRight #utilityMenu {
	clear: both;
	padding: 7px 0px 3px;
}

/* 検索 */
#headerRight #searchArea {
	float: right;
	width: 291px;
	text-align: right;
}

#headerRight #searchArea img { vertical-align: top !important; }

#headerRight #searchArea p {
	float: left;
	margin: 0px;
	padding-right: 1px;
	line-height: 1;
}
#headerRight #searchArea ul li {
	display:inline;
	margin: 0px 0px 0px 1px;
}

#headerRight #searchArea input#searchInput {
	margin: 0px;
	padding: 4px 3px 0px;
	width: 178px;
	height: 17px;
	font-size: 12px;
	line-height: 1;
	border: 1px solid #74a7dd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	vertical-align: top;
}

#headerRight #searchArea input#searchBtn { vertical-align: top; }

#headerRight #searchArea input#searchBtn:hover {
	filter: Alpha(opacity=80);
	opacity:0.8;
}

/* 文字サイズ */
#headerRight #fontResize {
	float: right;
/*	width: 340px;*/
	margin: 8px 0 0 0;
}

#headerRight #fontResize dl { margin: 0px; text-align: right; }
#headerRight #fontResize dt ,
#headerRight #fontResize dd {
	display: inline;
	margin: 0px 0px 0px 4px;
	font-size: 0;
}
#headerRight #fontResize dt {
	padding-right: 6px;
}

#headerRight #fontResize dd img { cursor: pointer; }
#headerRight #fontResize dd img:hover {
	filter: Alpha(opacity=70);
	opacity:0.7;
}

/* ---------------------------------------------------------
■ フッター
--------------------------------------------------------- */
#footerWrap {
	margin-top: 5px;
	padding-top: 40px;
	border-top: 1px solid #dadde0;
	background-color: #fff;
}
#footerMenuWrap {
	padding-bottom: 20px;
}
#footerLinkWrap {
	padding: 20px 0;
	background-color: #003b90;
}


/* フッタメニュー
------------------------------------ */
#footerMenu {
	margin: 0px auto;
	width: 950px;
}
.footerMenuGrid {
	float: left;
	margin: 0px 0px 0px 25px;
	width: 170px;
}
.footerMenuGrid:first-child {
	margin: 0px;
}
.footerMenuGridCol2 {
	float: left;
	margin: 0px 0px 0px 25px;
	width: 365px;
}
.footerMenuGridCol2:after { content : ''; display : block; clear : both; }

.footerMenuGrid dt,
.footerMenuGridCol2 dt {
	font-size: 108%;
}
.footerMenuGrid dt a,
.footerMenuGridCol2 dt a {
	padding-right: 13px;
	background: url(../img/icons/ico_arrow_right_red_01.gif) no-repeat right center;
	min-height: 18px;
	color: #0a101a;
}
.footerMenuGrid dd,
.footerMenuGridCol2 dd {
	display: inline-block;
	width: 170px;
	margin: 0px 0px 15px 0px;
}
.footerMenuGrid dd ul ,
.footerMenuGridCol2 dd ul {
	margin-right: 0px;
}
.footerMenuGrid dd li a ,
.footerMenuGridCol2 dd li a {
	color: #45484d;
}

.footerMenuGrid dt a:hover ,
.footerMenuGridCol2 dt a:hover ,
.footerMenuGrid dd li a:hover ,
.footerMenuGridCol2 dd li a:hover {
	text-decoration: none;
	color: #0068b3;
}

.footerMenuSep {
	border-top: 1px solid #dadde0;
}

/* フッタリンク
------------------------------------ */
#footerLink {
	position: relative;
	margin: 0px auto;
	width: 950px;
}

#footerLink ul {
	position: absolute;
	top: 0;
	bottom: 0;
	height: 21px;
	margin: auto 0px;
	padding: 0px;
}

#footerLink ul li {
	display: inline-block;
	margin: 0;
	padding-right: 25px;
	font-size: 94%;
	line-height: 1.76;
	list-style: none;
/display: inline;
/zoom: 1;
}

#footerLink ul li a { color: #ffffff; }

/* コピーライト
------------------------------------ */
#footerLink #copyright {
	float: right;
	width: 280px;
	text-align: right;
	color: #ffffff;
}
#footerLink #copyright img {
	margin-bottom: 7px;
}



/* ---------------------------------------------------------
■ アドビなどダウンロード
--------------------------------------------------------- */
div.download {
	height: auto;
	margin: 20px 0px;
	padding: 20px 0px 0px 0px;
	border-top: 1px solid #dadde0;
	font-size: 94%;
}
div.download p {
	margin: 0px;
	line-height: 1.76;
}
div.download img {
	float:left;
	margin:0px 20px 15px 0px;
}


/* ---------------------------------------------------------
■ floatクリア
--------------------------------------------------------- */
.clear {
	display: block;
	clear: both;
	height: 1px;
	margin: 0px;
	padding: 0px;
	font-size: 1px;
	line-height: 1px;
}


/* ---------------------------------------------------------
■ ClearFix
--------------------------------------------------------- */
/* クラス追加用
------------------------------------ */
.clearfix:after { content : ''; display : block; clear : both; }
.clearfix { /zoom : 1; }

/* 固定
------------------------------------ */
#topContentWrap:after,
#topContent:after,
#header:after,
#headerLink:after,
#utilityMenu:after,
#footerMenu:after,
#footerLink:after,
#contentWrap:after,
#contentColumnWrap:after,
#contentNoSideNavi:after,
.setImg:after,
.categoryBox:after,
.categoryBoxWrap_col3:after,
.categoryBox_col3:after,
.categoryBoxWrap_col2:after,
.categoryBox_col2:after,
.tabNavi:after,
.infoArea dl:after,
.downloadBtn:after
{ content : ''; display : block; clear : both; }

#topContentWrap,
#topContent,
#header,
#headerLink:after,
#utilityMenu,
#footer,
#contentWrap,
#contentColumnWrap,
#contentNoSideNavi,
.setImg,
.categoryBox,
.categoryBoxWrap_col3,
.categoryBox_col3,
.categoryBoxWrap_col2,
.categoryBox_col2,
.tabNavi,
.infoArea dl,
.downloadBtn
{ /zoom : 1; }
#header:after,
#headerLink:after{overflow: hidden;}



/* ---------------------------------------------------------
■■レスポンシブ用sytle■■ 
    - 2018/06 : 追加
--------------------------------------------------------- */

/* PCのみ */
@media print, screen and (min-width:751px){
    #menuSPWrap{
        display: none;
    }
    #footerSpMenuWrap{
        display: none;
    }
}
/* タブレット・スマホ以下 */
@media screen and  (max-width:750px){
    body{
        min-width: 320px;
    }
}

@media screen and  (max-width:750px){

    /* SP body */
    body{
        margin-top: 46px;
    }
    
    /* SP header */
    #headerWrap{
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1000;
    }
    #header{
        height: 46px;
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }
    #headerLeft{
        float: left;
        width: 50%;
        max-width: 180px;
    }
    #headerLeft #logo{
        padding: 5px;
        position: relative;
        z-index: 1010;
    }
    #headerLeft #logo a{
        display: block;
    }
    #headerLeft #logo a img{
        width: 100%;
        max-width: 272px;
        height: auto;
    }
    #headerRight{
        display: none;
    }
    #menuSPWrap{
        position: fixed;
        top: 5px;
        right: 0;
    }
    #menuSPWrap::after{
        content: "";
        display: block;
        clear: both;
    }
    #menuBtnSP{
        float: right;
        width: 35px;
        height: 35px;
        margin-right: 1.8vw;
    }
    #menuBtnSP > img{
        width: 35px;
        height: 35px;
    }
    #categoryList{
        display: none;
        background: #FFF;
        border: #CCC solid 1px;
        box-sizing: border-box;
        position: fixed;
        top: 46px;
        right: 1.5vw;
        width: 94vw;
        z-index: 1000;
    }
    #categoryList ul{
        list-style: none;
        padding: 0;
        margin: 0;
    }
    #categoryList ul ul{
        display: none;
    }
    #categoryList ul li{
        display: block;
        list-style: none;
        margin-top: 0;
        border-bottom: #CCC solid 1px;
    }
    #categoryList ul ul li{
        padding-left: 1em;
    }
    #categoryList ul li:last-child{
        border-bottom: none;
    }
    #categoryList ul li a{
        display: block;
        padding: 10px;
        color: #333;
        background: url(../img/icons/ico_arrow_right_red_03.png) no-repeat right 10px top 15px / 6px auto;
    }
    #categoryList ul li a:hover{
        text-decoration: none;
    }
    #categoryList ul li a:visited{
        color: #333;
    }
    #categoryList ul li a#inlineMenu01,
    #categoryList ul li a#inlineMenu02{
        background:  url(../img/icons/ico_info_down.gif) no-repeat right 12px top 17px / 7px auto;
    }
    #minLink{
        display : -ms-flexbox;
        display: flex;
        flex-flow: row nowrap;
        justify-content: center;
        align-items: center;
        -ms-flex-flow: row nowrap;
        -ms-justify-content: center;
        -ms-flex-align: center;
        background: #F4F4F4;
        box-sizing: border-box;
        padding: 10px;
        border-top: #CCC solid 1px;
        margin-left: auto;
        margin-right: auto;
    }
    #minLink p{
        display: block;
        border-top:  #CCC solid 1px;
        border-left:  #CCC solid 1px;
        border-bottom:  #CCC solid 1px;
        width: 32.8%;
        margin: 0;
        line-height: 100%;
    }
    #minLink p:last-child{
        border-right:  #CCC solid 1px;
    }
    #minLink p a{
        line-height: 100%;
        display: block;
        text-align: center;
        padding: 10px 2px;
        margin: 0;
    }
    #minLink p:first-child a img{
        vertical-align: bottom;
        height: 12px;
        margin-left: 3px;
        line-height: 90%;
    }
    #naviWrap{
        margin-top: 0;
    }
    #naviWrap::after{
        content: "";
        display: block;
        clear: both;
    }
    #localNaviWrap{
        display: none;
    }
    #localNaviWrap{
        display: none;
    }
    
    /* SP footer */
    #footerSpMenu,
    #footerSpMenuWrap{
        display: block;
        box-sizing: border-box;
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
    #footerSpMenu ul,
    #footerSpMenuWrap ul{
        display : -ms-flexbox;
        display: flex;
        flex-flow: row nowrap;
        justify-content: center;
        align-items: stretch;
        -ms-flex-flow: row nowrap;
        -ms-justify-content: center;
        -ms-flex-align: stretch;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }
    #footerSpMenu ul li,
    #footerSpMenuWrap ul li{
        display: block;
        box-sizing: border-box;
        border-top: #DDD solid 1px;
        border-left: #DDD solid 1px;
        border-bottom: #DDD solid 1px;
        width:33.333%;
        width:-webkit-calc(100% / 3);
        width:-moz-calc(100% / 3);
        width:calc(100% / 3);
    }
    #footerSpMenu ul li:last-child,
    #footerSpMenuWrap ul li:last-child{
        border-right: #DDD solid 1px;
    }
    #footerSpMenu ul li img,
    #footerSpMenuWrap ul li img{
        vertical-align: middle;
    }
    #footerSpMenu ul li a,
    #footerSpMenuWrap ul li a{
        display: block;
        padding-top: 8px;
        padding-bottom: 8px;
        text-align: center;
    }
    #footerMenuWrap{
        padding-bottom: 15px;
    }
    #footerWrap{
        border-top: none;
        padding-top: 0;
        margin-top: 0;
    }
    #footerMenu{
        display: none;
    }
    #footerLink{
        width: 100%;
    }
    #footerLink ul{
        position: relative;
        height: auto;
        top: auto;
        left: auto;
        margin-bottom: 10px;
    }
    #footerLink ul li{
        display: block;
        text-align: center;
        padding: 0 0 5px 0;
    }
    #footerLink #copyright{
        float: none;
        width: 100%;
        text-align: center;
        padding-top: 15px;
        border-top: #2956A0 solid 1px;
    }
    #footerLink #copyright img{
        width: 75%;
        max-width: 180px;
        height: auto;
        margin: 0 auto 10px auto;
    }
    #footerLink #copyright .small{
        text-align: center !important;
    }
    p.toPageTop{
        right: 10px !important;
        bottom: 10px !important;
        margin: 0 !important;
    }
    
    /*********** SP contents ***********/
    /* SP コンテンツ 共通 */    
    #wrap_02{
        padding-top: 10px;
    }
    #mainArea{
        width: 100%;
    }
    #mainArea #contentWrap{
        
    }
    div.download {
        display: none;
    }
    .spnone{
        display: none;
    }
    
    /* SP パンくず */
    #mainArea #breadCrumbs{
        padding-left: 10px;
        padding-right: 10px;
        box-sizing: border-box;
    }
    #mainArea #breadCrumbs #pagePrint{
        display: none;
    }
    /* SP 左コンテンツ */
    #mainArea #sideNaviWrap{
        float: none;
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
        box-sizing: border-box;
    }
    #mainArea #sideNaviWrap .sideBanner{
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    #mainArea #sideNaviWrap .sideBanner a.link,
    #mainArea #sideNaviWrap .sideBanner a.link + a.marginBtm00{
        max-width: 220px;
        margin-left: auto;
        margin-right: auto;
    }
    #mainArea #sideNaviWrap .sideBanner a.link img,
    #mainArea #sideNaviWrap .sideBanner a.link + a.marginBtm00 img{
        width: 100%;
        height: auto;
    }
    
    /* SP 右コンテンツ */
    #mainArea #content{
        width: 100%;
        float: none;
        padding-left: 10px;
        padding-right: 10px;
        box-sizing: border-box;
    }
    #contentNoSideNavi{
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
        box-sizing: border-box;
        margin-bottom: 30px;
    }
    
    
        /* 各パーツCSS*/
        div.download img{
            display: block;
            width: auto;
            text-align: center;
        }

}