@charset "utf-8"; /*文字コード指定*/

/* ----- css reset(各ブラウザで指定されているスタイルを初期化)と全体設定 ----- */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h4, h5, h6, form, input, textarea, p, th, td, img {
	margin: 0; /*ボックス外側の余白(値1つは上下左右をまとめて指定)*/
	padding: 0; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	border: 0; /*境界線指定*/
}

body {
	overflow-x: hidden;
        line-height: 2;	/*行の高さ指定(数値のみの場合はfont-sizeの倍数)*/
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro"; /*フォントの種類指定(左から優先順位)*/
	font-size:16px; /* フォントサイズ指定(%はブラウザに設定した標準文字サイズ(通常16px)に対する値)*/
	color: #333333; /*文字色指定*/
   background-image:url("../images/floral_bg.jpg");
}

ol, ul {
	list-style: none; /*リストマーカーの種類指定(noneはなし)*/
}

a { /*リンクの文字設定(マウスをのせる前)*/
	font-size:13px;
	color: #0000FF; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
   
}

a:hover { /*リンクの文字設定(マウスをのせた時)*/
	color: #C74B15; /*文字色指定*/
	text-decoration: underline; /*テキストの装飾指定(下線、上線など)(underlineは下線を引く)*/
}

.color1 {
	color: #FF0033; /*文字色指定*/
}
img {
max-width: 100%;
height: auto;
}
/* ----- ヘッダー(ページの一番上の部分) ----- */

#header {
	display: flex;
        justify-content:space-around;
        position: relative; /*ボックスの配置方法(relativeは相対位置配置)*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
        background-image: url(../images/top/top2sp2.jpg); /*背景画像指定　url(画像ファイルを指定)*/
	background-repeat: no-repeat; /*背景画像の並べかた(repeat-xは横方向に繰り返し並べる)*/
	background-size:cover;
        height: 300px; /*領域の高さ指定*/
	width: 100%; /*幅指定(autoは初期値に戻す)*/
        color: #fff; /*文字色指定*/
        text-shadow    : 
        1px  1px 3px #00008b,
      -1px  1px 3px #00008b,
       1px -1px 3px #00008b,
      -1px -1px 3px #00008b,
       1px  0px 3px #00008b,
       0px  1px 3px #00008b,
      -1px  0px 3px #00008b,
       0px -1px 3px #00008b;        /* 文字の影 */
}

@media only screen and (min-width: 599px) and (max-width: 999px) {
#header {
       display: flex;
        justify-content:space-around;
        position: relative; /*ボックスの配置方法(relativeは相対位置配置)*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
        background-image: url(../images/top/top3sp3.jpg); /*背景画像指定　url(画像ファイルを指定)*/
	background-repeat: no-repeat; /*背景画像の並べかた(repeat-xは横方向に繰り返し並べる)*/
	background-size:cover;
        height: 300px; /*領域の高さ指定*/
	width: 100%; /*幅指定(autoは初期値に戻す)*/
}
}

#header_inner {
	position: relative; /*ボックスの配置方法(relativeは相対位置配置)*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
	width: 100%; /*幅指定*/
}

#header h1 {
	position: absolute; /*ボックスの配置方法(absoluteは絶対位置配置)*/
   font-family:Georgia,"MS 明朝","Hiragino Mincho Pro W3","ヒラギノ明朝 Pro W3",serif;
	left: 150px; /*左からの距離(positionで指定している場合に適用)*/
	top: 10px; /*上からの距離(positionで指定している場合に適用)*/
	font-size: 14px; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	color: #ffffff; /*文字色指定*/
	filter: dropshadow(color=black, offX=0, offY=-1) dropshadow(color=black, offX=1, offY=0) dropshadow(color=black, offX=0, offY=1) dropshadow(color=black, offX=-1, offY=0); /*テキスト縁取り(ie)*/
	text-shadow: 0px -2px black, 2px 0px black, 0px 2px black, -2px 0px black; /*テキスト縁取り*/
	z-index: 3; /*ボックスの重なりの順序を指定*/
        height: 300px;
        width: 100%;
}

#logo {
	position: absolute; /*ボックスの配置方法(absoluteは絶対位置配置)*/
	left: 20px; /*左からの距離(positionで指定している場合に適用)*/
	top: 60px; /*上からの距離(positionで指定している場合に適用)*/
	z-index: 2; /*ボックスの重なりの順序を指定*/
}
.swiper-container {
    margin:0 auto;
    width: 100%;
    height:auto;
    
}
.swiper-swiper-wrapper {
    margin:0 auto;
    width: 100%;
    height:auto;
}
#slideshow > div {
	position: absolute; /*ボックスの配置方法(absoluteは絶対位置配置)*/
	top: 0px; /*上からの距離(positionで指定している場合に適用)*/
	left: 0px; /*左からの距離(positionで指定している場合に適用)*/
	right: 0px; /*右からの距離(positionで指定している場合に適用)*/
	bottom: 0px; /*下からの距離(positionで指定している場合に適用)*/
	z-index: 1; /*ボックスの重なりの順序を指定*/
}
.header-change{
    background: #191970;
    display: flex;
    justify-content: space-between;
    padding: 10px;
    position: fixed;
    top: -200px;
    transition: .5s;
    width: 100%;
    z-index: 100;
    display: none;
}
.header-change.show{
    top: 0;
}
.header-change .gnav__menu__item a{
    color: #ffffff;
    text-decoration: none;
    font-size: 15px;
}
.header-change .gnav__menu__item a:hover{
    color: #C74B15;
    text-decoration: none;
    font-size: 16px;
}
/* ----- レイアウト ----- */

#container { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	width: 100%; /*幅指定*/
	margin: 0 auto; /*ボックス外側の余白(autoはボックス幅や隣接する他ボックス幅による自動余白割り当て)*/
	background-color:#ffffff; /*背景色指定*/
}

#container a:hover img { /*画像にマウスをのせた時半透明にする*/
	filter: Alpha(opacity=70); /*視覚効果(IE独自) Alphaは透過表示 opacityは開始透明度*/
	opacity: 0.7; /*要素の透明度*/
}

#main {
	width: 100%; /*幅指定*/
	background: #f5f5f5;/*背景色*/
        background-image: url(../images/top/panf.jpg); /*背景画像指定　url(画像ファイルを指定)*/
        background-repeat: no-repeat;
        display: none;
}

#main2 {
	width: 100%; /*幅指定*/
	float: none; /*要素を左か右に寄せて配置(leftは左に寄せる)*/
        background-image: url(../images/top/park.jpg); /*背景画像指定　url(画像ファイルを指定)*/
        background-repeat: no-repeat;
        color: #ffffff; /*文字色指定*/
        font-weight:bold;
        display: none;
}

#main3 {
        width: 96%x; /*幅指定*/
	float: none; /*要素を左か右に寄せて配置(leftは左に寄せる)*/
        background-repeat: repeat;
        background-size: cover;
        background-attachment: fixed;
}
.iphone #main3{
        width: 96%x; /*幅指定*/
	float: none; /*要素を左か右に寄せて配置(leftは左に寄せる)*/
        background-repeat: repeat;
        background-size: cover;
        background-attachment: initial;
}   
.ipad #main3{
        width: 96%x; /*幅指定*/
	float: none; /*要素を左か右に寄せて配置(leftは左に寄せる)*/
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: initial;
}

#main4 {
        @import url(https://fonts.googleapis.com/css?family=Droid+Serif);
        font-family: 'Droid Serif', serif;
        font-size: 16px;
        background: #a0522d;
        color: #fff;
        font-style: normal;
        width: 100%x; /*幅指定*/
	float: none; /*要素を左か右に寄せて配置(leftは左に寄せる)*/
              
}

#main5 {
	width: 100%; /*幅指定*/
	background: #f5f5f5;/*背景色*/
        background-image: url(../images/top/panfsp.jpg); /*背景画像指定　url(画像ファイルを指定)*/
        background-repeat: no-repeat;
        background-position: center;
        background-size:auto 100%;
     
}

#main6 {
	width: 100%; /*幅指定*/
	
     
}
#content {
	text-align: center;
        width: 100%; /*幅指定*/
	float: none; /*要素を左か右に寄せて配置(rightは右に寄せる)*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
}

#content2 {
	text-align: center;
        width: 100%; /*幅指定*/
	float: none; /*要素を左か右に寄せて配置(rightは右に寄せる)*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
        display: none;
        

}

#leftside {
	width: 200px; /*幅指定*/
	float: left; /*要素を左か右に寄せて配置(leftは左に寄せる)*/
	margin: 20px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
}

#rightside {
	width: 200px; /*幅指定*/
	float: right; /*要素を左か右に寄せて配置(rightは右に寄せる)*/
	margin: 20px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
}

#rightside2 {
	width: 200px; /*幅指定*/
	float: right; /*要素を左か右に寄せて配置(rightは右に寄せる)*/
	margin: 20px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/

}
 
/* ----- フッター(ページの一番下の部分) ----- */

#footer {
	clear: both; /*floatの回り込みを解除*/
	height: auto; /*領域の高さを指定*/
	width: 100%; /*幅指定(100%は画面横幅いっぱいに表示)*/
	background-image: url(../images/spfooter.jpg); /*背景画像指定　url(画像ファイルを指定)*/
	background-repeat: none; /*背景画像の並べかた(repeat-xは横方向に繰り返し並べる)*/
        background-size: cover;
        color: #ffffff;
        text-align: right; 
        font-size: 13px;
        text-shadow:0 0 10px #000000;
}

#footer_inner {
	padding: 1px; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
}

#footer p {
	font-size: 0.5em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	color: #ffffff; /*文字色指定*/
	text-align: right; /*行の水平方向の揃え方(centerは中央揃え)*/
}
#footer li {
	padding-left: 6px; /*ボックス内側左の余白*/
	margin-left: 6px; /*ボックス外側左の余白*/
	display: inline; /*要素の表示形式指定(inlineはインラインレベルで表示(リストを横並び))*/
	list-style-type: none; /*リストマーカーの種類指定(noneはなし)*/
}

#footer li.first {
	border-left: solid; /*左境界線の一括指定(noneはなし)*/
}
#footer a { /*リンクの文字設定(マウスをのせる前)*/
	color: #ffffff; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        font-size: 12px;
        font-weight: bold;
        text-shadow:0 0 10px #000000;
}
#footer a:hover { /*リンクの文字設定(マウスをのせた時)*/
	text-decoration: underline; /*テキストの装飾指定(下線、上線など)(underlineは下線を引く)*/
        color: #C74B15;
}

/* ----- フッターメニュー ----- */

#footmenu {
	margin-bottom: 5px; /*ボックス外側下の余白*/
	text-align: left; /*行の水平方向の揃え方(centerは中央揃え)*/
}

#footmenu li {
	padding-left: 15px; /*ボックス内側左の余白*/
	margin-left: 15px; /*ボックス外側左の余白*
        display: inline; /*要素の表示形式指定(inlineはインラインレベルで表示(リストを横並び))*/
	list-style-type: none; /*リストマーカーの種類指定(noneはなし)*/
}

#footmenu li.first {
	border-left: none; /*左境界線の一括指定(noneはなし)*/
}

#footmenu a { /*リンクの文字設定(マウスをのせる前)*/
	color: #ffffff; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        font-size: 14px;
        font-weight: bold;
        text-shadow:0 0 10px #000000;
        word-break: keep-all;
}

#footmenu a:hover { /*リンクの文字設定(マウスをのせた時)*/
	text-decoration: underline; /*テキストの装飾指定(下線、上線など)(underlineは下線を引く)*/
        color:#0000cd;
}

/* ----- コンテンツ ----- */
#is-loading {
 display: block;
 position: fixed;
 width: 100%;
 height: 100%;
 top: 0px;
 left: 0px;
 background: #FFF;
 z-index: 8;
}
#loading {
 display: none;
 position: fixed;
 top: 50%;
 left: 50%;
 width: 200px;
 height: 200px;
 margin-top: -100px;
 margin-left: -100px;
 text-align: center;
 color: #fff;
 z-index: 9;
}

/* 画面外にいる状態 */
.fadein {
	opacity : 0.1;
	transform : translate(0, 50px);
	transition : all 500ms;
	}

/* 画面内に入った状態 */
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
	}

.fadeInDown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(520px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(520px); -ms-transform: translateY(520px); transform: translateY(520px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
/* ------------- スクロールフェードインDown用 END ------------- */
.cp_pricetable3 *, .cp_pricetable3 *:before, .cp_pricetable3 *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.cp_pricetable3 {
	width: 100%;
	margin: 10px auto;
	border-spacing: 1px 0;
	border-collapse: separate;
        
}
.cp_pricetable3 th, .cp_pricetable3 td {
	padding: 5px;
}
/*Headerブロック*/
.cp_pricetable3 th {
	z-index: 1;
	width: 125px;
	height: 50px;
	text-align: center;
	vertical-align: middle;
	color: #ffffff;
	border-radius: 5px 5px 0 0;
	background: #88b7d5;
        font-size: 14px;
}
.cp_pricetable3 th:after {
	font-family: 'FontAwesome';
	font-size: 15px;
	position: absolute;
	z-index: -1;
	right: 0;
	bottom: -30px;
	left: 0;
	content: '\f0d7';
}
.cp_pricetable3 th.group1 {
	background: #2e9b72;
}
.cp_pricetable3 th.group1:after {
	color: #2e9b72;
}
.cp_pricetable3 th.group2 {
	background: #da3c41;
}
.cp_pricetable3 th.group2:after {
	color: #da3c41;
}
.cp_pricetable3 th.group3 {
	background: #131874;
}
.cp_pricetable3 th.group3:after {
	color: #131874;
}
/*メインブロック*/
.cp_pricetable3 tr td {
	padding-top: 8px;
	text-align: center;
	border: none;
}
.cp_pricetable3 tr:last-child td {
	border-radius: 0 0 5px 5px;
}
.cp_pricetable3 tr:nth-child(2n+1) td.group1 {
	background: #8cd9bc;
}
.cp_pricetable3 tr:nth-child(2n+0) td.group1 {
	background: #c3e4d8;
}
.cp_pricetable3 tr:nth-child(2n+1) td.group2 {
	background: #f2c2c2;
}
.cp_pricetable3 tr:nth-child(2n+0) td.group2 {
	background: #f7e1e1;
}
.cp_pricetable3 tr:nth-child(2n+1) td.group3 {
	background: #a9bce2;
}
.cp_pricetable3 tr:nth-child(2n+0) td.group3 {
	background: #d7e1f4;
}
/*ボタンデザイン*/
.cp_pricetable3 a.cp_btn {
	position: relative;
	z-index: 1;
	display: block;
	overflow: hidden;
	width: 100px;
	margin-right: auto;
	margin-left: auto;
	padding: 0.2em 0.2em;
	text-align: center;
	text-decoration: none;
	color: #ffffff;
	border: 1px solid #da3c41;
	border-radius: 4px;
	background: #da3c41;
        font-size: 15px;
       
}
.cp_pricetable3 a.cp_btn2 {
	position: relative;
	z-index: 1;
	display: block;
	overflow: hidden;
	width: 100px;
	margin-right: auto;
	margin-left: auto;
	padding: 0.2em 0.2em;
	text-align: center;
	text-decoration: none;
	color: #ffffff;
	border: 1px solid #2e9b72;
	border-radius: 4px;
	background: #2e9b72;
        font-size: 15px;
     
}
.cp_pricetable3 a.cp_btn3 {
	position: relative;
	z-index: 1;
	display: block;
	overflow: hidden;
	width: 100px;
	margin-right: auto;
	margin-left: auto;
	padding: 0.2em 0.2em;
	text-align: center;
	text-decoration: none;
	color: #ffffff;
	border: 1px solid #131874;
	border-radius: 4px;
	background: #131874;
        font-size: 15px;
}
.cp_pricetable3 .cp_btn:after {
	position: absolute;
	z-index: -1;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 0;
	content: '';
	transition: 0.3s;
	-webkit-transform: translate(-50%,-50%) rotate(45deg);
	transform: translate(-50%,-50%) rotate(45deg);
	opacity: 0;
	background: #ffffff;
}
.cp_pricetable3 .cp_btn:hover {
	color: #da3c41;
}
.cp_pricetable3 .cp_btn:hover:after {
	height: 250%;
	opacity: 1;
}
.cp_pricetable3 .cp_btn:active:after {
	height: 350%;
	opacity: 1;
}
.cp_pricetable3 .cp_btn2:after {
	position: absolute;
	z-index: -1;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 0;
	content: '';
	transition: 0.3s;
	-webkit-transform: translate(-50%,-50%) rotate(45deg);
	transform: translate(-50%,-50%) rotate(45deg);
	opacity: 0;
	background: #ffffff;
}
.cp_pricetable3 .cp_btn2:hover {
	color: #da3c41;
}
.cp_pricetable3 .cp_btn2:hover:after {
	height: 250%;
	opacity: 1;
}
.cp_pricetable3 .cp_btn2:active:after {
	height: 350%;
	opacity: 1;
}
.cp_pricetable3 .cp_btn3:after {
	position: absolute;
	z-index: -1;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 0;
	content: '';
	transition: 0.3s;
	-webkit-transform: translate(-50%,-50%) rotate(45deg);
	transform: translate(-50%,-50%) rotate(45deg);
	opacity: 0;
	background: #ffffff;
}
.cp_pricetable3 .cp_btn3:hover {
	color: #da3c41;
}
.cp_pricetable3 .cp_btn3:hover:after {
	height: 250%;
	opacity: 1;
}
.cp_pricetable3 .cp_btn3:active:after {
	height: 350%;
	opacity: 1;
}


ol.sample1{
  counter-reset:list;
  list-style-type:none;
  font: 18px/1.6 'arial narrow', sans-serif;
  padding:5px;
}
ol.sample1 li{
  position:relative;
  padding: 0 0 0 1px;
  margin: 4px 0px 0px 5px;
  font-weight: bold;
  font-size:17px;
  line-height: 35px;
  border-bottom: dashed 1px #F6A38B;
}
ol.sample1 li:before{
  counter-increment: list;
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  height: 30px;
  width: 30px;
  border-radius: 50%;
  background: #F6A38B;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
ol.sample1 li:after{
  content: "";
  display: block;
  position: absolute;
  left: 12px;
  height: 0;
  width: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #fff;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.quote {
  margin: 10px;
  text-align: center;
  max-width: 1000px;
  margin: 10 0;
  margin-top: -10px;
  padding-top: 15px;
  padding-bottom: 1px;
}
.line-through {
  display: block;
  position: relative;
  border-bottom: 2px solid #fff;
  height: 15px;
}
.line-through span {
  position: absolute;
  display: inline-block;
  background: #a0522d;
  width: 200px;
  margin-left: -100px;
  line-height: 30px;
  font-size: 14px;
}
.stripe-border {
  background: linear-gradient(
    to bottom,
    #fff,
    #fff 25%,
    #a0522d 25%,
    #a0522d
  );
  background-size: 100% 8px;
}
.stripe-border blockquote {
  background: #a0522d;
  margin: 10px 8px;
  padding: 10px;
  font-size: 12px;
  line-height: 1.5;
  padding-top: 20px;
  padding-bottom: 5px;
}

body.open_popup {
    overflow: hidden;
}

.bg_onetime_popup {
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9999;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: 0.5s;
}

body.open_popup .bg_onetime_popup {
    opacity: 1;
    visibility: visible;
}

.onetime_popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 80%;
    background-color: #fff;
}

.onetime_popup_title {
    position: relative;
    padding: 0.5em 50px;
    margin: 0px;
    background-color: #ff7f50;
    color: #fff;
    font-size: 18px;
    text-align: center;
    line-height: 1.5;
}

.onetime_popup_title_close {
    position: absolute;
    top: 50%;
    right: 30px;
    width: 30px;
    height: 30px;
    transform: translateY(-50%);
    cursor: pointer;
}
.onetime_popup_title_close::before,
.onetime_popup_title_close::after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 100%;
    height: 4px;
    background-color: #fff;
     content: "";
}
.onetime_popup_title_close::before {
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.onetime_popup_title_close::after {
    transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}

.onetime_popup_content {
    padding: 10px 10px;
    text-align: left;
    font-size: 16px;
}
.onetime_popup_content2 {
    padding: 10px 10px;
    text-align: center;
    background-color: #ff7f50;
    color: #fff;
    display: block;
    position: relative;
    width:50%;
    margin: 0 auto;
    padding: 2px;
    border:2px solid #ff7f50;
    border-radius: 2px;
    font-size: 18px;
    text-align: center;
    letter-spacing: 1px;
    text-decoration: none;
    transition: .15s;
}
.onetime_popup_content2:hover {
	background: #3388dd;
        border:2px solid #3388dd;
	color: #fff;
        cursor: pointer;
}
/* --- MARKARの定義 -------------------------------------------------*/
.sample2b {
  display    : inline-block;
  position   : relative;
}
.sample2b span {
  display    : inline-block;
  position   : absolute;
  top        : 0;
  left       : 0;
  bottom     : 0;
  right      : 0;
  background : linear-gradient(transparent 40%, rgba(0, 255, 0, 0.6) 60%);  /* ラインマーカーを付ける  */
  animation  : sample2bAnime 3s ease-in infinite;  /* アニメ */
}
 /* --- アニメーションの設定 ------------------------------------ */
@keyframes sample2bAnime {
   0% { right : 100%; }     /* 点滅開始色        */
  25% { right : 0;    }     /* 点滅終了色        */
 100% { right : 0;    }     /* 点滅終了色        */
}

.main {
  position: absolute;
  top: 5%;
  left: 5%;
  height: 300px;
  width: 100%;
  transform: translate(-50%, -50%);
}

.main-heading {
  color: #777;
  text-transform: uppercase;
  height: 30px;
  width: 100%;
}

.main-heading-primary {
  display: block;
  font-size: 5px;
  font-weight: 400;
  letter-spacing: 35px;
  top: 25%;
  left: 25%;
  height: 300px;
  width: 100%;
  display: none;
  
}

.main-heading-secondary {
  font-family: sans-serif;
  display: block;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 4px;
  color: #fff;
  font-weight:bold;
  height: 300px;
  width: 100%;
  animation: moveInRight 3s ease-out infinite alternate;
  text-shadow    : 
       2px  2px 1px #00007f,
      -2px  2px 1px #00007f,
       2px -2px 1px #00007f,
      -2px -2px 1px #00007f,
       2px  0px 1px #00007f,
       0px  2px 1px #00007f,
      -2px  0px 1px #00007f,
       0px -2px 1px #00007f;
  display: none;
}

@keyframes moveInLeft {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }
  
  80% {
    transform: translateX(10px);
  }
  
  100% {
    opacity: 1;
    transform: translate(0);
  }
}

@keyframes moveInRight {
  0% {
    opacity: 0;
    transform: translateX(100px);
  }
  
  80% {
    transform: translateX(-10px);
  }
  
  100% {
    opacity: 1;
    transform: translate(0);
  }
}

/* メモ　クリップ　Ａ */
.clip-box-a {
 position: relative;
 margin: 1em auto;
 padding: 5px 5px 5px 5px;
 width: 90%; /* ボックス幅 */
 background-color: #fff; /* ボックス背景色 */
 color: #555555; /* 文章色 */
 border: 3px solid #ff4500; /* 枠線 */
 box-shadow: 10px 10px 10px #acacac; /* 影の色 */
 text-align: left;
 font-size:13px;
 
}
.clip-box-a::before {
 position: absolute;
 content: '';
 top: -10px;
 right: 10px;
 height: 35px;
 width: 10px;
 border: 3px solid #555555; /*クリップ色 */
 background-color: none;
 border-radius: 12px;
 box-shadow: 1px 1px 2px #999;
 transform: rotate(10deg);
 z-index: 1;
}
.clip-box-a::after {
 position: absolute;
 content: '';
 top: 0px;
 width: 10px; 
 right: 20px;
 border: solid 5px #fff; /*背景色と同じ色にする*/
 z-index: 2;
}

.memox{
   position:relative;
   background:#fffde7;
   width:600px;
   margin:2em auto;
   padding:1.5em 1em;
   transform: rotate(-2deg);
   box-shadow:1px 1px 4px rgba(0,0,0,0.2);
   color:#795548;
}
.memox::before{
   content:'図で解説！';
   position:relative;
   display:inline-block;
   border-bottom:3px solid #795548;
   border-radius: 0 0 40% 5% / 0 0 15% 20%;
   padding:0 1em 0.1em 0.2em;
   font-size:25px;
   font-weight:bold;
   transform: rotate(-5deg);
   
}
.memox::after{
   content:'';
   position:absolute;
   left:50%;
   top:-15px;
   margin-left:-75px;
   width:150px;
   height:30px;
   background:rgba(245,245,245,0.7);
   box-shadow:1px 1px 4px rgba(0,0,0,0.2);
   transform: rotate(-4deg);
}
.memox ol{
   margin:0.5em 0.5em 0 1em;
   padding:0 0 0 0;
}
.memox ol li{
   margin-bottom:0.1em;
   text-align: left;
   font-size:22px;
  
}
.msr_box05 {
  width: 100%;
  max-width:600px;
  float: left;
  margin:1px;
  padding:1px;
}
.msr_box05 a{
  border:4px solid #999999;
  box-sizing: border-box;
  color: #333333;
  display:block;
  height: auto;
}
.msr_box05 a *{
  transition: 0.2s opacity ease-in-out;
  -o-transition: 0.2s opacity ease-in-out;
  -moz-transition: 0.2s opacity ease-in-out;
  -webkit-transition: 0.2s opacity ease-in-out;
}
.msr_box05 p {
  font-size: 14px;
  line-height: 1.6;
  padding: 1px;
}
.msr_box05 .ttl {
  font-size: 18px;
  line-height: 1.0;
  padding: 0.1em 4px 0;
}
.msr_box05 a:hover *{
  opacity: 0.8;
  text-decoration: none;

}

.msr_newslist01 {
  
  border-top: 1px solid #AAAAAA;
  width: 100%;
}
.msr_newslist01 li {
  border-bottom: 1px solid #AAAAAA;
  font-size: 14px;
}
.msr_newslist01 li a {
  box-sizing: border-box;
  color: #8b4513;
  display: table;
  padding: 8px;
  text-decoration: none;
  transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -webkit-transition: 0.2s ease-in-out;
  width: 100%;
}
.msr_newslist01 li a:hover {
  background: #EEEEEE;
  text-decoration: none;
}
.msr_newslist01 li div {
  display: table-cell;
  width: 65px;
}
.msr_newslist01 li p {
  display: table-cell;
  padding-left: 1px;
  vertical-align: middle;
  text-align: left;
  font-size: 14px;
  
}

/* 時間の設定 */
.msr_newslist01 li time {
  display: table-cell;
  vertical-align: top;
  width: 30px;
  font-size: 10px;
  display: none;
}

/* カテゴリの設定 */
.msr_newslist01 li .cat01,
.msr_newslist01 li .cat02,
.msr_newslist01 li .cat03 {
  background-color: #1B73BA;
  border-radius: 1px;
  color: #FFFFFF;
  font-size: 13px;
  padding: 1px 2px;
  text-align: center;
  width: 52px;
  
}
.msr_newslist01 li .cat02 {
  background-color: #008000;
}

.msr_newslist01 li .cat03 {
  background-color: #f08080;
}

.drawer-hidden {
  display: none;
}

/* ハンバーガーアイコンの設置スペース */
.drawer-open {
  display: flex;
  height: 35px;
  width: 60px;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 100;/* 重なり順を一番上に */
  cursor: pointer;
  margin-bottom: 20px;
  margin-top: 20px;
  margin-right: 10px;
  margin-left: 30px;
}

/* ハンバーガーメニューのアイコン */
.drawer-open span,
.drawer-open span:before,
.drawer-open span:after {
  content: '';
  display: block;
  height: 8px;
  width: 60px;
  border-radius: 4px;
  background: #00008b;
  transition: 0.5s;
  position: absolute;
  
}
/* 三本線のうち一番上の棒の位置調整 */
.drawer-open span:before {
  bottom: 14px;
}

/* 三本線のうち一番下の棒の位置調整 */
.drawer-open span:after {
  top: 14px;
  
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span {
  background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::before {
  bottom: 0;
  transform: rotate(45deg);
  background: #00008b;
}

#drawer-check:checked ~ .drawer-open span::after {
  top: 0;
  transform: rotate(-45deg);
  background: #00008b;
}
  
/* メニューのデザイン*/
.drawer-content {
  text-align:center;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 50;
  left: 100%;/* メニューを画面の外に飛ばす */
  z-index: 99;
  background: #ffffe0;
  transition: .5s;
  font-size:20px;
}

/* アイコンがクリックされたらメニューを表示 */
#drawer-check:checked ~ .drawer-content {
  left: 0;/* メニューを画面に入れる */

}

.drawer-content a:hover{
    color: #C74B15;
    text-decoration: none;
    font-size: 20px;
}

.sdt_menu{
	background-color: #4169e1;
	width: 100%;
	height: 25px;
	margin: 0 auto;
}

ul.sdt_menu{
	background-color: #4169e1;
	margin:0 auto;
	padding:0;
	list-style: none;
	font-size:7em;
	width:100%;
}
ul.sdt_menu a{
	text-decoration:none;
	outline:none;
}
ul.sdt_menu li{
	background:#191970;
	float:left;
	width:190px;
	height:55px;
	position:relative;
	cursor:pointer;
        display: none;
}
ul.sdt_menu li > a{
	position:absolute;
	top:0px;
	left:0px;
	width:190px;
	height:55px;
	z-index:12;
	background:transparent url(../images/overlay.png) no-repeat bottom right;
	-moz-box-shadow:0px 0px 2px #000 inset;
	-webkit-box-shadow:0px 0px 2px #000 inset;
	box-shadow:0px 0px 2px #000 inset;
}
ul.sdt_menu li a img{
	border:none;
	position:absolute;
	width:0px;
	height:0px;
	bottom:0px;
	left:85px;
	z-index:100;
	-moz-box-shadow:0px 0px 4px #000;
	-webkit-box-shadow:0px 0px 4px #000;
	box-shadow:0px 0px 4px #000;
        
}
ul.sdt_menu li span.sdt_wrap{
	position:absolute;
	top:15px;
	left:0px;
	width:170px;
	height:60px;
	z-index:15;
}
ul.sdt_menu li span.sdt_active{
	position:absolute;
	background:#111;
	top:50px;
	width:170px;
	height:0px;
	left:0px;
	z-index:14;
	-moz-box-shadow:0px 0px 4px #000 inset;
	-webkit-box-shadow:0px 0px 4px #000 inset;
	box-shadow:0px 0px 4px #000 inset;
        
}
ul.sdt_menu li span span.sdt_link,
ul.sdt_menu li span span.sdt_descr,
ul.sdt_menu li div.sdt_box a{
	margin-left:15px;
	text-transform:uppercase;
	text-shadow:1px 1px 1px #000;
}
ul.sdt_menu li span span.sdt_link{
	color:#ffffff;
	font-size:1.4em;
	float:left;
	clear:both;
}
ul.sdt_menu li span span.sdt_descr{
	color:#e6b422;
	float:left;
	clear:both;
	width:155px; /*For dumbass IE7*/
	font-size:12px;
	letter-spacing:3px;
}
ul.sdt_menu li div.sdt_box{
	display:block;
	position:absolute;
	width:170px;
	overflow:hidden;
	height:170px;
	top:85px;
	left:0px;
	z-index:13;
	display:none;
	background:#000;
}
ul.sdt_menu li div.sdt_box a{
	float:left;
	clear:both;
	line-height:30px;
	color:#e6b422;
   background:url("../images/bg_dotline.gif") 0 100% repeat-x;
}
ul.sdt_menu li div.sdt_box a:first-child{
	margin-top:5px;
}
ul.sdt_menu li div.sdt_box a:hover{
	color:#fff;

}

.fonsp { /*リンクの文字設定(マウスをのせる前)*/
	font-size:20px;
	color: #696969; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        text-shadow    : none;
}
.fonlp { /*リンクの文字設定(マウスをのせる前)*/
	font-size:17px;
	color: #696969; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        text-shadow    : none;
}
.fonsp2 { /*リンクの文字設定(マウスをのせる前)*/
	font-size:20px;
	color: #0000FF; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        text-shadow    : none;

   
}
.fon25 { /*リンクの文字設定(マウスをのせる前)*/
	font-size:20px;
	color: #fff; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        font-weight:bold;
   
}
.fon26 { /*リンクの文字設定(マウスをのせる前)*/
	font-size:16px;
	color: #ffffff; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
   
}
.fon20 { /*リンクの文字設定(マウスをのせる前)*/
	font-size:22px;
	color: #795548; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        font-weight:bold;
   
}
.fon30 { /*リンクの文字設定(マウスをのせる前)*/
	display: none;
        color: #ffffff; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
        font-size: 16px;
        font-weight: bold;
        text-shadow:0 0 10px #000000;
   
}
.sdt_menu a { /*リンクの文字設定(マウスをのせる前)*/
	font-size:16px;
	color: #353F25; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
}

.post {
	clear: both; /*floatの回り込みを解除*/
	width: auto; /*幅指定(autoは初期値に戻す)*/
}

.post h2 {
   margin-bottom:8px;
   padding:0 0 0 10px;
   color:#000000;
   font-family:Georgia,"MS 明朝","Hiragino Mincho Pro W3","ヒラギノ明朝 Pro W3",serif;
   font-size:20px;
   font-weight:bold;
   line-height:35px;
   border:1px solid #D8D8D8;
   background:url("../images/head016_10-crop.png") 100% 100% repeat-x;
}

.post h3 {

	background-repeat: repeat-x; /*背景画像の並べかた(repeat-xは横方向に繰り返し並べる)*/
	line-height: 30px;	/*行の高さ指定*/
	margin-bottom: 10px; /*ボックス外側下の余白*/
	font-size:16px; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	color: #333333; /*文字色指定*/
}

.post h4 {

	line-height: 30px;	
	margin-bottom: 10px; 
	font-size:15px;
	color: #000000; 
}

.post ul {
	margin-bottom: 15px; /*ボックス外側下の余白*/
}

.post ul li {
	padding-left: 15px; /*ボックス内側左の余白*/
}

.post h1 {
  padding: 0.5em;/*文字周りの余白*/
  font-size:20px;
  color: #010101;/*文字色*/
  background: #eaf3ff;/*背景色*/
  border-bottom: solid 3px #516ab6;/*下線*/
}
.box24 {
    position: relative;
    padding: 0.5em 0.7em;
    width: 500px; /*幅指定(100%は画面横幅いっぱいに表示)*/
    margin: 2em 0;
    background: #f0e68c;
    color: #00000;
    font-weight: bold;
}
.box24:after {
    position: absolute;
    content: '';
    top: 100%;
    left: 30px;
    border: 15px solid transparent;
    border-top: 15px solid #f0e68c;
    width: 0;
    height: 0;
}
.box24 p {
    margin: 0; 
    padding: 0;
}
.box27 {
    position: relative;
    margin: 2em 0;
    width: 500px; /*幅指定(100%は画面横幅いっぱいに表示)*/
    height: 100px;
    font-size:25px;
    text-align: left;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.box27 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 20px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.box27 p {
    margin: 0; 
    padding: 0;
}

.box26 {
    position: relative;
    width: 89%; /*幅指定(100%は画面横幅いっぱいに表示)*/
    margin: 15px 0;
    padding: 0em 0.8em;
    font-size: 20px;
    text-align: left;
     background-color:rgba(255,255,255,0.7);
    border: solid 4px #95ccff;
    border-radius: 4px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -5px;
    left: 0;
    padding: 0 15px;
    line-height: 1.5;
    font-size: 20px;
    background-color:#95ccff;
    color: #ffff;
}
.box26 p {
    text-align: left;
    margin: 0; 
    padding: 0;
}
.box28 {
    position: relative;
    margin: 1em 0;
    width: 800px; /*幅指定(100%は画面横幅いっぱいに表示)*/
    height: 200px;
    text-align: left;
    font-size:20px;
    padding: 2em 3em;
    border: solid 4px #FFC107;
}
.box28 .box-title {
    position: absolute;
    display: inline-block;
    top: -2px;
    left: -2px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 20px;
    background: #FFC107;
    color: #ffffff;
    font-weight: bold;
}
.box28 p {
    text-align:left;
    margin: 0; 
    padding: 0;
    

}

.box29 {
    position: relative;
    width: 90%; /*幅指定(100%は画面横幅いっぱいに表示)*/
    margin: 2em 0;
    padding: 2em 0.7em;
    font-size: 16px;
    text-align: left;
    border: solid 3px #62c1ce;
    border-radius: 8px;
}
.box29 .box-title {
    position: absolute;
    display: inline-block;
    top: -2px;
    left: 0;
    padding: 0 15px;
    line-height: 25px;
    font-size: 18px;
    background-color:#62c1ce;
    color: #ffff;
}
.box29 p {
    text-align: left;
    margin: 0; 
    padding: 0;
}
.box4{
    padding: 8px 8px;
    margin: 0 0;
    width: 980px; /*幅指定(100%は画面横幅いっぱいに表示)*/
    color: #2c2c2f;
    background: #f5f5f5;
    border-top: solid 5px #5989cf;
    border-bottom: solid 5px #5989cf;
}
.box4 p {
    margin: 0; 
    padding: 0;
}
.box1 {
    padding: 1em 1em;
    margin: 1em 0;
    width: 600px; /*幅指定(100%は画面横幅いっぱいに表示)*/
    height: 110px;
    font-weight: normal;
    border: solid 3px #000000;
}
.box1 p {
    margin: 0; 
    padding: 0;
}
.box2 {
    padding: 0em 1em 0em 1em;
    width: 98%; /*幅指定(100%は画面横幅いっぱいに表示)*/
    margin-right: auto;
    font-weight: normal;
    border: solid 0px #ffffff;
    display: none;
}
.box2 p {
   text-align: left;
   font-family: 'HG正楷書体-PRO',cursive;
    margin: 0; 
    padding: 0;
}

.box30 {
    width: auto; /*幅指定(100%は画面横幅いっぱいに表示)*/
    margin-right: auto;
    height: auto; /*領域の高さ指定*/
    font-family: 'HG正楷書体-PRO',cursive;
    background: #ffdab9;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
    display: none;
}
.box30 .box-title {
    font-size: 18px;
    font-family: 'Roman',serif;
    height: auto; /*領域の高さ指定*/
    background: #ffa500;
    padding: 1px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.box30 p {
    padding: 5px 1px;
    margin: 0;
    font-size:16px;
    text-align: center;
}
.box31 {
    width: auto; /*幅指定(100%は画面横幅いっぱいに表示)*/
    margin-left: auto;
    height: auto; /*領域の高さ指定*/
    font-family: 'HG正楷書体-PRO',cursive;
    background: #eee8aa;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
    display: none;
}
.box31 .box-title {
    font-size: 18px;
    font-family: 'Roman',serif;
    height: auto; /*領域の高さ指定*/
    background: #228b22;
    padding: 1px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.box31 p {
    padding: 5px 1px;
    margin: 0;
    font-size:16px;
    text-align: center;
}
.box32 {
    width: auto; /*幅指定(100%は画面横幅いっぱいに表示)*/
    margin-right: auto;
    height: auto; /*領域の高さ指定*/
    font-family: 'HG正楷書体-PRO',cursive;
    background: #add8e6;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
    display: none;
}
.box32 .box-title {
    font-size: 18px;
    font-family: 'Roman',serif;
    height: auto; /*領域の高さ指定*/
    background: #4169e1;
    padding: 1px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.box32 p {
    padding: 5px 1px;
    margin: 0;
    font-size:16px;
    text-align: center;
}
.slide {
  position: relative;
  margin-right: auto;
  width: 100%;
  max-width:470px;
  height: 600px;
  overflow: hidden;
}

@keyframes slideshow{
  0%{
    opacity: 0;
  }
  10%{
    opacity: 1;
  }
  28%{
    opacity: 1
  }
  38%{
    opacity: 0;
  }
  100%{
    opacity: 0;
  }

}

.slide img {
  position: absolute;
  top: 30%;
  left: 45%;
  transform: translate(-50%, -50%);
  width: 90%;
  height: auto;
  opacity: 0;
  animation :slideshow 12s linear infinite;
}

.slide img:nth-child(2){
  animation-delay: 4s;
}

.slide img:last-child{
  animation-delay: 8s;
}

/* ---- 画像リストの設定 ----- */

.product {
	overflow: hidden; /*領域に入りきらない内容の処理(hiddenははみ出す場合表示されず)*/
	padding: 5px; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	border: 1px solid #bfbfbf; /*境界線の一括指定(solidは1本線,線の太さ,線の色)*/
	margin-bottom: 10px; /*ボックス外側下の余白*/
	width: 527px; /*幅指定*/
}

.product img {
	float: left; /*要素を左か右に寄せて配置(leftは左に寄せる)*/
	width: 170px; /*幅指定*/
}

.product h3 {
	font-size: 1em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	color: #055723;	/*文字色*/
	padding-left: 180px; /*ボックス内側左の余白*/
}

.product h3 a {
	color: #055723;	/*文字色指定*/
}

.product p {
	padding-left: 180px; /*ボックス内側左の余白*/
}



/* ---- テーブルの設定 ----- */

.ta1 {
	width: 540px; /*幅指定*/
	border-collapse: collapse; /*境界線の表示指定(collapseは重ねて表示)*/
	margin-bottom: 10px; /*ボックス外側下の余白*/
}

.ta1 th, td {
	border: solid 1px #696969; /*境界線の一括指定(solidは1本線,線の太さ,線の色)*/
	padding: 10px; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	font-size: 1em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	text-align: left; /*行の水平方向の揃え方(leftは左寄せ)*/
}

.ta1 th {
	background-color: #321E1F; /*背景色指定*/
	color: #ffffff; /*文字色指定*/}
}

/* ---- ボックスの設定 ----- */

.box {
	overflow: hidden; /*領域に入りきらない内容の処理(hiddenははみ出す場合表示されず)*/
	padding: 5px; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	border: 1px solid #bfbfbf; /*境界線の一括指定(solidは1本線,線の太さ,線の色)*/
	margin-bottom: 10px; /*ボックス外側下の余白*/
	width: 527px; /*幅指定*/
}

/* ---- 入力フォームの設定 ----- */

#formtable {
	width: 540px; /*幅指定*/
}

#formtable table {
	width: 100%; /*幅指定(100%は画面横幅いっぱいに表示)*/
	border-collapse: collapse; /*境界線の表示指定(collapseは重ねて表示)*/
}

#formtable th {
	width: 100px; /*幅指定*/
	border: solid 1px #696969; /*境界線の一括指定(solidは1本線,線の太さ,線の色)*/
	padding: 5px; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	background-color: #321E1F; /*背景色指定*/
	font-size: 1em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	color: #ffffff; /*文字色指定*/
	text-align: left; /*行の水平方向の揃え方(leftは左寄せ)*/
}

#formtable td {
	border: solid 1px #696969; /*境界線の一括指定(solidは1本線,線の太さ,線の色)*/
	padding: 5px; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	font-size: 1em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
}

#formtable input {
	border: solid 1px #bfbec5; /*境界線の一括指定(solidは1本線,線の太さ,線の色)*/
}

#formtable textarea {
	border: solid 1px #bfbec5; /*境界線の一括指定(solidは1本線,線の太さ,線の色)*/
}

#formtable p {
	margin: 10px 0; /*ボックス外側の余白(値1つは上下左右をまとめて指定)*/
	text-align:center; /*行の水平方向の揃え方(centerは中央揃え)*/
}
</style>
/* ----- ページ左の内容 ----- */

/* -- サイドバータイトル -- */
.side-title { padding-bottom: 2px;
        padding:3px;
	font-size: 18px;
        font-weight:bold;
        color:#144474;
        padding-left:1px;

}

#leftside img {
	margin-bottom: 5px; /*ボックス外側下の余白*/
}

.sidebar h2 {
	padding-left: 10px; /*ボックス内側左の余白*/
	margin: 20px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
	font-size: 1em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	color: #333333; /*文字色指定*/
}




/* ----- ページ右の内容 ----- */



#rightside h2 {
	padding-left: 10px; /*ボックス内側左の余白*/
	margin: 20px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
	font-size:18px;
	color: #6A3F89; /*文字色指定*/
}

#rightside h3 {
   padding:3px;
   font-size:20px;
   font-weight:bold;
   color:#fff;
   padding-left:1px;
   background:#2F5B0D;
   border-bottom:1px solid #C1C1C1;
   border-right:1px solid #C1C1C1;
   text-align: center;
}

#rightside h4 {
   margin-bottom:1px;
   padding-left:1px;
   color:#696969;
   font-size:18px;
   border-bottom:1px solid #999;
}
.newlist {
	margin-bottom: 15px; /*ボックス外側下の余白*/
}

.newlist dl {
	width: auto; /*幅指定(autoは初期値に戻す)*/
	height: 200px; /*領域の高さ指定*/
	overflow: auto; /*領域に入りきらない内容の処理(autoはブラウザに依存(通常はみ出す場合はスクロール表示))*/
	padding-left: 5px; /*ボックス内側左の余白*/
	text-align: left; /*行の水平方向の揃え方(leftは左寄せ)*/
}

.newlist dt {
	font-weight: bold; /*フォントの太さ指定(boldは太字)*/
	color: #666666; /*文字色指定*/
}

.newlist dd {
	border-bottom: 1px solid #cccccc; /*下境界線の一括指定(solidは1本線,線の太さ,線の色)*/
	margin: 5px 5px 2px 5px; /*ボックス外側の余白(値4つは左から上,右,下,左の値)*/
}

#rightside a { /*リンクの文字設定(マウスをのせる前)*/
	font-size:20px;
	color: #0000FF; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
}

#rightside a:hover { /*リンクの文字設定(マウスをのせた時)*/
	color: #C74B15; /*文字色指定*/
	text-decoration: underline; /*テキストの装飾指定(下線、上線など)(underlineは下線を引く)*/
}