﻿@charset "utf-8";

/*	File Name   : default.css
	Description : デフォルトのスタイルのリセット及び基本設定
*/


/* Universal reset
----------------------------------------------------------- */


* {	margin: 0;
	padding: 0;
	font-style: normal;
}

html {	overflow-y: scroll;
}

table {	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
	font-size: 100%;
}



body {
font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.clear{
clear:both;
}

/*印刷範囲の指定*/

@media print{

.page_footer{
display:none;

}
}



/*PCでスマホ用コンテンツを表示しない*/

.pc{	display:inline;
}

.tb{
	display:none;
}


.sp{
	display:none;
}


/*タブレット(1200）*/ 
@media only screen and (max-width:1200px){

.pc{
	display:none;
	}

.tb{
	display:inline;
}

}



/*スマホ(480）*/ 
/*スマホでSPを表示させPCコンテンツを表示しない*/
@media only screen and (max-width:480px){

.pc{
	display:none;
	}

.sp{
	display:inline;
}
}

/* 個別ページ 本文共通基本レイアウト

----------------------------------------------------------- */

.contents{
display:block;
float:left;
padding-top:40px;
margin-left:20px;
border-left:solid 1px #2D579A;
}

/*スマホ(480）*/ 
@media only screen and (max-width:480px){

.contents{
padding-top:20px;
margin-left:0px;
border-left:none;
}


}/*スマホ(480）ここまで*/ 




/* ページ内　トップ見出し（青ライン）　*/
.contents h1{
border-left:solid 15px #2D579A;
color:#444;
font-size:35px;
font-weight:bold;
width:800px;
margin-left:30px;
padding-left:15px;
padding-bottom:3px;
}

/*タブレット(1200）*/ 
@media only screen and (max-width:1200px){

.contents h1{
width:90%;
}


}/*タブレット(1200）ここまで*/ 

/*スマホ(480）*/ 
@media only screen and (max-width:480px){

.contents h1{
border-left:solid 5px #2D579A;
color:#444;
font-size:20px;
font-weight:bold;
width:80%;
margin-left:10px;
padding-left:15px;
padding-bottom:3px;
}


}/*スマホ(480）ここまで*/ 

.h1_bar{
border-bottom:solid 7px #2D579A;
margin-left:30px;
}

/* ページ内　右側テキストエリアの指定 */
.contents_txt{
width:800px;
margin-left:30px;
margin-top:20px;
color:#444;
}

/*タブレット(1200）*/ 
@media only screen and (max-width:1200px){

.contents_txt{
width:90%;
}

}/*タブレット(1200）ここまで*/ 


/*スマホ(480）*/ 
@media only screen and (max-width:480px){

.contents_txt{
width:100%;
margin-left:10px;
margin-top:5px;
color:#444;
}

}/*スマホ(480）ここまで*/ 


/* ページ内　小見出し　（ボールド，色つき） */
.contents h2{
color:#CD6F10;
margin-left:15px;
margin-top:50px;
margin-bottom:10px;
}

/*スマホ(480）*/ 
@media only screen and (max-width:480px){

.contents h2{
margin-top:20px;
}

}/*スマホ(480）ここまで*/ 


/* ページ内　自由に使える枠　（青線，横幅いっぱい） */
.waku{
border:solid 1px #2D579A;
padding-top:10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

/* ページ内　自由に使える枠に付けたい場合のタイトル　（青バック） */
.waku_title{
background-color:#2D579A;
color:#fff;
height: 40px;
line-height: 40px;
padding-left: 7px;
font-weight:bold;
}


/* ページ内　自由に使える枠に付けたい場合のタイトル　（グレー（444）バック） */
.waku_title_gray{
background-color:#444;
color:#fff;
height: 40px;
line-height: 40px;
padding-left: 7px;
font-weight:bold;
}

.waku span{
font-weight:bold;
}

/* ページ内　自由に使える枠　（グレー，横幅いっぱい） */
.waku_g100{
border: solid 1px #aaa;
width840px;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 10px;
margin-top: 20px;
}


/* ページ内　自由に使える枠　（グレー，横幅半分） */
.waku_small{
border: solid 1px #aaa;
width:420px;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 10px;
margin-top: 20px;
}

/* ページ内　一部文字装飾　（グレー，ボールド） */
span.bold_g{
font-weight: bold;
color: #444;
line-height:40px;
}

/* ページ内　一部文字装飾　（ブルー，ボールド） */
span.bold_b{
font-weight: bold;
color: #2D579A;
line-height:40px;
}

/* ページ内　カラーボタン　*/

.color_button_wrap{
width:100%;
text-align:center;
}

.color_button{
display: inline-block;
line-height:50px;
padding-left:15px;
padding-right:15px;
font-size:20px;
background-color:#2D579a;
color:#fff;
font-weight:bold;
border:solid 3px #2D579a;
}

.color_button a{
display: block;
color:#fff;
text-decoration:none;
padding-left:15px;
margin-left:-15px;
padding-right:15px;
margin-right:-15px;
}


.color_button a:hover{
display: block;
width:100%;
background-color:#fff;
color:#2D579a;

}


/*リストの三角
----------------------------------------------------------- */

/*　リストの頭に三角を付ける　(青#2D579A）　*/

.arrow{
  position: relative;
  display: inline-block;
  padding: 0 0 0 16px;
  color: #444;
  vertical-align: middle;
  text-decoration: none;
 margin-right:7px;

}

.arrow::before{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  box-sizing: border-box;
  width: 15px;
  height: 15px;
  border: 1px solid #2D579A;

}

.arrow::after{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  left: 5px;
  box-sizing: border-box;
  width: 5px;
  height: 5px;
  border: 5px solid transparent;
  border-left: 5px solid #2D579A;

}

/*　リストの頭に三角を付ける　(リンク無し　グレー#444）　*/

.arrow_nolink{
  position: relative;
  display: inline-block;
  padding: 0 0 0 16px;
  color: #444;
  vertical-align: middle;
  text-decoration: none;
 margin-right:7px;

}

.arrow_nolink::before{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  box-sizing: border-box;
  width: 15px;
  height: 15px;
  border: 1px solid #444;

}

.arrow_nolink::after{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  left: 5px;
  box-sizing: border-box;
  width: 5px;
  height: 5px;
  border: 5px solid transparent;
  border-left: 5px solid #444;

}






/*フッター　共通 (page_footer.html)
----------------------------------------------------------- */
.page_footer{
display:inline;
}


.footer_area{
background-color:#444;
color:#fff;
}

.footer_contents{
margin-top:20px;
padding-top:20px;
padding-bottom:30px;
width:1200px;
margin:0 auto;
text-align:center;
}

.footer_contents ul{
width:750px;
margin:0 auto;
}

.footer_contents li{
display:inline;
float:left;
list-style: none;
width:150px;
}

.footer_contents li a{
text-decoration:none;
color:#fff;
}

.footer_credit{
margin-top:30px;
font-size:12px;
}

/*タブレット(1200）*/ 
@media only screen and (max-width:1200px){

.footer_contents{
width:500px;
}

.footer_contents ul{
width:150px;
}

.footer_contents li{
width:150px;
line-height:40px;
}

}/*タブレット(1200）ここまで*/ 

/*スマホ(480）*/ 
@media only screen and (max-width:480px){

.footer_contents{
width:100%;
}

.footer_contents ul{
width:150px;
}

.footer_contents li{
width:150px;
line-height:40px;
}

}/*スマホ(480）ここまで*/ 



