@charset "UTF-8";

/*---------------------------------------------
    外枠
---------------------------------------------*/
main > .contents { padding-top: 20px; padding-bottom: 50px; background: #edf2e6; }
.contents .intCont01 { position: relative; border: 1px solid #ccc; border-radius: 6px; padding: 20px 29px; box-sizing: border-box; background: #fff }
.contents .intCont01:before { position: absolute; width: -webkit-calc(100% - 20px); width: calc(100% - 20px); top: 0; left: 10px; content: ""; display: block; border-top: 4px solid #5d9724 }
.contents .intCont01 .contents:not(:first-of-type) { margin-top: 50px }
.contents .contentsBnr { margin-top: 20px }



@media (min-width: 769px) {
  .contents .contents { padding-left: 20px; padding-right: 20px; }
}

@media screen and (max-width: 768px) {
  .contents { padding-left: 10px; padding-right: 10px }
  .contents .intCont01 { padding: 20px 14px }
  .contents .intCont01 .contents { padding: 0; }
}

@media (max-width: 768px) {
  .contents { padding-left: 10px; padding-right: 10px }
}



/*---------------------------------------------
    ビジュアル
---------------------------------------------*/
/* 画像あり */
.kv_img,
#headLine { display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 3.2rem; line-height: 1.4em; font-weight: 600; border-bottom: 1px solid #ccc; padding: 10px 10px 10px; }
/*
.kv_img h1,
#headLine h1 { font-weight: bold; }
.kv_img h1::before,
#headLine h1::before { vertical-align: middle; font-family: 'asSouzoku' !important; font-size: 4rem; font-weight: 100; color: #5d9724; margin-right: 10px; }
*/
.kv_img p,
#headLine p { font-weight: bold; }
.kv_img p::before,
#headLine p::before { vertical-align: middle; font-family: 'asSouzoku' !important; font-size: 4rem; font-weight: 100; color: #5d9724; margin-right: 10px; }



@media (min-width: 769px) {
  .kv_img ,
  #headLine { min-height: 240px; padding: 10px; }
}
@media (max-width: 768px) {
  .kv_img ,
  #headLine { position: relative; background: none !important; margin-bottom: 45%; padding: 7px 10px 13px; font-size: 2.8rem }
  .kv_img::after ,
  #headLine::after { position: absolute; top: 70px; left: 0; content: ""; width: 100%; padding-top: 37.5% }
}

/* 画像なし */
/*
.kv_noimg h1 { display: flex; display: -webkit-flex; flex-direction: row; flex-direction: -webkit-row; flex-wrap: nowrap; flex-wrap: -webkit-nowrap; justify-content: flex-start; -webkit-justify-content: flex-start; align-items: center; -webkit-align-items: center; align-content: stretch; -webkit-align-content: stretch; font-size: 3.2rem; line-height: 1.4em; font-weight: 600; border-bottom: 1px solid #ccc; padding: 15px 10px 25px; }
.kv_noimg h1::before { font-family: 'asSouzoku' !important; font-size: 4rem; font-weight: 100; color: #5d9724; margin-right: 10px }
*/
.kv_noimg p { display: flex; display: -webkit-flex; flex-direction: row; flex-direction: -webkit-row; flex-wrap: nowrap; flex-wrap: -webkit-nowrap; justify-content: flex-start; -webkit-justify-content: flex-start; align-items: center; -webkit-align-items: center; align-content: stretch; -webkit-align-content: stretch; font-size: 3.2rem; line-height: 1.4em; font-weight: 600; border-bottom: 1px solid #ccc; padding: 15px 10px 25px; }
.kv_noimg p::before { font-family: 'asSouzoku' !important; font-size: 4rem; font-weight: 100; color: #5d9724; margin-right: 10px }
[class*="kv_"].icon-loupe:before{ content: "\e909" !important; }

@media (max-width: 768px) {
  /*.kv_noimg h1 { padding: 7px 10px 13px; font-size: 2.8rem }*/
  .kv_noimg p { padding: 7px 10px 13px; font-size: 2.8rem }
}


/*---------------------------------------------
    見出し
---------------------------------------------*/
.title-a { margin-bottom: 20px; position: relative; font-size: 2.6rem; line-height: 1.4em; font-weight: 500; padding: 25px 10px 25px 25px; background: #eff6f5; color: #5d9724; }
.title-a::before { position: absolute; top: 0; bottom: 0; left: 10px; margin-top: auto; margin-bottom: auto; content: ""; width: 4px; height: -webkit-calc(100% - 50px); height: calc(100% - 50px);  margin-right: 10px; border-left: 4px solid #5d9724; }

.title-b { position: relative; font-size: 2.0rem; padding-left: 15px; line-height: 1.5; font-weight: bold; margin-bottom: 10px;}
.title-b::before { content: ''; background: #7eae31; position: absolute; top: 1px; left: 0; width: 3px; height: 24px; }

.title-c { position: relative; padding: 3px 0 3px 30px; font-size: 2.2rem; line-height: 1.4em; letter-spacing: 1px; border: solid #5d9724; border-width: 2px 0; color: #5d9724; margin-bottom: 20px; }
.title-c::before { position: absolute; top: 14px; left: 14px; content: ""; width: 0; height: 0; border-style: solid; border-width: 4px 0 4px 7px; border-color: transparent transparent transparent #5d9724 }


@media (max-width: 768px) {
  .title-a { font-size: 2rem; padding: 20px 10px 20px 20px; }
}
@media (max-width: 768px) {
  .title-a::before { height: -webkit-calc(100% - 40px); height: calc(100% - 40px); }

  .title-c { font-size: 1.8rem }
}


/*---------------------------------------------
    背景
---------------------------------------------*/
.bg-a { background: #edf2e6; }
.bg-b { background: #fffae5; }
.bg-yellow { background: #fffae5; }


/*---------------------------------------------
    ボタン
---------------------------------------------*/
.btn-a { }
.btn-b { }

a.btn-a ,
.btn-a { font-size: 1.6rem; color: #555; border: 1px solid #ccc; box-shadow:0px 4px 0px 0px #5d9724; border-radius: 6px; padding: 12px 30px 12px 12px; position: relative; display: block; transition: 0s; }

a.btn-a::before ,
.btn-a::before { content: ''; position: absolute; width: 16px; height: 16px; -webkit-border-radius: 3px; border-radius: 3px; background: #5d9724; right: 6px; top: calc(50% - 8px); }
a.btn-a::after ,
.btn-a::after { content: ''; position: absolute; width: 7px; height: 7px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); right: 12px; top: calc(50% - 4px); }


@media (min-width: 768px) {

    a.btn-a:hover ,
    .btn-a:hover { color: #fff; box-shadow: none; text-decoration: none; top: 4px; background-color: #5d9724; border-color: #5d9724; }
		a.btn-a:hover::before ,
		.btn-a:hover::before { background: #fff; }
		a.btn-a:hover::after ,
		.btn-a:hover::after { border-color: #5d9724; }

}

/*---------------------------------------------
    table
---------------------------------------------*/
.table-a { width: 100%; border: 1px solid #5d9724; margin: 20px 0; }
.table-a th, .table-a td { padding: 10px; line-height: 1.4em; border: 1px solid #5d9724 }
.table-a thead tr th { background: #f6f6f6 }
.table-a thead tr th:first-of-type { background: #fffae5 }
.table-a tbody tr th { background: #fffae5; }
.table-a tr th { text-align: left }
.table-a tr td { vertical-align: middle; text-align: center }
.table-a tr.complement th, .table01 tr.complement td { border-top: 4px double #5d9724; text-align: left }
.table-a tr.complement td .text { font-size: 1.4rem }
.table-a thead tr th:not(:first-child) { text-align: center }


@media screen and (min-width: 769px) {
  .table-a tr th:first-of-type { width: 280px }

}

@media screen and (max-width: 768px) {
  .table-a { min-width: 960px }
  .table-a { width: auto; min-width: inherit }

}

@media screen and (max-width: 480px) {
  .table-a { border-bottom-width: 0; width: 100% }
  .table-a thead { display: none }
  .table-a tbody tr { display: block }
  .table-a tbody tr th, .table01 tbody tr td { width: 100%; display: list-item; list-style: none; border: none; white-space: inherit }
  .table-a tbody tr td { display: block; width: 100%; text-align: left; border-bottom: 1px solid #5d9724 }
  .table-a th, .table-a td { border: none;  }

}


/*---------------------------------------------
    list
---------------------------------------------*/


/*------------------------------------------------------
		text
------------------------------------------------------*/
div.text { padding: 0 10px; }
div.text p { line-height: 2.0; }
div.text ul li { line-height: 2.0; }
div.text ol li { line-height: 2.0; }
main a ,
div.text a { color: #0071bc; }
div.text a:hover { text-decoration: none; }
.accent-a { color: #9e2b2c; }

.font-tel { font-family: 'Barlow Semi Condensed', sans-serif; }

@media (min-width: 769px) {
	div.text { margin-bottom: 60px; }
	div.text p { margin-bottom: 20px; }
}

@media (max-width: 768px) {
	div.text { margin-bottom: 30px; }
	div.text p { }
}


/*------------------------------------------------------
		catchcopy
------------------------------------------------------*/
.catchCopy { font-weight: bold; line-height: 2.0; letter-spacing: 0.1rem; }
.catchCopy p { background: linear-gradient(transparent 55%, #f2efeb 0%); display: inline; font-weight: bold;  }

@media (min-width: 769px) {
	.catchCopy { font-size: 2.4rem; }
}

@media (max-width: 768px) {
	.catchCopy { font-size: 2.0rem; }
}


/*------------------------------------------------------
	bg
------------------------------------------------------*/
.bg-yellow { background: #fffae5; padding: 20px; font-size: 1.4rem; line-height: 1.4;}
.bg-yellow li:not(:last-child),
.bg-yellow p:not(:last-child) { margin-bottom: 5px; }
.bg-yellow p { margin: 0; }
.text .bg-yellow li ,
.text .bg-yellow p,
.bg-yellow li ,
.bg-yellow p { text-indent: -1.4rem; padding-left: 1.4rem; font-size: 1.4rem; line-height: 1.4; }
.bg-yellow p:last-child ,
.bg-yellow ul li:last-child { margin-bottom: 0; }
/*.bg-special a { color: #1fab18; }*/
.bg-yellow a:hover { }


/*------------------------------------------------------
	pagination
------------------------------------------------------*/
#pagination ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
#pagination ul li { margin: 0 2px; }
#pagination ul li:not(.ryaku) { border: 1px solid #5d9724; }
#pagination .active { background-color: #5d9724; color: #fff; padding: 3px 5px; }
#pagination a { color: #333; padding: 3px 5px; display: block; }


/*------------------------------------------------------
	marker
------------------------------------------------------*/
.marker { position: relative; padding-left: 15px; line-height: 1.6em }
.marker::before { position: absolute; top: 11px; left: 0; display: inline-block; content: ""; width: 10px; height: 10px; background: #5d9724 }
