@charset "UTF-8";

html {
  font-size: 100%;
  scroll-behavior: smooth;
}
body {
  font-size: 1rem;
  font-family: 'Noto Sans','Noto Sans JP',sans-serif;
}
a {
  text-decoration: none;
}
li {
  list-style: none;
}
a {
  text-decoration: none;
  }

body {
overflow-x: hidden;
}


/* **********************************************************

z-indexについて

********************************************************** */

/* 
headerContent 90
navMain ナビメニュー 100
mainMenu ハンバーガーメニュー 100

heroMovie -100

heroMiniGalGrid 60
heroMiniGalBackWave 50

GalleryTopLi img スペースギャラリー 3
重ならないよう対応

fuyoContent ふよふよ説明 50 */





/* **********************************************************

テーマの設定

********************************************************** */


/* カラーパレットの設定*/
.has-skyblue-background-color {
	background-color: #00A1C6;
}
.has-skyblue-color {
	color: #00A1C6;
}
.has-light-skyblue-background-color {
	background-color: #ECF5F7;
}
.has-light-skyblue-color {
	color: #ECF5F7;
}
.has-light-gray-background-color {
	background-color: #F7F6F5;
}
.has-light-gray-color {
	color: #F7F6F5;
}
.has-gray-background-color {
	background-color: #767268;
}
.has-gray-color {
	color: #767268;
}
.has-dark-gray-background-color {
	background-color: #43413B;
}
.has-dark-gray-color {
	color: #43413B;
}

/* 文字サイズの設定*/
.has-x-small-font-size {
	font-size: 0.63636rem;
}
.has-small-font-size {
	font-size: 0.72727rem;
}
.has-normal-font-size {
	font-size: 0.81818rem;
}
.has-large-font-size {
	font-size: 1.09091rem;
}
.has-huge-font-size {
	font-size: 1.63636rem;
}



/* **********************************************************

画像

********************************************************** */

img {
  vertical-align: bottom;
  height: auto;
}
.imgPare{
    overflow: hidden;
}



/* **********************************************************

フォントサイズ

********************************************************** */

p{
    font-size: 14px;
}

h1{
    font-size: 75px;
    font-family: serif;
}
h2{
    font-size: 40px;
    font-family: serif;
}
h3{
    font-size: 28px;
    font-family: sans-serif;
}
h4{
    font-size: 24px;
    font-family: sans-serif;
    font-weight: normal;
}
h5{
    font-size: 20px;
    font-family: serif;
}
h6{
    font-family: sans-serif;
    font-size: 16px !important;
}



/* **********************************************************

カラー定義

********************************************************** */


:root{
    /* ベース */
    --BaseBase: #f5f5f5;
    --BaseArticle: #fff;
    /* パートカラー */
    --PartTheme: #80796c;
    --PartSubTheme1: #80796c;
    --PartSubTheme2: #e6e2d7;
    --FormGray: #777;
    --FooterBase: #80796c;
    --MenuHover:rgb(114, 167, 236) ;
    /* テキスト */
    --Text: #333;
    --TextRev: #fff;
    --TextCatch: #777;
    --TextTheme: #00633a;
    --TextSubTheme1: #80796c;
    --TextSubTheme2: #e6e2d7;
    --LincColor:#3b82ca;
    /* ボタン */
    --BtnTheme: #80796c;
    --BtnRev: #fff;
    --SendBtnTheme: #00633a;
    --SendBtnRev: #fff;
    /* 表 */
    --TableBorder: #777;
    --TableBorderRev: #e6e2d7;
    --TableBorderMq: #80796c;
    --TableBorderRevMq: #00633a;
    --TableTextRev: #fff;
    /* タグ */
    --Tag: #80796c;
    --TagRev: #fff;
    /* ページネーション */
    --PagiText: #333;
    --PagiTextRev:#fff;
    --PagiBorder: #edeceb;
    --PagiBase: #f7f6f5;
    --PagiTheme: #00633a;
    /* 前後 */
    --PrevNxtArrow: #777;
    /* 区切り線 */
    --LineGray: #777;
    /* ベース */

}
body{
    color: var(--Text);
}
a{
    color: var(--Text);
}
.linkColor{
    color: var(--LincColor);
}




/* **********************************************************

wrapper

********************************************************** */


.mainBase{
    background-color:var(--BaseBase);
    padding-bottom:140px;
}
.MainBaseAdd{
    background-color: var(--PartTheme);
}
.MainBaseRevColor{
    background-color: var(--PartTheme);
}
.sectionBase{
    background-color:var(--BaseBase);
}
.sectionBaseAnother{
    background-image: 
    linear-gradient(var(--BaseBase),var(--BaseBase) 80%,var(--PartTheme) 80%,var(--PartTheme));
    background-color:var(--BaseBase);
}
.container{
    max-width: 1470px;
    margin: 0 auto;
    width: 90%;
}
.containerTaxo{
    max-width: 1470px;
    padding: 0 4%;
    margin: 0 auto;
}
.wrapper{
    max-width: 1140px;
    width: 60%;
    margin: 0 auto;
}
.inner{
    max-width: 1140px;
    width: 54%;
    margin: 0 auto;
}
.containerIndex{
    background-color: var(--BaseArticle);
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    padding: 5px;
}
.containerArticle{
    background-color: var(--BaseArticle);
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    padding: 30px 0;
}
.containerArticleFlex{
    background-color: var(--PartTheme);
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    padding: 120px 6% 60px;
    display: flex;
    justify-content: space-between;
    margin-top: -100px;
}
.containerArticleLeft{
    width: 52%;
}
.containerArticleRight{
    width: 43%;
}
.spacer50baseColor{
    height: 50px;
    background-color: var(--BaseBase);
}
.spacer100baseColor{
    height: 100px;
    background-color: var(--BaseBase);
}

@media(max-width:840px){
    .container{
    width: 100%;
    padding: 0 4%;
    }
    .containerTaxo{
    padding: 2%;
    }
    .wrapper{
    width: 100%;
    padding: 0 4%;
    }
    .inner{
    width: 100%;
    padding: 0 4%;
    }
    .containerArticleFlex{
    padding: 100px 4% 60px;
    flex-direction: column;
    }
    .containerArticleLeft{
        width: 100%;
        margin-bottom: 60px;
    }
    .containerArticleRight{
        width: 100%;
    }
    .sectionBaseAnother{
    background-image: 
    linear-gradient(var(--BaseBase),var(--BaseBase) 85%,var(--PartTheme) 85%,var(--PartTheme));
    background-color:var(--BaseBase);
}
}