@charset "utf-8";

body {
	padding-top: 0px;
	background: #ffffff;
	color: #000000;
	font-family:
			Meiryo, "メイリオ",
			"Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3",
			Osaka,
			"MS P Gothic", "ＭＳ Ｐゴシック",
			sans-serif;
	font-size: 14px;
	line-height: 1.3;
	
}

/* 表示域 */
.all{
  max-width: 950px;
  margin: 0 auto;
}

/* タイトル */
.title1 {
    margin: 0.5em 0;
    padding: 0.5em 1em;
    color: #38a01b;
    border-top: solid 6px #38a01b;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);/*影*/
}

/* 見出し */
.subtitle1 {
    margin: 0.5em 0;
    padding: 0.2em 0.2em 0.2em 1em;/*文字まわり（上下左右）の余白*/
    color: #fff;
    background: #38a01b;/*背景色*/
}

.subtitle2{
  font-weight   : bold;                /* 太字                    */
  color         : #38a01b;             /* 文字色                  */
}

/* 「↑このページの上へ」を表示 */
.page_top{
    width:100%;
    border-collapse:collapse;
}
.page_top td{
    padding:0;
    text-align: right;
}

/* 左にサブメニューがある場合、スマホ等ではサブメニューを本文の下に表示するためのおまじない↓ */
.wrapper {
     float: right;
     margin: 0;
     width: 100%;
     margin-left: -200px;
}
 
.content {
     margin-left: 200px;
}
 
.sidebar {
     padding: 0.2em 0 0 0;/*文字まわり（上下左右）の余白*/
     width: 200px;
     height: auto;
}
  
@media (max-width: 600px) {
     .wrapper, .content, .sidebar {
          float: none;
          margin: 0;
          width: auto;
     }
}
/* 左にサブメニューがある場合、スマホ等ではサブメニューを本文の下に表示するためのおまじない↑ */

/* 画像の左や右側に文章を回り込ます */
img.float_l{float:left;}	/* 画像の右側 */
img.float_r{float:right;}	/* 画像の左側 */
p.float_clear{clear:both;}	/* 回り込みクリア */

/* サブメニュー */
table.submenutable {
  width: 200px;
  border-collapse: separate;
  border-spacing: 5px;
  font-size: 12pt;
}
table.submenutable td.submenutd {padding:5px;}

.otherpage { background-color: #bade5c; }	/* サブメニュー　ほかのページ */
.nowpage { background-color: #38a01b; }		/* サブメニュー　今のページ */

/* YouTubeの画像を埋め込む↓ */
.youtube {
  position: relative;
  height: 0;
  margin-bottom: 20px;
  padding-bottom: 56.25%;
  overflow: hidden;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.container img{
  max-width: 100%;
}
 
/* ココから下がPC表示（600px以上）のレイアウト */
@media screen and (min-width: 600px) {
  .container{
    display: flex;
    margin-bottom: 1.5rem;
    justify-content: space-between;
    align-items: flex-start;
  }
  .item{
    flex-basis: 49.5%;
  }
}
/* YouTubeの画像を埋め込む↑ */

/* 見出しデザイン↓ */
/* 左側に縦のライン */
.leftline{
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #38a01b;/*左線*/
}

/* 左側に尖った帯 */
.sharp{
  position: relative;
  padding: 5px 5px 5px 42px;
  background: #38a01b;
  font-size: 20px;
  color: white;
  line-height: 1.3;
  z-index:-1;
  width: 100%;
}

.sharp::before{
  position: absolute;
  content: '';
  left: -2px;
  top: -2px;
  border: none;
  border-left: solid 40px white;
  border-bottom: solid 79px transparent;
  z-index:-2;
}

/* 左側に矢印 */
.arrow{
  position: relative;
  padding-left: 25px;
  width: 100%;
}

.arrow::before{
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px rgb(56, 160, 27);
}
.arrow::after{
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px rgb(56, 160, 27);
}

@media screen and (max-width: 450px) {/* 450px以下*/
    .sharp{
        font-size: 1.0rem;
    }
}

/* 二重下線 */
.underline{
  /*線の種類（二重線）太さ 色*/
  border-bottom: double 5px rgb(56, 160, 27)
}
/* 見出しデザイン↑ */