@charset "utf-8";

/*-　+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
■　header・グローバルナビ
@media screen and (min-width:1280px) {※以下：PCのみ}
@media screen and (max-width:1279px) {※以下：タブレットのみ}
@media screen and (max-width:599px) {※以下：スマホのみ}
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++　--*/

/*-------------------------------
■　共通
-------------------------------*/
header {
/*background:#000;*/
width: 100%;
position: fixed;
z-index: 30;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
/*box-shadow: #555 2px 2px 2px;*/
}

/*-- h1--*/
header h1 {
display: block;
position: absolute;
}

/*-- 2階層式メニュー --*/
#g_navi ul li a.ac_menu {
cursor: pointer;
overflow: hidden;
}

/*-------------------------------
■　PC
-------------------------------*/
@media screen and (min-width:1440px) {

/*header固定分の上部余白＝headerの高さ*/
#top_slide{padding-top: 80px;}

/*ページ内リンクの余白＝headerの高さ*/
html {scroll-padding-top: 80px;scroll-behavior: smooth;}

/*-----------【header】-----------*/
header {
background: url(../img/header_bg.png) repeat-x top center scroll;
height: 150px;
font-family: "Noto Sans JP";
}
header h1 {
top: 70px;
left: 50%;
margin-left: -700px;
}
header .header_h1_text{
color: #333;
font-size: 12px;
line-height: 1.6;
font-weight: bold;
top: 26px;
left: 50%;
margin-left: -410px;
letter-spacing: 1px;
position: absolute;
}
header #g_navi {
top: 70px;
right: 50%;
margin-right: -735px;
}

/*-- 2つのheaderを切り替えトリガーjsはscript.jsにて【if ($(window).scrollTop() >】--*/
header.fixed {
background:#6e6a67;
height: 120px;
}

/*-- btn --*/
.menu_btn, .btn_close {
display: none;
}
/*-- SNS --*/
header .h_sns {
height: 45px;
top: 15px;
left: 50%;
margin-left: 125px;
position: absolute;
}
header .h_sns{
display: flex;
width: auto;
flex-direction: row;
flex-wrap: nowrap;
align-content: flex-end;
justify-content: flex-start;
align-items: stretch;
}
header .h_sns a{
display: block;
margin: 10px;
}
header .h_sns a img{
padding: 0;
width: 28px;
height: 28px;
}

/*-----------【navigation】-----------*/
#g_navi {
position: absolute;
right: 10px;
top: 0px;
width: auto;
/*margin-left: 200px;*/
display: block !important;
z-index: 1000;
}
#g_navi ul{
max-width: 1280px;
width: 100%;
margin: auto;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: nowrap;
-webkit-justify-content: space-between;
align-content: space-around;
flex-direction: row;
align-items: stretch;
justify-content: center;
}
#g_navi ul li {
display: inline;
}
#g_navi ul li.btn-box	{
width: 220px;
color: #fff;
background: #806858;
line-height: 1.0;
height: auto;
display: inline-block;
text-align: center;
padding: 13px 10px 0;
border-left: #9d8b75 1px solid;
}
#g_navi ul li.btn-box .nav_tel a {
font-family: 'Noto Sans JP';
position: relative;
font-size: 22px;
font-weight: bold;
line-height: 1.0;
padding: 0px;
margin: 0px 0;
text-align: center;
display: block;
background: transparent;
color: #ffffff;
width: auto;
height: auto;
text-decoration: none;
letter-spacing: 0px;
border: none;
}
#g_navi ul li.btn-box .nav_tel a:hover{
color: #fff;
opacity: 1.0;
}
#g_navi ul li.btn-box .nav_tel a i {
font-size: 90%;
}
#g_navi ul li.btn-box .tel-txt-2{
font-size: 14px;
line-height: 1;
padding: 3px;
width: 90%;
margin: 0 auto;
margin-bottom: 8px;
display: block;
font-weight: normal;
letter-spacing: 2px;
background: #7fa96a;
border-radius: 50px;
}
#g_navi ul li.btn-box .time{
font-size: 14px;
padding-top: 0px;
padding-bottom: 0px;
margin-top: 6px;
font-weight: normal;
display: block;
}
#g_navi li a {
/* font-family: "Kosugi Maru", sans-serif; */
width: auto;
/* height: 100px; */
height: auto;
color: #ffffff;
font-size: 16px;
line-height: 1.2;
font-weight: 400;
padding: 0px 2.4em 0px;
/* margin: 0px auto; */
text-align: center;
text-decoration: none;
letter-spacing: 0px;
position: relative;
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: center;
justify-content: center;
align-items: center;
border-left: #fff 1px solid;
}

/*#g_navi li a::before {
display: block;
height: 2px;
position: absolute;
top: 2px;
width: 70%;
left: 15%;
background-color: rgba(17, 187, 221, 0);
content: '';
-webkit-transition: 0.2s linear;
-moz-transition: 0.2s linear;
transition: 0.2s linear;
}
#g_navi li a:hover::before {
background-color: #9d8b75;
top: 0px;
width: 80%;
left: 10%;
}*/

/* en */
#g_navi li a .en{
font-size: 86%;
color: #9d8b75;
font-weight: normal;
padding-top: 5px;
/*display: block;*/
display: none;
}
/* icon */	
#g_navi li a i.icon{
font-size: 34px;
color: #ddf2d7;
display: block;
margin:8px 10px 15px 10px;
}

/*BTN-BOX*/
#g_navi li.btn-box a.nav_mail {
background-color: #9d8b75;
color: #ffffff !important;
border-radius: 40px;
border: #9d8b75 2px solid;
padding: 5px 0px;
font-size: 12px;
line-height: 1.0;
margin:5px auto 0px;
text-align: center;
display: block;
width: 100%;
height: auto;
}
#g_navi li.btn-box a.nav_mail::hover {
color: #9d8b75;
background-color: #fff;
border: #9d8b75 2px solid;
}
#g_navi li.btn-box a::before {
display: none;
}
#g_navi ul li.pc_none {
display: none;
}

/*-- ************　▼2階層メニュー▼　************* --*/
#g_navi ul li:hover > a.ac_menu, 
#g_navi li a.ac_menu:hover {
position: relative;
}

/*▲三角矢印*/
/*#g_navi li a.ac_menu:hover::after {
border-right: 15px solid transparent;
border-bottom: 20px solid #fff;
border-left: 15px solid transparent;
content: "";
position: absolute;
bottom: -10px;
left: 50%;
margin-left: -14px;
z-index: 10;
transition: 0.2s linear;
}*/

/*#g_navi ul li:hover > a.ac_menu::after, #g_navi li a.ac_menu:hover::after {
border-bottom: 20px solid #fff;
}*/

/*------- 2階層目 -------*/
#g_navi ul li div.ac_list {
background-color:rgba(255,255,255, 0.9) ;
opacity:0;
visibility: hidden;
position: absolute;
z-index: 2000;
top:35px;
left: 0px;
transition: .3s;
width: 100%;
height: auto;
padding:0px;
/*box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 3px 0px;*/
}
#g_navi ul li ul {
max-width: 1200px;
padding-left: 0%;
}
#g_navi ul li ul {
width: 100%;
margin: auto;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
align-content: flex-start;
align-items: stretch;
flex-direction: row;
justify-content: flex-start;
}
#g_navi li .ac_list ul li{
width:20%;
padding: 15px 15px;
}
#g_navi li .ac_list ul li a{
padding: 10px 10px;
line-height: 1.4;
letter-spacing: 1px;
color: #442b17;
/*background:#ebe2d2;*/
border-radius: 5px;
}
#g_navi li ul li a {
display: block;
line-height: 1.4;
background: transparent;
border-right: none;
margin:0 auto;
padding:0;
height: auto;
text-align: left;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
#g_navi ul li ul li a:hover {
background: #a6937c;
color: #fff;
}
#g_navi ul li ul li a::before {
content: "-";
padding-right: 0.5em;
}
#g_navi ul li:hover div {
visibility: visible;
opacity: 1;
}
#g_navi div.ac_list {
display: block !important;
}

/*------- 横並びの場合 -------*/
#g_navi ul li ul {
max-width: unset;
width: 100%;
margin: auto;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
align-content: flex-start;
align-items: stretch;
flex-direction: column;
justify-content: flex-start;
}
#g_navi li .ac_list ul li {
width:auto;
padding: 0;
}
#g_navi ul li div.ac_list {
left: unset;
}
#g_navi ul li div.ac_list {
background-color: unset;
}
#g_navi li .ac_list ul li a {
width: 100%;
min-width: 148px;
font-size: 15px;
font-weight: normal;
padding: 15px 20px;
line-height: 1.4;
letter-spacing: 1px;
color: #ffffff;
background: #6d6a67;
border-radius: 0;
border-bottom: #a1937f 1px solid;
border-left: none;

}
#g_navi ul li ul li a:hover {
opacity: 1.0;
background: #999083;

}

/*-- ************　//2階層メニュー　************* --*/

/*-- --▼作業用に2階層目を表示する場合▼--
#g_navi ul li div.ac_list {
opacity:1;
visibility:visible;
}
--*/
}

/*-------------------------------
■　タブレット
-------------------------------*/
@media screen and (max-width:1440px) {
/*header固定分の上部余白＝headerの高さ*/
#top_slide{padding-top: 52px;}

/*ページ内リンクの余白＝headerの高さ*/
html {scroll-padding-top: 52px;scroll-behavior: smooth;}

/*-----------【header】-----------*/
header {
top: 0px;
height: 52px;
background: #6e6a67;
}
#subPage header {
top: 0px;
height: 52px;
}
header h1 {
position: unset;
}
header h1 a img {
position: absolute;
top: 19px;
left: 20px;
height: 13px;
}
header .h_menu {
display: none;
}
header #info {
display: none;
}
header .header_h1_text{
display: none;
}
header .h_sns {
display: none;
}
/*-----------【navigation】-----------*/
#g_navi {
position: fixed;
width: 100%;
height: 100%;
top: 0px;
overflow: auto;
z-index: 3000;
background-color:#dad8d8;
display: none;
/*padding-left: 10%;*/
}
#g_navi ul.nav_set {
display: -webkit-flex;
display: flex;
-webkit-flex-flow: column;
flex-flow: column;
-webkit-justify-content: center;
justify-content: flex-start;
min-height: 100%;
margin-top: 6em;
}
#g_navi ul li a {
font-family: "Zen Maru Gothic", sans-serif;
font-size: 110%;
color: #6e6a67;
background: #dad8d8;
text-decoration: none;
display: block;
padding:18px 20px;
line-height: 1.2;
font-weight: bold;
letter-spacing: 2px;
border-bottom: 1px dotted #999;
}
#g_navi li a .en{
display: none;
}
#g_navi ul li.icon a:before {
content: "\f105";
font-family: FontAwesome;
margin-right: 1em;
color: #9d8b75;
}
#g_navi ul li a:hover {
color: #fff;
background-color:#6e6a67;
}
#g_navi ul li.icon a:hover:before {
color: #fff;
}
#g_navi ul li.btn-box a.nav_mail {
text-align: center;
background-color: #ffffff;
color: #9d8b75;
max-width: 80%;
width: 300px;
margin: 0 auto 10px;
padding: 10px;
border-radius: 50px;
}
#g_navi ul li.btn-box	{
max-width: 92%;
width: fit-content;
display: inline-block;
background: #9d8b75;
color: #fff;
line-height: 1.0;
padding:10px 30px;
margin: 25px auto;
text-align: center;
border-radius: 5px;
/*INFO　BOX*/
display: none;
}
#g_navi ul li.btn-box .nav_tel a	{
font-weight: bold;
font-size: 180%;
line-height: 1.4;
margin: 5px;
display: block;
background: transparent;
color: #fff;
width: auto;
/* float: none; */
height: auto;
text-decoration: none;
letter-spacing: 0;
border-bottom: none;
padding: 0;
}
#g_navi ul li.btn-box .nav_tel a:hover{
color: #fff;
opacity: 1.0;
}
#g_navi ul li.btn-box .time	{
font-size: 12px;
}
#g_navi ul li a img,
#g_navi ul li a i{
display: none;
}

/*-----------【menu】-----------*/

.menu_btn {
display: block;
height: 40px;
width: 40px;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
position: absolute;
z-index: 5000;
top: 5px;
right: 10px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
cursor: pointer;
}
.menu_btn:hover {
cursor: pointer;
}
.menu_btn span {
width: 30px;
height: 4px;
display: block;
position: absolute;
left: 50%;
top: 50%;
margin-left: -14px;
background-color: #ffffff;
}
.menu_btn span {
transition: all 0.3s;
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
.menu_btn span.top {
transform: translateY(-8px);
-webkit-transform: translateY(-8px);
-moz-transform: translateY(-8px);
}
.menu_btn span.bottom {
transform: translateY(8px);
-webkit-transform: translateY(8px);
-moz-transform: translateY(8px);
}
.menu_btn:hover span.top {
transform: translateY(-10px);
-webkit-transform: translateY(-10px);
-moz-transform: translateY(-10px);
}
.menu_btn:hover span.bottom {
transform: translateY(10px);
-webkit-transform: translateY(10px);
-moz-transform: translateY(10px);
}
.menu_btn.opened span {
background-color: #ffffff;
}
.menu_btn.opened span.middle {
background: rgba(255, 255, 255, 0);
transform: translateX(30px);
-webkit-transform: translateX(30px);
-moz-transform: translateX(30px);
}
.menu_btn.opened span.top {
transform: rotate(-45deg) translateY(0px);
-webkit-transform: rotate(-45deg) translateY(0px);
-moz-transform: rotate(-45deg) translateY(0px);
}
.menu_btn.opened span.bottom {
transform: rotate(45deg) translateY(0px);
-webkit-transform: rotate(45deg) translateY(0px);
-moz-transform: rotate(45deg) translateY(0px);
}

/*-----------【BTN】-----------*/
header .h_btn a, header .h_tel a {
position: absolute;
display: block;
width: 34px;
height: 34px;
top: 8px;
right: 60px;
padding: 9px 0 0;
font-size: 16px;
line-height: 1;
letter-spacing: 0;
text-align: center;
color: #fff;
background:#032137;
border-radius: 5px;
}

/*-- *****　▼2階層メニュー▼　***** --*/
#g_navi ul li a.ac_menu {
position: relative;
background-image: none;
}
#g_navi ul li a.ac_menu::after {
content: " ";
font-size: 16px;
line-height: 32px;
position: absolute;
right: 20px;
color:#9b8045;
}
#g_navi ul li a.ac_menu.active {

}
#g_navi ul li a.ac_menu.active::before {
content: "\f107";
font-family: FontAwesome;
margin-right: 1em;
}
#g_navi ul li ul li {
background: rgba(255,255,255,0.2);
}
#g_navi ul li ul li a::before {
content: "└" !important;
padding-right: 5px;
}
/* OPEN・CLOSE */
#g_navi div.ac_list {display: none;}
/*-- *****　//2階層メニュー　***** --*/
}

/*-------------------------------
■　ニュースティッカー
-------------------------------*/
.header_news{
background: #6e6a67;
border-bottom: #6E6A67 3px solid;
}
.ticker {
white-space: nowrap;
width: 100%;
height: 35px;
line-height: 1;
display: flex;
align-items: center;
overflow: hidden;
}
.ticker ul {
display: flex;
align-items: center;
animation: ticker 100s linear infinite;
flex-direction: row;
flex-wrap: nowrap;
align-content: space-around;
justify-content: flex-start;
}
.ticker ul li {
margin: 0 5em;
}
.ticker ul li a{
color: #fff;
font-size: 15px;
font-weight: normal;
}

@keyframes ticker {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-100%);
}
}

/*下層ページでは消す*/
#subPage .header_news .ticker .news_list{
display: none;
}

@media screen and (min-width:1440px) {
/*-- スクロール後　--*/
header.fixed {
background: #6e6a67;
height: 85px;
}
header.fixed .header_news {
display: none;
}
header.fixed h1 {
top: 35px;
}
header.fixed #g_navi {
top: 32px;
}
}
@media screen and (max-width:1440px) {
header .header_news {
display: none;
/*position: fixed;
top: 0;*/
}
}
