@charset "utf-8";

/* =========================================================
 「画像拡大」スタイル調整
========================================================= */
div.box_01 div.expansion{
	float:none!important;
	display:inline;
	padding-top:1px;
	padding-bottom:1px;
}

/* =========================================================
 画像レイアウトの画像横幅パターン
========================================================= */
div.box_01 .image-R130 .img_block{
	width:17%;
}

div.box_01 .image-R130 .txt_block{
	width:81%;
}

div.box_01 .image-R230 .img_block{
	width:30.1%;
}

div.box_01 .image-R230 .txt_block{
	width:67.9%;
}

/* =========================================================
 画像単体横幅可変用スタイル
========================================================= */
div.box_01 .img_variable{
	width: auto;
	margin-bottom:20px;
}

div.box_01 .img_variable a img{
	width:auto;
    opacity: 1!important;
}

div.box_01 .img_variable a:hover img{
    border: 2px solid #367eb3;
    margin: -2px;
}


/* =========================================================
 注釈リストモジュール追加
========================================================= */
div.box_01 ul.list-notice-01{
	width:100%;
	margin-bottom:13px;
}

div.box_01 ul.list-notice-01 li{
	padding:0 0 0 26px;
	position:relative;
	zoom:1;
	/display:inline-block;
	font-size:93%;
	color:#333;
}

div.box_01 ul.list-notice-01 span{
	position:absolute;
	left:0;
	top:0;
}


/* =========================================================
 商品画像2、3カラム用モジュール追加
========================================================= */
div.box_01 ul.news-col2{
	text-align:center;
}

div.box_01 ul.news-col2 li{
	display:inline-block;
	/display:inline;
	word-spacing:0;
	zoom:1;
	position:relative;
}

div.box_01 ul.news-col2 li{
	margin:0 20px 0 0;
}

div.box_01 ul.news-col2 li .img_link01{
	width:252px!important;
}

div.box_01 ul.news-col3 li{
	width: 31.222222%;
	margin-right:20px;
	display:inline-block;
	/display:inline;
}

div.box_01 ul.news-col2 li:last-child,
div.box_01 ul.news-col3 li:last-child,
div.box_01 ul.news-col4 li:last-child{
	margin-right:0;
}

div.box_01 ul.news-col3 li .img_link01,
div.box_01 ul.news-col4 li .img_link01{
	width: auto;
}

div.box_01 ul.news-col4 li{
	width: 22.6%;
	margin-right:20px;
	display:inline-block;
	/display:inline;
}


/* =========================================================
 テーブルのカラム幅調用クラス
========================================================= */
div.box_01 table.w-full{width:100%;}
div.box_01 table.w-half{width:50%;}
div.box_01 table.w-col6{width:17%;}
div.box_01 table .w-10{width:10%;}
div.box_01 table .w-15{width:15%;}
div.box_01 table .w-20{width:20%;}
div.box_01 table .w-25{width:25%;}
div.box_01 table .w-30{width:30%;}
div.box_01 table .w-35{width:35%;}
div.box_01 table .w-40{width:40%;}
div.box_01 table .w-45{width:45%;}
div.box_01 table .w-50{width:50%;}


/* =========================================================
 テーブルデザイン調整用クラス
========================================================= */
div.box_01 table td.plane{
	font-weight:normal!important;
	background:#fff!important;
}

div.box_01 table td.b-r-non{
	border-right:none!important;
}

div.box_01 table td.b-l-non{
	border-left:none!important;
}


/* =========================================================
 固定幅画像の可変化用クラス
========================================================= */
div.box_01 img.imgSize-fix{width:252px!important;}
div.me dl dt{width:24%!important;}
div.me dl dd{width:72.5%!important;}


/* =========================================================
 中央寄せ
========================================================= */
div.box_01 .align-C{
	text-align:center!important;
}

/* =========================================================
 左寄せ
========================================================= */
div.box_01 .align-L{
	text-align:left!important;
}


/* =========================================================
 インライン化
========================================================= */
div.box_01 .inline{
	display:inline!important;
}


/* =========================================================
 英文の「word-break:break-all;」対応用class
========================================================= */
div.box_01 .en-break{
	word-break:break-all;
}


/* =========================================================
　共通CSSのカラー上書き
========================================================= */
div.box_01 .liststyle02 ul li a {
	color: #367eb3;
}

.paragraph,
.paragraph02,
.liststyle02,
.liststyle06,
.paragraph_right,
.boxstyle04 .box_wrap .txt_box,
.boxstyle04 .post,
table{
	color: #333;
}

/* =========================================================
　通常リストモジュール（中黒）
========================================================= */
.liststyleDot ul li{
	background:url("/common/images/icon_013.gif") no-repeat left 0.4em;
    font-size: 93%;
    line-height: 21px;
    padding-left: 15px;
    color: #333;
}

/* =========================================================
　入れ子リストのスタイル調整
========================================================= */
.liststyleDot ul li ul li{
    font-size:100%;
}

.liststyle02 .liststyle03pl ol li,
.liststyleDot .liststyle03pl ol li{
	font-size: 100%;
	background: none;
	margin-left:10px; 
}

.liststyle02 .list-notice-01 li,
.liststyleDot .list-notice-01 li{
	background: none;
}

.align-C > .img_block{
	display:inline-block;
	margin:10px;
}

.align-L > .img_block{
	display:inline-block;
	margin:10px 20px 0 0;
}

.liststyle06 .liststyle03pl ol li,
.liststyle06 .liststyle02 ul li,
.liststyle06 .liststyle04 ul li,
.liststyle06 ul.list-notice-01 li,
.liststyle06 dd div.paragraph p,
.liststyle02 ul.list-notice-01 li,
.liststyleDot ul.list-notice-01 li{
	font-size: 100%!important;
}

.liststyle06 .tablearea01 table{
	width:auto;
}

.liststyle06 .tablearea01 table th,
.liststyle06 .tablearea01 table td,{
	font-size: 100%;
}

.liststyle02 .liststyle04 ul li,
.liststyleDot .liststyle04 ul li{
    background:url("/common/images/icon_006.gif") no-repeat scroll left 0.5em;
    font-size: 100%;
}


.liststyle03p .liststyle02 li,
.liststyle03p .liststyleDot li{
	font-size: 100%;
	margin-left:0;
	padding-left: 20px;
	text-indent: 0;
}

.liststyle03p .list-notice-01 li{
	font-size: 100%!important;
	text-indent: 0;
	margin-left:0;
}

.liststyle03p .liststyle04 li{
	font-size: 100%;
	margin-left:0;
	padding-left: 20px;
	text-indent: 0;
}

.liststyle03p .liststyle03pl li{
	font-size: 100%;
	margin-left:0;
}


/* =========================================================
　ボックス > 画像右レイアウト追加
========================================================= */
.boxstyle04 .box_wrap.right .img_box {
    float: right;
    margin-left: 2%;
    margin-right: 0;
}

.boxstyle04 .box_wrap.right .txt_box {
    float: right;
}

.boxstyle04 div.image-R .img_box{
	float:right;
	margin-right:0;
}


/* =========================================================
 ボックス内の画像レイアウト使用時用Padding調整
========================================================= */
.boxstyle04 > .box_inner > .box_wrap.pd0{
	padding:0 0 0 0;
}

/* =========================================================
 コンテンツ上部お詫び文掲載
========================================================= */
div.box_01 div.expansion{
	float:none!important;
	display:inline;
	padding-top:1px;
	padding-bottom:1px;
}

div.obstacle .obstacle-inner{
	padding:10px;
	margin:20px 0;
	border:1px solid #f00000;
}

div.obstacle .obstacle-inner p{
	font-weight: bold;
	color: #ff0000;
}

div.obstacle .obstacle-inner p.date{
	text-align:right;
}


/* =========================================================
 メディアクエリ
========================================================= */
@media screen and (max-width: 960px){
	div.box_01 ul.news-col3,
	div.box_01 ul.news-col4{
		text-align:center;
	}

	div.box_01 ul.news-col3 li{
		width: 29.55555%;
	}

	div.box_01 ul.news-col4 li{
		width: 21.444444%;
	}
}

@media screen and (max-width: 768px){
	h1.h1_style02{
		width:auto!important;
	}
	div.box_01 .boxstyle04{
		margin-top:20px;
	}

	div.obstacle{
		margin:0 15px;
	}
}

@media screen and (max-width: 680px){
	div.box_01 div.liststyle06 dl dt span{
		background:none;
	}

	div.tablearea01 table.w-half{width:100%;}
	div.tablearea01 table.w-col6{width:100%;}

	div.box_01 ul.news-col4 li{
		width: 46%;
	}

	div.box_01 ul.news-col4 li:nth-of-type(2n){
		margin-right:0;
	}
	.align-L > .img_block{
		display:inline-block;
		margin:10px 10px 10px 10px;
	}
}

@media screen and (max-width:640px){
	div.obstacle{
		margin:0 0;
	}
}


@media screen and (max-width: 480px){
	div.box_01 div.box_wrap .img_box{
		float:none!important;
		width:100%!important;
		margin-bottom:20px;
	}

	div.box_01 div.box_wrap .txt_box{
		float:none!important;
		width:100%!important;
	}

	div.box_01 ul.news-col2 li .img_link01{
		width:auto!important;
	}

	div.box_01 ul.news-col2 li,
	div.box_01 ul.news-col3 li,
	div.box_01 ul.news-col4 li{
		width: auto;
		float: none;
		margin-right:0;
	}

	/*画像レイアウトfloat解除*/
	.img_right.sp-col1 .txt_block{
		width: auto!important;
		float: none;
		margin:0 0 0 0;
	}

	.img_right.sp-col1 .img_block{
		width: 100%!important;
		float: none;
		text-align:center;
		margin:0 0 0 0;
	}
	.img_right.sp-col1 .img_block img{
		width: auto;
		display: inline;
	}
}