@charset "utf-8";
	
		/*listブロック
		---------------------------------------------------------------------------*/
		/*ブロック全体*/
		.list {
			overflow: hidden;position: relative;
			border-top: 1px solid #ccc;	/*上の線の幅、線種、色*/
			padding: 10px 20px 25px;	/*上、左右、下へのボックス内の余白*/
			line-height: 1.5;			/*行間を少し狭く*/
		}
		/*最後のブロックに下線を入れる*/
		.list:last-of-type {
			border-bottom: 1px solid #ccc;	/*下の線の幅、線種、色*/
		}
		/*ブロック内の画像*/
		.list p.img {
			padding: 0px !important;
			float: left;		/*左に回り込み*/
			width: 15%;			/*画像の幅*/
			margin-right: 1%;	/*画像の右側へ空けるスペース*/
		}
		
		/*右側ブロック*/
		.list .text {
			float: right;	/*ブロックを右寄せ*/
			width: 83%;		/*幅*/
		}
		
		
		/*ブロック内の段落(p)タグ*/
		.list p {
			padding: 0 !important; 
		}
		/*ブロック内の見出し(h4)*/
		.list h4 {
			font-size: 20px;	/*文字サイズ*/
		}
		/*ブロック内の見出し(h4)にリンクを貼った場合の設定*/
		.list h4 a {
			color: #d5000a;		/*文字色*/
		}
		/*ボックス内のサイト名*/
		.list p.name {
			position: absolute;
			right: 20px;	/*ボックスの右から20pxの場所に配置*/
			bottom: 5px;	/*ボックスの下から5pxの場所に配置*/
		}
		/*３列タイプ(list-compact)のブロック
		---------------------------------------------------------------------------*/
		/*各ボックスの設定*/
		.list-compact {
			position: relative;overflow: hidden;
			margin: 1%;			/*ボックスの外側に空けるスペース*/
			float: left;		/*左に回り込み*/
			width: 30%;			/*幅*/
			height: 300px;		/*高さ*/
			font-size: 12px;	/*文字サイズ*/
			line-height: 1.5;	/*行間を少し狭くする*/
		}
		/*ボックス内のh4タグ設定*/
		.list-compact h4,.list-compact h4 a {
			font-weight: bold;	/*太字にする*/
			height: 1.5em;		/*高さ*/
			overflow: hidden;	/*高さ以上になったら非表示にする*/
		}
		/*ボックス内のp(段落)タグ設定*/
		.list-compact p {
			padding: 0px !important;
			height: 3em;		/*高さ*/
			overflow: hidden;	/*高さ以上になったら非表示にする*/
		}
		/*画像を共通サイズにする設定*/
		.list-compact p.img {
			width: 60%;	/*幅*/
			height: 60%;	/*高さ*/
		}
		.list-compact img {width: 100%;height: 100%;}
		/*ボックス内のサイト名*/
		.list-compact p.name {
			height: auto;
		}
		
		
		/*一覧ページの各物件ボックス内のテーブル
		---------------------------------------------------------------------------*/
		.list table.c2 {
			font-size: 12px;	/*文字サイズ*/
			width: 100%;		/*テーブル幅*/
			margin-bottom: 5px;
		}
		.list table.c2,
		.list table.c2 td,
		.list table.c2 th {
			border: 1px solid #dcdcdc;	/*枠線の幅、線種、色*/
		}
		.list table.c2 td,
		.list table.c2 th {
			padding: 1%;	/*テーブル内の余白*/
		}
		.list table.c2 th {
			width: 20%;		/*幅*/
			background: #fafafa;	/*背景色*/
		}
		.list table.c2 td {
			width: 30%;		/*幅*/
		}
		
		/*list2ボックス（２列並びのボックス）
		---------------------------------------------------------------------------*/
		/*ボックス全体の設定*/
		.list2 {
			overflow: hidden;
		}
		/*各ボックスの設定*/
		.list2 li {
			float: left;		/*左に回り込み*/
			width: 49%;			/*幅*/
			line-height: 1.5;	/*行間*/
			margin: 0px 0.5% 20px;	/*上、左右、下へのボックスの外側へ空けるスペース*/
		}
		.list2 a {
			display: block;text-decoration: none;
			height: 65px;		/*ボックスの高さ*/
			overflow: hidden;	/*ボックスから飛び出た場合、非表示にする設定*/
			border-radius: 10px;	/*角丸のサイズ*/
			padding: 15px;			/*ボックス内の余白*/
			border: 1px solid #ccc;	/*枠線の幅、線種、色*/
			background: linear-gradient(#fff, #f2f2f2);/*背景グラデーション*/
			box-shadow: 2px 2px 3px rgba(0,0,0,0.1);	/*ボックスの影。右へ、下へ、ぼかし幅、0,0,0は黒の事で0.1は10%色がついた状態の事。*/
		}
		/*マウスオン時*/
		.list2 a:hover {
			background: #fff;	/*背景色*/
			box-shadow: none;	/*ボックスの影をなくす設定*/
			position: relative;
			left: 1px;	/*現在地から右に1px移動する*/
			top: 1px;	/*現在地から下に1px移動する*/
		}
		/*ボックス内の画像。※imgタグにclass="img"をつけた場合。*/
		.list2 .img {
			height: 100%;	/*高さ*/
			float: right;	/*右に回り込み*/
		}
		/*件数のテキスト。※list2内でspanタグで囲った場合。*/
		.list2 span {
			font-size: 28px;	/*文字サイズ*/
			color: #d5000a;		/*文字色*/
		}
		
		/*sub,sideコンテンツ内のlist-subボックス
		---------------------------------------------------------------------------*/
		/*ボックス１個あたりの設定*/
		.list-sub {
			position: relative;overflow: hidden;
			border-left: 1px solid #8c876c;		/*左の線の線種、幅、色*/
			border-right: 1px solid #8c876c;	/*右の線の線種、幅、色*/
			border-bottom: 1px solid #8c876c;	/*下の線の線種、幅、色*/
			line-height: 1.5;					/*行間を少し狭くする。基本となる値は一番上のbodyにあります。*/
			font-size: 12px;					/*文字サイズ*/
			background: #fff;	/*背景色*/
		}
		.list-sub a {
			display: block;text-decoration: none;overflow: hidden;
			padding: 5px;		/*ボックス内の余白*/
			background: #fff;	/*背景色*/
		}
		/*マウスオン時のボックス*/
		.list-sub a:hover {
			/*background: #fffee1;	背景色*/
		}
		/*h4タグ*/
		.list-sub a h4 {
			font-weight: bold;	/*太字にする設定*/
		}
		/*段落(p)タグ*/
		.list-sub p {
			padding: 0 !important;
		}
		/*画像（サイドコンテンツの「お知らせ」内のサムネイル画像）*/
		.list-sub .img.t {
			width: 25%;			/*画像の幅*/
			float: left;		/*左に回り込み*/
			margin-right: 10px;	/*画像右側に空ける余白*/
		}
		/*他、微調整*/
		section .list-sub:last-of-type {margin-bottom: 20px;}
		.box1 .list-sub:last-of-type {margin-bottom: 0;}
		
		/*サイト名　淹れ方などアイコン特集（name）
		---------------------------------------------------------------------------*/
		.house {
			overflow: hidden;
			font-size: 15px !important;	/*文字サイズ*/
			background: url(https://img02.shop-pro.jp/PA01099/179/etc/icon_home.png?cmsp_timestamp=20190806104813) no-repeat left center/15px;
			padding-left: 15px !important;
		}
		.spoon {
			overflow: hidden;
			font-size: 15px !important;	/*文字サイズ*/
			background: url(https://img02.shop-pro.jp/PA01099/179/etc/icon_spoon.png?cmsp_timestamp=20190806104835) no-repeat left center/15px;
			padding-left: 15px !important;
		}
		.cup {
			overflow: hidden;
			font-size: 15px !important;	/*文字サイズ*/
			background: url(https://img02.shop-pro.jp/PA01099/179/etc/icon_cup.png?cmsp_timestamp=20190806104850) no-repeat left center/15px;
			padding-left: 15px !important;
		}
		.thermo {
			overflow: hidden;
			font-size: 15px !important;	/*文字サイズ*/
			background: url(https://img02.shop-pro.jp/PA01099/179/etc/icon_thermo.png?cmsp_timestamp=20190806104911) no-repeat left center/15px;
			padding-left: 15px !important;
		}
		.clock {
			overflow: hidden;
			font-size: 15px !important;	/*文字サイズ*/
			background: url(https://img02.shop-pro.jp/PA01099/179/etc/icon_clock.png?cmsp_timestamp=20190806104929) no-repeat left center/15px;
			padding-left: 15px !important;
		}
		.times {
			overflow: hidden;
			font-size: 15px !important;	/*文字サイズ*/
			background: url(https://img02.shop-pro.jp/PA01099/179/etc/icon_times.png?cmsp_timestamp=20190806104947) no-repeat left center/15px;
			padding-left: 15px !important;
		}
		.teapot {
			overflow: hidden;
			font-size: 15px !important;	/*文字サイズ*/
			background: url(https://img02.shop-pro.jp/PA01099/179/etc/icon_teapot.png?cmsp_timestamp=20190806105013) no-repeat left center/15px;
			padding-left: 15px !important;
		}
		
		
		/*画面幅1000px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:1000px){
		
		/*３列タイプ(list-compact)のブロック
		---------------------------------------------------------------------------*/
		/*画像を共通サイズにする設定*/
		.list-compact p.img {
		height:40%;	/*高さ*/	
		}
		
		}
		
		
		
		/*画面幅900px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:900px){
		
		/*４列タイプ(list-compact)のブロック
		---------------------------------------------------------------------------*/
		/*画像を共通サイズにする設定*/
		.list-compact p.img {
			height:50%;	/*高さ*/
				}
		
		/*sub,sideコンテンツ内のlist-subボックス
		---------------------------------------------------------------------------*/
		/*画像（サイドコンテンツの全ての画像を共通で変更）*/
		.list-sub .img {
			width: 25%;			/*画像の幅*/
			float: left;		/*左に回り込み*/
			margin-right: 10px;	/*画像右側に空ける余白*/
		}
		
		}
		
		
		
		/*画面幅750px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:750px){
		
		/*３列タイプ(list-compact)のブロック
		---------------------------------------------------------------------------*/
		/*画像を共通サイズにする設定*/
		.list-compact p.img {
			height:30％;	/*高さ*/
		}
		
		}
		
		
		
		/*画面幅600px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:600px){
		
		/*３列タイプ(list-compact)のブロック
		---------------------------------------------------------------------------*/
		/*各ボックスの設定*/
		.list-compact {
			float: none;
			width: auto;
			height: auto;
		}
		/*ボックス内のh4タグと、p(段落)タグ設定*/
		.list-compact h4,.list-compact h4 a, .list-compact p, .list-compact p.img, .list-compact img {
			height: auto;
		}
		.list-compact p.img {
			float: left;
			width: 25%;
			margin-right: 2%;
		}
		
		}
		
		
		
		/*画面幅480px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:480px){
		
		/*一覧ページのボックス内の右上のマーク
		（CMSの場合は管理ページだと「オプション1」〜のプルダウン、setup.phpだと「オプション選択肢」に関連します）
		---------------------------------------------------------------------------*/
		/*option1?option2、と、newアイコン共通（初期設定）*/
		.option1,.option2,.new {
			transform: rotate(45deg) translate(45px,-25px);	/*45度回転、右へ,下へ(マイナス設定なので上へ向けての指定)の移動距離*/
		}
		
		/*listブロック
		---------------------------------------------------------------------------*/
		/*ブロック全体*/
		.list {
			padding: 5px 10px 25px;	/*上、左右、下へのブロック内の余白*/
		}
		/*ブロック内の見出し(h4)*/
		.list h4 {
			font-size: 16px;	/*文字サイズ*/
		}
		
		/*list2ボックス（２列並びのボックス）
		---------------------------------------------------------------------------*/
		/*各ボックスの設定*/
		.list2 a {
			padding: 5px 10px;	/*上下、左右へのボックス内の余白*/
		}
		/*件数のテキスト。※list2内でspanタグで囲った場合。*/
		.list2 span {
			font-size: 18px;	/*文字サイズ*/
		}
		
		}
		
		
		
		/*画面幅360px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:360px){
		
		/*list2ボックス（２列並びのボックス）
		---------------------------------------------------------------------------*/
		/*各ボックスの設定*/
		.list2 li {
			float: none;width: auto;	/*１列にする設定*/
			margin: 0 0 10px;	/*上、左右、下に空けるボックスの外側の余白。*/
		}
		.list2 li a {
			height: auto;
		}
		/*ボックス内の画像。※imgタグにclass="img"をつけた場合。*/
		.list2 .img {
			height: auto;	/*高さをリセット*/
			width: 20%;		/*幅の指定に変更*/
		}
		
		}
		
			
		
		/*全端末（PC・タブレット・スマホ）共通設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		
		/*全体の設定
		---------------------------------------------------------------------------*/
		body {
			margin: 0px;
			padding: 0px;
			color: #333;	/*全体の文字色*/
			font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
			font-size: 16px;	/*文字サイズ*/
			line-height: 2;		/*行間*/
			background: #fff;	/*背景色*/
			-webkit-text-size-adjust: none;
		}
		h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,figure,form,select,input,textarea {margin: 0px;padding: 0px;font-size: 100%;font-weight: normal;}
		ul {list-style-type: none;}
		img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
		table {border-collapse:collapse;font-size: 100%;border-spacing: 0;}
		iframe {width: 100%;}
		video,audio {max-width: 100%;}
		
		/*リンク（全般）設定
		---------------------------------------------------------------------------*/
		a {
			color: #333;		/*リンクテキストの色*/
			transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
		}
		a:hover {
			color: #009999;			/*マウスオン時の文字色*/
			text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
		}
		/*マウスオン時の画像*/
		a:hover img {
			opacity: 0.8;	/*80%色がついた状態*/
		}
		
		/*inner共通
		---------------------------------------------------------------------------*/
		.inner {
			max-width: 1300px;	/*サイトの最大幅*/
			margin: 0 auto;
		}
		
		/*ヘッダー（ロゴが入った最上段のブロック）
		---------------------------------------------------------------------------*/
		/*ヘッダーブロック*/
		header {
			background: #fff;	/*背景色*/
			height: 100px;		/*高さ*/
			color: #333;		/*文字色*/
		}
		/*ロゴ画像*/
		header #logo {
			width: 500px;		/*ロゴ画像の幅*/
			float: left;		/*左に回り込み*/
			margin-top: 30px;	/*ロゴの上にあける余白。ヘッダー内の上下の配置バランスをここで調整して下さい。*/
			margin-left: 3%;	/*ロゴの左側にあける余白。*/
		}
		
		/*ログイン（ヘッダー右側のログイン）
		---------------------------------------------------------------------------*/
		header .login a {
			display: inline-block;text-decoration: none;
			float: right;		/*右に回り込み*/
			margin-right: 3%;	/*右に空けるスペース*/
			margin-top: 30px;	/*上に空けるスペース。ヘッダー内の上下の配置バランスをここで調整して下さい。*/
			border: 1px solid #fe7200;	/*枠線の幅、線種、色*/
			background: #fe7200;/*背景色（古いブラウザ用）*/
			background: #fe7200 url(https://img02.shop-pro.jp/PA01099/179/etc/icon_login.png?cmsp_timestamp=20190730162427) no-repeat 15px 8px / 20px;/*背景色、アイコンの読み込み。左から15px、上から8pxの場所に配置。画像幅は20px。*/
			color: #fff;	/*文字色*/
			padding: 5px 30px 5px 50px;	/*上、右、下、左へのボタン内の余白*/
			border-radius: 4px;		/*角丸のサイズ*/
			font-size: 14px;		/*文字サイズ*/
			box-shadow: 1px 1px 2px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅*/
			letter-spacing: 0.2em;	/*文字間隔を少し広くとる指定*/
		}
		/*マウスオン時*/
		header .login a:hover {
			background-color: #fe9b00;	/*背景色だけ変更する*/
			color: #fff;	/*も地色*/
		}
		
		/*メインメニューのブロック
		---------------------------------------------------------------------------*/
		/*メニューブロック*/
		#menubar {
			clear: both;
			height: 55px;		/*メニューの高さ。下の「#menubar ul li a」の「height」と「padding-top」の数字を合計した数字に合わせる。*/
			text-align: center;	/*文字を中央に*/
			background: #99cccc;	/*背景色*/
			background: linear-gradient(#99CC99,#009999);	/*背景グラデーション*/
			border-bottom: 1px solid #fff;	/*下線の幅、線種、色*/
		}
		/*メニュー１個あたりの設定*/
		#menubar li {
			float: left;	/*左に回り込み*/
			width: 16.66%;	/*メニュー幅（100÷6個=16.66%）　もし４個にするなら100÷4=25%になる。*/
		}
		#menubar li a {
			text-decoration: none;display: block;
			line-height: 1.6;	/*行間を少し狭く*/
			color: #fff;		/*文字色*/
			height: 45px;		/*高さ*/
			padding-top: 10px;	/*上に追加する余白*/
			border-right: 1px solid #fff;	/*メニューの右側の線の幅、線種、色（古いブラウザ用）*/
			border-right: 1px solid rgba(255,255,255,0.5);	/*右の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
		}
		/*１つ目のメニューへの追加設定*/
		#menubar li:first-child a {
			border-left: 1px solid #fff;	/*メニューの線の幅、線種、色（古いブラウザ用）*/
			border-left: 1px solid rgba(255,255,255,0.5);	/*左の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
		}
		/*飾り文字*/
		#menubar li span {
			display: block;
			font-size: 9px;			/*文字サイズ*/
			font-weight: normal;	/*文字を太字でなく標準に戻す設定*/
			letter-spacing: 0.2em;	/*文字間隔を少しあける設定*/
			opacity: 0.5;			/*透明度50％*/
		}
		/*マウスオン時と、現在表示中(current)のメニューの設定*/
		#menubar li a:hover, #menubar li.current a {
			background: #e8424a;	/*背景色*/
		}
		/*スマホ用メニューを表示させない*/
		#menubar-s {display: none;}
		/*３本バーアイコンを表示させない*/
		#menubar_hdr {display: none;}
		
		/*ドロップダウンメニュー用
		----------------------------------------------------------------------------------------------------------------------------------*/
		/*メニューブロック*/
		#menubar ul.ddmenu {
			position:absolute;visibility: hidden;z-index: 10;padding-top: 1px;
			width: 16.66%;		/*幅。上の「#menubar li」と合わせる。*/
			font-size: 12px;	/*文字サイズ*/
		}
		/*メニュー１個あたりの設定*/
		#menubar ul.ddmenu li {
			float: none;
			width: 100%;
		}
		#menubar ul.ddmenu li a {
			width: 100%;height: auto;font-weight: normal;
			border: none;	/*線を一旦リセット*/
			border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
			background: #000;	/*背景色（古いブラウザ用）*/
			background: rgba(0,0,0,0.7);	/*背景色。0,0,0は黒の事で0.7は70%色がついた状態の事。*/
			color: #fff;		/*文字色*/
			padding: 10px 0;	/*上下、左右への余白*/
		}
		/*マウスオン時*/
		#menubar ul.ddmenu li a:hover {
			background: #000;	/*背景色*/
		}
		
		/*fixmenu設定（メニューが画面上部に到達した際のスタイル）
		---------------------------------------------------------------------------*/
		/*上部固定メニュー用fixmenu設定*/
		body.is-fixed-menu .nav-fix-pos {
			width: 100%;z-index: 100;position: fixed;top: 0;left: 0;
		}
		body.is-fixed-menu header {
			margin-bottom: 75px;	/*メニューの高さを指定。menubarのborderが1px分ありますが大差ないので75でOKです。*/
		}
		/*上の設定の「is-fixed-menu」を「is-fixed」に変更したものをそのまま記入します。fixmenuスクリプトを２つ使う為に必要な設定になります。*/
		body.is-fixed .nav-fix-pos {
			width: 100%;z-index: 100;position: fixed;top: 0;left: 0;
		}
		body.is-fixed header {
			margin-bottom: 75px;
		}
		
		/*contents（３カラムを囲むブロック）
		---------------------------------------------------------------------------*/
		#contents {
			clear: both;overflow: hidden;
			padding-top: 40px;		/*上に空けるボックス内の余白*/
			padding-bottom: 40px;	/*下に空けるボックス内の余白*/
		}
		
		/*contents-in（mainとsubを囲むブロック）
		---------------------------------------------------------------------------*/
		#contents-in {
			float: left;	/*左に回り込み*/
			width: 80%;		/*ブロックの幅*/
		}
		/*２カラム時*/
		.c2 #contents-in {
			float: none;
			width: auto;
		}
		
		/*mainコンテンツ（中央のブロック）
		---------------------------------------------------------------------------*/
		#main {
			float: right;	/*右に回り込み*/
			width: 75%;		/*ブロックの幅*/
		}
		/*mainコンテンツのh2タグ設定*/
		#main h2 {
			clear: both;
			margin-bottom: 20px;
			padding: 10px 20px;	/*上下、左右への余白*/
			font-size: 18px;	/*文字サイズ*/
			color: #fff;		/*文字色*/
			background: #99cccc;	/*背景色*/
			background: linear-gradient(#99CC99,#009999);	/*背景グラデーション*/
		}
		/*h2タグの１文字目への追加設定*/
		#main h2::first-letter {
			border-left: 3px solid #fff;	/*左の線の幅、線種、色*/
			padding-left: 15px;				/*線とテキストとの余白*/
		}
		/*mainコンテンツのh3タグ設定*/
		#main h3 {
			clear: both;
			margin-bottom: 20px;
			padding: 4px 20px;	/*上下、左右への余白*/
			font-size: 16px;	/*文字サイズ*/
			border: 1px solid #ccc;		/*枠線の幅、線種、色*/
		}
		/*h3タグの１文字目への追加設定*/
		#main h3::first-letter {
			border-left: 3px solid #99cccc;	/*左の線の幅、線種、色*/
			padding-left: 15px;				/*線とテキストとの余白*/
		}
		/*mainコンテンツのh6タグ設定*/
		#main h6 {
			clear: both;
			margin-bottom: 20px;
			padding: 4px 20px;	/*上下、左右への余白*/
			font-size: 16px;	/*文字サイズ*/
			border: 1px solid #ccc;		/*枠線の幅、線種、色*/
		}
		/*h6タグの１文字目への追加設定*/
		#main h6::first-letter {
			border-left: 24px solid #cc0000;	/*左の線の幅、線種、色*/
			padding-left: 15px;				/*線とテキストとの余白*/
		}
		/*mainコンテンツの段落タグ設定*/
		#main p {
			padding: 0px 20px 20px;	/*上、左右、下への余白*/
		}
		/*他。微調整。*/
		#main p + p {
			margin-top: -5px;
		}
		#main h2 + p,
		#main h3 + p {
			margin-top: -10px;
		}
		#main section + section {
			margin-top: 30px;
		}
		
		/*subコンテンツ（左側のブロック）
		---------------------------------------------------------------------------*/
		#sub {
			float: left;	/*左に回り込み*/
			width: 22.5%;	/*ブロックの幅*/
		}
		
		/*sideコンテンツ（右側のブロック）
		---------------------------------------------------------------------------*/
		#side {
			float: right;	/*右に回り込み*/
			width: 18%;		/*ブロックの幅*/
		}
		/*２カラム時*/
		.c2 #side {
			display: none;	
		}
		
		/*sub,side共通設定
		---------------------------------------------------------------------------*/
		/*h2見出しタグ設定*/
		#sub h2,
		#side h2 {
			text-align: center;		/*文字をセンタリング*/
			padding: 8px 0px;		/*上下、左右への余白*/
			color: #fff;			/*文字色*/
			background: #660033;	/*背景色（古いブラウザ用）*/
			background: linear-gradient(#FF9966,#660033);	/*背景グラデーション*/
		}
		
		
		
		/*段落タグ（p）設定*/
		#sub p,#side p {
			line-height: 1.6;	/*行間を少し狭く*/
		}
		
		/*box1設定（sub,sideで使っています）
		---------------------------------------------------------------------------*/
		/*box1設定*/
		#sub .box1,
		#side .box1 {
			border: 1px solid #8c876c;	/*枠線の幅、線種、色*/
			padding: 10px;			/*ボックス内の余白*/
			margin-bottom: 20px;	/*ボックスの下にあけるスペース*/
			background: #FFFFFC	/*背景色*/
		}
		/*box1の中にsubmenuがある場合の下のmarginをなくす*/
		.box1 .submenu {
			margin-bottom: 0 !important;
		}
		
		/*submenu（sub,sideのメニュー）
		---------------------------------------------------------------------------*/
		/*メニューブロック全体の設定*/
		#sub .submenu,
		#side .submenu {
			margin-bottom: 20px;		/*メニューブロックの下にあけるスペース*/
			border-top: 1px solid #8c876c;	/*上の線の幅、線種、色*/
		}
		/*メニュー１個ごとの設定*/
		#sub .submenu li a,
		#side .submenu li a {
			text-decoration: none;display: block;
			padding: 0 10px;		/*上下、左右のボックス内の余白*/
			border: 1px solid #8c876c;	/*枠線の幅、線種、色*/
			border-top: none;		/*上の線を消す設定*/
			background: #fff;		/*背景色*/
		}
		
		/*フッター設定
		---------------------------------------------------------------------------*/
		footer {
			clear: both;
			background: #99cccc;	/*背景色*/
			background: linear-gradient(#99CC99,#009999);	/*背景グラデーション*/
			font-size: 85%;			/*文字サイズ*/
			color: #fff;			/*文字色*/
		}
		footer a, footer a:hover {
			color: #fff;	/*リンクテキスト、マウスオン時の文字色*/
		}
		footer .pr {display: block;font-size: 80%;}
		
		/*フッターメニュー
		---------------------------------------------------------------------------*/
		/*ボックス全体*/
		#footermenu {
			overflow: hidden;
			padding: 20px 0;	/*上下、左右へのボックス内の余白*/
			font-size: 12px;	/*文字サイズを少し小さく*/
		}
		/*１列分の設定*/
		#footermenu ul {
			float: left;	/*左に回り込み*/
			width: 18%;		/*幅。今回は5列作ったのでここの幅18%と下のpadding(合計の2%)でトータル20%になるよう設定。列に応じて調整して下さい。*/
			padding-right: 1%;
			padding-left: 1%;
		}
		/*メニュー１個あたりの設定*/
		#footermenu ul li {
			padding: 0 10px;	/*上下、左右への余白*/
		}
		/*見出し*/
		#footermenu li.title {
			font-weight: bold;	/*太字にする*/
			background: rgba(0,0,0,0.1);	/*背景色*/
			border-radius: 2px;	/*角丸のサイズ*/
		}
		/*リンクテキスト*/
		#footermenu a {
			text-decoration: none;
			opacity: 0.7;	/*透明度。70%色がでた状態の事。*/
		}
		/*マウスオン時*/
		#footermenu a:hover {
			opacity: 1;	/*透明度。100%色がでた状態の事。*/
		}
		
		/*コピーライト
		---------------------------------------------------------------------------*/
		#copyright {
			clear: both;
			text-align: center;
			background: #333;	/*背景色*/
		}
		#copyright a {text-decoration: none;}
		
		/*トップページ内「更新情報・お知らせ」ブロック
		---------------------------------------------------------------------------*/
		/*ブロック全体の設定*/
		#new dl {
			padding: 0px 20px;	/*上下、左右へのブロック内の余白*/
			margin-bottom: 20px;	/*ブロックの下(外側)に空ける余白*/
		}
		/*日付設定*/
		#new dt {
			float: left;
			width: 9em;
			letter-spacing: 0.1em;
		}
		/*記事設定*/
		#new dd {
			padding-left: 9em;
			border-bottom: 1px solid #ccc;	/*下線の幅、線種、色*/
		}
		
		/*特定商取引ページ
		---------------------------------------------------------------------------*/
		/*見出しと説明のボックス全体を囲むブロック*/
		.law {
			padding: 0 20px 10px;	/*上、左右、下へのボックス内余白*/
		}
		/*見出し*/
		.law dt {
			font-weight: bold;	/*太字にする設定*/
			color: #99cccc;		/*文字色*/
		}
		/*説明*/
		.law dd {
			padding-bottom: 10px;	/*下に空けるスペース*/
		}
					
		
		/*PAGE TOP（↑）設定
		---------------------------------------------------------------------------*/
		/*アニメーションのキーフレーム設定（変更不要）*/
		@keyframes scroll {
		0% {opacity: 0;}
		100% {opacity: 1;}
		}
		/*デフォルトでは非表示に*/
		body .nav-fix-pos-pagetop a {display: none;}
		/*ボタンの設定*/
		body.is-fixed-pagetop .nav-fix-pos-pagetop a {
			display: block;text-decoration: none;text-align: center;z-index: 100;position: fixed;
			width: 50px;		/*幅*/
			line-height: 50px;	/*高さ*/
			bottom: 50px;		/*下から50pxの場所に配置*/
			right: 3%;			/*右から3%の場所に配置*/
			background: #000;	/*背景色（古いブラウザ用）*/
			background: rgba(0,0,0,0.6);	/*背景色。0,0,0は黒の事で0.6は透明度60%の事。*/
			color: #fff;		/*文字色*/
			border: 1px solid #fff;	/*枠線の幅、線種、色*/
			animation-name: scroll;	/*上のアニメーションで指定しているkeyframesの名前（scroll）*/
			animation-duration: 1S;	/*アニメーションの実行時間*/
			animation-fill-mode: forwards;	/*アニメーションの完了後、最後のキーフレームを維持する*/
		}
		/*マウスオン時*/
		body.is-fixed-pagetop .nav-fix-pos-pagetop a:hover {
			background: #999;	/*背景色*/
		}
		
		/*トップページのNEWアイコン
		---------------------------------------------------------------------------*/
		.newicon {
			background: #F00;	/*背景色*/
			color: #FFF;		/*文字色*/
			font-size: 70%;
			line-height: 1.5;
			padding: 2px 5px;
			border-radius: 2px;
			margin: 0px 5px;
			vertical-align: text-top;
		}
		
		/*checkブロック。赤い注意書きブロックです。
		---------------------------------------------------------------------------*/
		p.check {
			background: #ff0000;
			color:#fff;
			padding: 10px 25px !important;
			margin-bottom: 20px;
		}
		p.check a {color: #fff;}
		
		/*ul.disc,olタグ
		---------------------------------------------------------------------------*/
		ul.disc {
			list-style: disc;
			padding: 0 20px 20px 45px;
		}
		ol {
			padding: 0 20px 20px 47px;
		}
		
		/*その他
		---------------------------------------------------------------------------*/
		.look {background: #eee;border: 1px solid #ccc;padding: 5px 10px;border-radius: 4px;}
		.mb15,.mb1em {margin-bottom: 15px !important;}
		.mb10 {margin-bottom: 10px !important;}
		.mb30 {margin-bottom: 30px !important;}
		.clear {clear: both;}
		.color1, .color1 a {color: #99cccc !important;}
		.color2, .color2 a {color: #999 !important;}
		.red, .red a {color: #ff0000 !important;}
		.pr {font-size: 10px;}
		.wl {width: 96%;}
		.ws {width: 50%;}
		.c {text-align: center;}
		.r {text-align: right;}
		.l {text-align: left;}
		img.fr {float: right;margin-left: 10px;margin-bottom: 10px;}
		img.fl {float: left;margin-right: 10px;margin-bottom: 10px;}
		.big1 {font-size: 24px;letter-spacing: 0.2em;}
		.mini1 {font-size: 11px;}
		.sh {display: none;}
		
		
		
		/*画面幅1301px以上の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (min-width:1301px){
		
		/*inner共通
		---------------------------------------------------------------------------*/
		.inner {
			width: 1301px;	/*サイトの幅。この指定がないと上部メニューが一瞬段落ちする場合があります。*/
		}
		
		/*メインメニューとドロップダウンメニューの設定変更。
		メニュー数が6個なので、1301÷6=216pxになります。
		---------------------------------------------------------------------------*/
		#menubar li, #menubar ul.ddmenu {
			width: 216px;
		}
		
		}
		
		
		
		/*画面幅1300px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:1300px){
		
		/*contents（３カラムを囲むブロック）
		---------------------------------------------------------------------------*/
		#contents {
			margin: 0 1%;	/*上下、左右へのコンテンツの外側へ空けるスペース*/
		}
		
		}
		
		
		
		/*画面幅900px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:900px){
		
		/*ログイン（ヘッダー右側のログイン）
		---------------------------------------------------------------------------*/
		header .login a {
			float: left;			/*ロゴの右に来るように再指定*/
			margin-left: 20px;		/*ロゴとの間にとるスペース*/
			background-image: none;	/*ブラウザ幅が狭くなるので、鍵マークを消す*/
			padding: 5px 30px;		/*上下、左右へのボタン内の余白*/
		}
		
		/*fixmenu設定（メニューが画面上部に到達した際のスタイル）
		---------------------------------------------------------------------------*/
		/*fixmenuから折りたたみメニューになるのでリセット。*/
		body.is-fixed-menu header,body.is-fixed header {margin-bottom: 0px;}
		
		/*メインメニュー
		---------------------------------------------------------------------------*/
		/*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。透明(0%)から色を100%出すアニメーション指定。*/
		@keyframes menu1 {
			0% {opacity: 0;}
			100% {opacity: 1;}
		}
		/*スマホ用メニューブロック
		#menubar-s {
			display: block;overflow: hidden;z-index: 10;
			position: absolute;
			top: 100px;	/*上から100pxの場所に配置
			width: 100%;
			animation-name: menu1;		/*上のkeyframesの名前
			animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。
			animation-fill-mode: both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。
		}*/
		/*メニュー１個あたりの設定
		#menubar-s li a {
			display: block;text-decoration: none;
			padding: 10px 10px 10px 20px;	/*上、右、下、左へのメニュー内の余白
			border-bottom: 1px solid #fff;	/*下の線の幅、線種、色
			background: #CC0000;	/*背景色
			font-size: 14px;		/*文字サイズ
			color: #fff;		/*文字色
		}*/
		/*英語表記（飾り文字）
		#menubar-s li a span {
			display: block;
			font-size: 12px;	/*文字サイズ
		}*/
		/*PC用メニューを非表示にする
		#menubar {display: none;}*/
		
		/*３本バーアイコン設定
		---------------------------------------------------------------------------*/
		/*３本バーブロック*/
		#menubar_hdr {
			display: block;position: absolute;
			top: 10px;	/*上から10pxの場所に配置*/
			right: 3%;	/*右から3%の場所に配置*/
			border: 1px solid #fff;	/*枠線の幅、線種、色*/
		}
		/*アイコン共通設定*/
		#menubar_hdr.close,
		#menubar_hdr.open {
			width: 50px;		/*幅*/
			height: 30px;		/*高さ30p*/
			/*border-radius: 50%;	円形にする。この行削除すれば正方形になります。*/
		}
		/*三本バーアイコン*/
		#menubar_hdr.close {
			background: #99cccc url(../images/icon_menu.png) no-repeat center top/30px;	/*背景色、アイコンの読み込み、上半分(top)を表示、幅30px*/
		}
		/*閉じるアイコン*/
		#menubar_hdr.open {
			background: #99cccc url(../images/icon_menu.png) no-repeat center bottom/30px;	/*背景色、アイコンの読み込み、上半分(bottom)を表示、幅30px*/
		}
		
		/*contents（３カラムを囲むブロック）
		---------------------------------------------------------------------------*/
		#contents {
			padding: 0px 2% 20px;	/*上下、左右へのボックス内の余白*/
		}
		
		/*main,sub,side,contents-in
		---------------------------------------------------------------------------*/
		#main, #sub, #side, #contents-in {
			float: none;
			width: auto;
			overflow: hidden;
		}
		
		/*その他
		---------------------------------------------------------------------------*/
		body.s-n #sub,body.s-n #side {display: none;}
		.sh {display:block;}
		.pc {display:none;}
		
		}
		
		
		
		/*画面幅600px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:600px){
		
		/*ヘッダー（ロゴが入った最上段のブロック）
		---------------------------------------------------------------------------*/
		/*ヘッダーブロック*/
		header {
			text-align: center;
		}
		/*ロゴ画像*/
		header #logo {
			float: none;
			margin: 0 auto;
			padding: 8px 0;
			width: 60%;
		}
		/*ログイン（ヘッダー右側のログイン）
		---------------------------------------------------------------------------*/
		header .login a {
			float: none;
			font-size: 12px;		/*文字サイズ*/
			background: none;/*背景色（古いブラウザ用）*/
			color: #fe7200;	/*文字色*/
			margin: 0;	
			padding: 5px;	/*上、右、下、左へのボタン内の余白*/
			border-radius: 0px;		/*角丸のサイズ*/
			box-shadow: 1px 1px 2px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅*/
			letter-spacing: 0.2em;	/*文字間隔を少し広くとる指定*/
		}
		
		
		
		
		/*画面幅480px以下の設定
		------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width:480px){
		
		/*全体の設定
		---------------------------------------------------------------------------*/
		body {
			font-size: 12px;	/*文字サイズ*/
		}
		
		/*contents（３カラムを囲むブロック）
		---------------------------------------------------------------------------*/
		#contents {
			line-height: 1.5;	/*行間*/
		}
		
		/*mainコンテンツ
		---------------------------------------------------------------------------*/
		#main h2, #main h3 {
			font-size: 14px;
			padding-left: 10px;
			padding-right: 10px;
			margin-bottom: 10px;
		}
		/*段落タグ設定*/
		#main p {
			padding: 0px 10px 10px;
		}
		
		/*submenu（sub,sideのメニュー）
		---------------------------------------------------------------------------*/
		/*メニュー１個ごとの設定*/
		#sub .submenu li a,
		#side .submenu li a {
			padding: 10px;	/*ボックス内の余白*/
		}
		
		/*フッターメニュー
		ウィンドウ幅が狭くなって見づらくなるので、１列にレイアウト変更。
		---------------------------------------------------------------------------*/
		#footermenu ul {
			float: none;
			width: auto;
		}
			
		/*トップページ内「更新情報・お知らせ」ブロック
		---------------------------------------------------------------------------*/
		/*ブロック全体の設定*/
		#new dl {
			padding-left: 10px;
			padding-right: 10px;
			margin-bottom: 10px;	/*ブロックの下(外側)に空ける余白*/
		}
		
		/*特定商取引のページ
		---------------------------------------------------------------------------*/
		/*特定証取引きを囲むブロック*/
		.law {
			padding: 0 10px 10px;	/*上、左右、下へのボックス内余白*/
		}
		
		/*btn（赤い色の大きなボタン）
		---------------------------------------------------------------------------*/
		a.btn {
			font-size: 16px;		/*文字サイズ*/
			letter-spacing: normal;	/*文字間隔を標準に戻す*/
		}
		
		
		/*ul.disc,olタグ
		---------------------------------------------------------------------------*/
		ul.disc {
			list-style: disc;
			padding: 0 20px 20px 30px;
		}
		ol {
			padding: 0 20px 20px 30px;
		}
		
		/*その他
		---------------------------------------------------------------------------*/
		.ws,.wl {width: 94%;}
		.big1 {font-size: 18px;letter-spacing: normal;}
		img.fr,img.fl {float: none;margin: 0;width: 100%;}
		.sh {display:block;}
		.pc {display:none;}
		
		}