@charset "utf-8";
/******************************************************************************
******************************************************************************
**
** style.cssにおいて
** -- baseでは基本タグとサイト大枠のCSS指定
** -- headerではヘッダーのCSS指定
** -- global navではグローバルナビのCSS指定
** -- contentではコンテント・メイン・サイドナビのCSS指定
** -- footerではフッターのCSS指定
** -- pagetopではページトップボタンのCSS指定
** -- indexではトップページのCSS指定
** -- pageでは汎用ページのCSS指定
** -- styleでは汎用ページのコンテンツ（データ入れ）で使用する基本タグのCSS指定
**
** 注意事項
** -- CSSの命名規則はApplicatsオリジナルの命名規則を採用しています。
** -- 初期フォントサイズはreset.cssにて13pxにリセットしています。
** -- 行間は1.6にリセットしています。
**        単位は不要です。(スタイル崩れする可能性有)
** -- コンテンツ内のフォントサイズ・行間は
**        [ base ]のcontentsクラスで指定しています。
**        変更する場合はこちらを変更してください。
**
******************************************************************************
******************************************************************************/
/*-------------------------------------------------------------------------------------------------------
*********************************************************************************************************
*********************************************************************************************************
******
****** PCスタイル
******
*********************************************************************************************************
*********************************************************************************************************
-------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------
******************************************************************************
** base
******************************************************************************
----------------------------------------------------------------------------*/
html, body {
 display: flex;
 flex-direction: column;
 overflow-x: hidden;
 /*background:#a5c9c1*/
}
body {
 min-height: 100vh;
}
.w_base {
 margin: 0 auto;
 width: 960px;
}
.w_base02 {
 margin: 0 auto;
 width: 1150px;
}
/*----------------------------------------------------------------------------
******************************************************************************
** header
******************************************************************************
----------------------------------------------------------------------------*/
.i_head {
 height: 100px;
 /*background: rgba(255, 255, 255, 0.8);*/
 background: rgb(156 187 28 / 75%);
 filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.1));
 position: fixed;
 width: 100%;
 top: 0;
 z-index: 100
}
.head {
 height: 100px;
 /*background: rgba(255, 255, 255, 0.8);*/
 background: rgb(156 187 28 / 75%) !important;
 filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.1));
 position: fixed;
 width: 100%;
 top: 0;
 background: #D8E9D9;
 z-index: 100;
 opacity: 0.9
}
.hd_bg {
 position: relative;
 /*background: url(../images/hd_bg.png) top center;*/
 background-size: cover;
}
.hd {
 position: relative;
 height: 120px;
}
.hd_logo a {
 top: 40px;
 left: 100px;
 position: absolute;
 width: 900px;
 color: #069F4D;
 font-size: 1.6em;
 font-weight: bold;
 line-height: 1.2;
 text-decoration: none;
 z-index: 100
}
.hd_logo .h1_txt {
 font-size: 20px;
}
.hd_logo a {
 text-decoration: none;
 color: #000
}
.hd_logo img {
position: absolute;
 top: 7px;
 left: 20px;
 width: 66px;
 height: auto
}
/*----------------------------------------------------------------------------
******************************************************************************
** global nav
******************************************************************************
----------------------------------------------------------------------------*/
.nav_bg {
 height: 140px;
 position: fixed !important;
 position: absolute;
 top: 20px;
 right: 20px;
 z-index: 1;
}
.nav {}
.nav_list {
 display: flex;
 justify-content: flex-end;
 width: 100%;
 margin: 0 0 10px;
}
.nav_list > li {
 position: relative;
 z-index: 1000
}
.nav_list > li > a {
 display: block;
 color: #000;
 font-size: 15px;
 font-weight: bold;
 text-align: center;
 text-decoration: none;
}
.nav_list > li a:after {
 content: "/";
 display: inline-block;
 margin: 0 5px;
 color: #000;
}
.nav_list > li:last-of-type a:after {
 content: "";
 margin: 0;
}
/*----------------------------------------------------------------------------
******************************************************************************
** content
******************************************************************************
----------------------------------------------------------------------------*/
.i_con_bg {
 padding-top: 100px;
 background: url(../images/body_bg.png);
}
.con_bg {
 padding-top: 100px;
 background: url(../images/body_bg.png);
}
.con_bg h1 {
 display: flex;
 justify-content: center;
 align-items: center;
 font-size: 32px;
 margin-top: -200px;
 padding: 250px 0 45px 0;
 background: url(../images/index_bg.png) top center;
 background-size: cover;
}
/*.con_bg h1 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 32px;
	padding: 45px 0;
	background: url(../images/index_bg.png) top center;
	background-size: cover;
     z-index: -1
}*/
.con_bg h1 span {
 margin: 0 0 0 15px;
 font-size: 22px;
 font-weight: normal;
}
.con {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 padding: 30px 0;
 background: #fff;
}
.main {
 -webkit-box-ordinal-group: 2;
 -ms-flex-order: 1;
 order: 1;
}
.index_info_con_02 {
 display: flex;
 flex-wrap: wrap;
 margin: 40px 0 0;
}
.index_info_con_02 dl {
 display: flex;
 width: 100%;
 margin: 0 0 40px;
}
.index_info_con_02 dl dt {
 display: flex;
 align-items: center;
 height: 130px;
 padding: 10px 6px;
 background: #9cbb1c;
 color: #fff;
 font-family: 'Roboto', sans-serif;
 font-size: 20px;
 font-weight: bold;
 text-align: center;
}
.index_info_con_02 dl dt span {
 display: block;
 font-size: 16px;
}
.index_info_con_02 dl dd {
 margin: 0 10px;
 font-size: 18px;
}
.index_info_con_02 dl {
 border-bottom: 1px dotted #4EA4E2;
 margin-bottom: 10px;
 padding: 10px 0 20px 0;
 width: 100%
}
.index_info_con_02 dd {
 /*display: flex;
	align-items: center*/
}
.scroll {
 height: 600px;
 overflow-y: scroll;
 width: 100%;
 margin-bottom: 20px;
 border: 1px solid #ccc;
 padding: 10px 20px
}
/*----------------------------------------------------------------------------
******************************************************************************
** footer
******************************************************************************
----------------------------------------------------------------------------*/
.ft_bg {
 margin-top: auto;
 background: url(../images/ft_bg.png) no-repeat;
 background-size: cover;
}
.ft {
 position: relative;
 padding: 30px 0 10px;
}
.ft_con {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 0 0 70px;
}
.ft_con .ft_logo a {
 font-size: 22px;
 line-height: 1.1;
 text-align: center;
 text-decoration: none;
 color: #fff;
}
.ft_con .ft_logo span {
 font-size: 12px;
}
.ft_con .ft_logo .h1_txt {
 font-size: 20px;
}
.ft_con .ft_nav {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 20px 0 0;
}
.ft_con .ft_nav .ft_nav_list > li {
 margin: 0 10px 5px 0
}
.ft_con .ft_nav .ft_nav_list > li > a {
 display: block;
 color: #fff;
 font-size: 16px;
 font-weight: bold;
 text-decoration: none;
}
.ft_con .ft_nav .ft_nav_list > li:nth-child(3) > a {
 line-height: 1.2 !important
}
.ft_con .ft_bnr {
 position: relative;
 width: 500px;
}
.ft_con .ft_bnr ul {
 position: absolute;
 right: 0;
 bottom: 0;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 width: 100%;
}
.ft_con .ft_bnr ul > li {
 width: calc(100% / 3 - 5px);
}
.ft_con .ft_bnr ul > li > a {
 position: relative;
 display: block;
 padding: 10px 5px;
 background: #fff;
 color: #636363;
 font-size: 16px;
 font-weight: bold;
 text-align: center;
 text-decoration: none;
 height: 60px;
}
.ft_con .ft_bnr ul > li > a:after {
 position: absolute;
 top: 0;
 right: 5px;
 content: url(../images/icon_elink_gray.png);
}
.ft_copy {
 color: #fff;
 font-size: 12px;
 text-align: center;
}
/*----------------------------------------------------------------------------
******************************************************************************
** pagetop
******************************************************************************
----------------------------------------------------------------------------*/
.pt {
 position: absolute;
 top: 30px;
 right: 0;
 width: 30px;
 height: 70px;
 z-index: 100;
}
.pt_btn {
 border-radius: 50%;
 color: #FFF;
 cursor: pointer;
 display: flex;
 align-items: flex-end;
 justify-content: center;
 font-size: 15px;
 font-weight: bold;
 height: 100%;
 line-height: 1.3;
 opacity: 0.8;
 transition: all 0.3s ease;
 text-decoration: none;
 text-align: center;
 width: 100%;
}
.pt_btn:before {
 position: absolute;
 top: 0;
 left: 50%;
 transform: translate(-50%, 0);
 content: url(../images/pt_arrow.png);
}
.pt_btn:hover {
 opacity: 0.6;
}
/*----------------------------------------------------------------------------
******************************************************************************
** index
******************************************************************************
----------------------------------------------------------------------------*/
.index_hd {
 position: relative;
 height: 100vh;
}
.index_hd .eyecatch {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
 color: #fff;
 font-size: 40px;
 font-weight: bold;
 text-align: center;
 line-height: 1.1;
}
.index_hd .eyecatch span {
 display: block;
 font-family: 'Roboto', sans-serif;
 font-size: 82px;
 margin: 0 0 10px;
}
.index_hd .fuwafuwa {
 -webkit-animation: fuwafuwa 1.8s linear infinite;
 animation: fuwafuwa 1.8s linear infinite;
}
@keyframes fuwafuwa {
 0% {
  margin-bottom: -4px;
  opacity: 1;
 }
 50% {
  margin-bottom: 4px;
  opacity: 0.7;
 }
 100% {
  margin-bottom: -4px;
  opacity: 1;
 }
}
.index_hd .button_down {
 position: absolute;
 bottom: 30px;
 left: 50%;
 transform: translate(-50%, 0);
 display: block;
 text-align: center;
 text-decoration: none;
 color: #FFF;
 z-index: 100;
 transition: All 0.5s ease;
}
.index_hd .button_down {
 position: absolute;
 bottom: 30px;
 left: 50%;
 transform: translate(-50%, 0);
 display: block;
 text-align: center;
 text-decoration: none;
 color: #FFF;
 font-size: 15px;
 font-weight: bold;
 z-index: 100;
 transition: All 0.5s ease;
}
.index_hd .button_down:after {
 content: url(../images/pt_arrow.png);
 display: block;
 transform: rotate(-180deg);
}
.index_info {
 margin: 0 0 50px;
}
.index_info h2 {
 color: #9cbb1c;
 font-size: 50px;
 font-family: 'Roboto', sans-serif;
 margin-bottom: 0px
}
.index_info h2 span {
 display: block;
 margin: -15px 0 0;
 font-size: 16px;
 font-weight: normal;
}
.index_info_con {
 display: flex;
 flex-wrap: wrap;
 margin: 40px 0 0;
}
.index_info_con dl {
 display: flex;
 width: calc(100% / 2);
 margin: 0 0 40px;
}
.index_info_con dl dt {
 display: flex;
 align-items: center;
 height: 130px;
 padding: 10px 6px;
 background: #9cbb1c;
 color: #fff;
 font-family: 'Roboto', sans-serif;
 font-size: 20px;
 text-align: center;
}
.index_info_con dl dt span {
 display: block;
 font-size: 16px;
}
.index_info_con dl dd {
 margin: 0 10px;
 font-size: 18px;
}
.index_info_new {
 display: inline-block;
 color: #C00;
 font-size: 0.9em;
 font-weight: bold;
 margin-left: 0.3em
}
.index_info_new:before {
 content: "NEW"
}
.index_con {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
}
.index_con > div {
 width: calc(100% / 2 - 30px);
 margin: 0 0 40px;
}
.index_con div h2 {
 color: #9cbb1c;
 font-size: 50px;
 font-family: 'Roboto', sans-serif;
 margin-bottom: 20px
}
.index_con div h2 span {
 display: block;
 margin: -15px 0 0;
 font-size: 16px;
 font-weight: normal;
}
.index_con div figure img {
 width: 100%;
}
.index_con div a {
 position: relative;
 display: block;
}
.index_con div a span {
 position: absolute;
 bottom: 0;
 left: 0;
 padding: 0 10px;
 background: #9cbb1c;
 color: #fff;
 font-size: 35px;
 font-weight: bold;
}
.index_con div .more a {
 position: relative;
 display: block;
 width: 310px;
 margin: 30px 0 0;
 padding: 17px 0;
 font-size: 18px;
 font-weight: bold;
 color: #9cbb1c;
 text-align: center;
 text-decoration: none;
 border: 1px solid #9cbb1c;
 transition: all 0.5s ease;
}
.index_con div .more a:hover {
 background: #9cbb1c;
 color: #fff;
}
.index_con div .more a:after {
 position: absolute;
 right: 10px;
 transform: translate(0, -50%);
 display: inline-block;
 content: url(../images/more_arrow.png);
 width: 22px;
 height: 6px;
 transition: all 0.5s ease;
}
.index_con div .more a:hover:after {
 content: url(../images/more_arrow_ov.png);
}
.index_message {
 padding: 75px 0;
 background: url(../images/index_bg.png);
 background-size: cover;
}
.index_message_eyecatch {
 margin: 0 0 30px;
 font-size: 26px;
 font-weight: bold;
 text-align: center;
 line-height: 1.1;
 color: #000
}
.index_message_eyecatch span {
 display: block;
 margin: 0 0 10px;
 font-family: 'Roboto', sans-serif;
 font-size: 45px;
}
.index_message p {
 padding: 0 50px;
 font-size: 16px;
 font-weight: bold;
 text-align: center;
 line-height: 2.2;
}
.index_access {
 padding: 70px 0 0;
}
.index_access h2 {
 color: #9cbb1c;
 font-size: 50px;
 font-family: 'Roboto', sans-serif;
 margin-bottom: 0px
}
.index_access h2 span {
 display: block;
 margin: -15px 0 0;
 font-size: 16px;
 font-weight: normal;
}
.index_access p {
 margin: 15px 0 20px;
 font-size: 16px;
}
#index_access_map {
 width: 100%;
 height: 500px;
}
#index_access_map iframe {
 width: 100%;
 height: 100%;
}
.more a {
 position: relative;
 display: block;
 width: 310px;
 margin: 0 auto;
 padding: 17px 0;
 font-size: 18px;
 font-weight: bold;
 color: #9cbb1c;
 text-align: center;
 text-decoration: none;
 border: 1px solid #9cbb1c;
 transition: all 0.5s ease;
}
.more a:hover {
 background: #9cbb1c;
 color: #fff;
}
.more a:after {
 position: absolute;
 right: 10px;
 transform: translate(0, -50%);
 display: inline-block;
 content: url(../images/more_arrow.png);
 width: 22px;
 height: 6px;
 transition: all 0.5s ease;
}
.more a:hover:after {
 content: url(../images/more_arrow_ov.png);
}
/*----------------------------------------------------------------------------
******************************************************************************
** page
******************************************************************************
----------------------------------------------------------------------------*/
.list_alternate li {
 margin: 0 0 0 0 !important;
 text-indent: -1em;
 padding: 10px 20px;
 border-bottom: 1px solid #ccc;
 list-style-position: inside;
}
.list_alternate li:nth-child(even) {
 background: #eee;
}
/*----------------------------------------------------------------------------
******************************************************************************
** style
******************************************************************************
----------------------------------------------------------------------------*/
.mcon {
 word-wrap: break-word
}
.mcon a img:hover {
 opacity: 0.8;
 -webkit-transition: all 0.3s ease;
 transition: all 0.3s ease
}
.mcon h2 {
 position: relative;
 margin-top: 20px;
 margin-bottom: 20px;
 padding: 0 0 0.2em;
 font-size: 26px;
 border-bottom: 3px solid #ccc;
}
.mcon h2:after {
 position: absolute;
 bottom: -3px;
 left: 0;
 z-index: 2;
 content: '';
 width: 20%;
 height: 3px;
 background-color: #9cbb1c;
}
.mcon h3 {
 margin-top: 16px;
 margin-bottom: 16px;
 padding: 0 0.5em;
 color: #333;
 font-size: 22px;
 border-bottom: 1px dotted rgba(153, 153, 153, 1);
}
.mcon h4 {
 font-size: 18px;
 margin-bottom: 5px;
 margin-top: 5px;
 color: #EF7E00;
}
.mcon h5, .mcon h6 {
 font-size: 1.1em;
 margin-bottom: 2px;
 margin-top: 5px;
}
.mcon hr {
 border: none;
 border-top: 1px dotted #000
}
.mcon iframe {
 max-width: 100%
}
.mcon img {
 max-width: 100%;
 height: auto
}
.mcon ol {
 margin-top: 1em;
 margin-bottom: 0.5em
}
.mcon ol li {
 margin-left: 2em;
 margin-bottom: 0.5em
}
.mcon p {
 margin-bottom: 1em
}
.mcon ul {
 margin-top: 1em;
 margin-bottom: 0.5em
}
.mcon ul li {
 list-style-type: disc;
 margin-left: 1.5em;
 margin-bottom: 0.5em
}
.table_box {
 width: 960px;
}